Asp.net using Jquery
1 step . Download the Latest version of min file of jquery from this link
2 step.
Create a web page and add the references of js file in head tag of aspx page
});
</script>
<style type="text/css">
#area_code
{
width: 67px;
}
#number1
{
width: 51px;
}
#number2
{
width: 86px;
}
</style>
3 step.
<body>
<form id="form1" runat="server">
<div>
<div><strong>Phone Number:</strong></div>S
<input type="text" name="area_code" id="area_code" maxlength="3" size="3" /> -
<input type="text" name="number1" id="number1" maxlength="3" size="3" /> -
<input type="text" name="number2" id="number2" maxlength="4" size="5" />
</div>
</form>
</body>
output..
for reference http://www.mathachew.com/sandbox/jquery-autotab/
1 step . Download the Latest version of min file of jquery from this link
2 step.
Create a web page and add the references of js file in head tag of aspx page
<script src="jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="jquery.autotab-1.1b.js" type="text/javascript">Download jquery.autotab</script>
<script type="text/javascript">
$(document).ready(function () {
$('#area_code,#number1, #number2').autotab();
$('#area_code').autotab({ target: 'number1', format: 'numeric' });
$('#number1').autotab({ target: 'number2', format: 'numeric', previous: 'area_code' });
$('#number2').autotab({ previous: 'number1', format: 'numeric' });
});
</script>
<style type="text/css">
#area_code
{
width: 67px;
}
#number1
{
width: 51px;
}
#number2
{
width: 86px;
}
</style>
3 step.
<body>
<form id="form1" runat="server">
<div>
<div><strong>Phone Number:</strong></div>S
<input type="text" name="area_code" id="area_code" maxlength="3" size="3" /> -
<input type="text" name="number1" id="number1" maxlength="3" size="3" /> -
<input type="text" name="number2" id="number2" maxlength="4" size="5" />
</div>
</form>
</body>
output..
for reference http://www.mathachew.com/sandbox/jquery-autotab/
No comments:
Post a Comment