ngreenwood6 Posted August 28, 2008 Share Posted August 28, 2008 I have created a form on my site. I want the form to move to the next text box automatically after the user fills in the first one. please let me know if you have any suggestions. thanks in advance. Link to comment https://forums.phpfreaks.com/topic/121774-move-between-text-boxes/ Share on other sites More sharing options...
obsidian Posted August 28, 2008 Share Posted August 28, 2008 I have created a form on my site. I want the form to move to the next text box automatically after the user fills in the first one. please let me know if you have any suggestions. thanks in advance. What is "full"? If they are typical text fields and you have a static number of characters required by the field, you could have a JavaScript function like this to help: function jumpField(ele, max_chars, new_field_id) { if (ele.value.length >= max_chars) { document.getElementById(new_field_id); } } Then, you would add something like this to your input declaration: <input type="text" name="my_field" id="my-field" onkeyup="jumpField(this, 5, 'my-other-field');" maxlength="5" /> <input type="text" name="my_other_field" id="my-other-field" maxlength="5" /> Also, I'm moving this to the JavaScript forums since this is a client side question... Link to comment https://forums.phpfreaks.com/topic/121774-move-between-text-boxes/#findComment-628230 Share on other sites More sharing options...
ngreenwood6 Posted August 28, 2008 Author Share Posted August 28, 2008 thanks for the help but I am a little confused. I am making a phone number field with three boxes. I have defined maxlength as 3 for the first two and 4 for the last two. could you show me how it would work for this. I do no know any javascript. thanks for the help. Link to comment https://forums.phpfreaks.com/topic/121774-move-between-text-boxes/#findComment-628244 Share on other sites More sharing options...
kratsg Posted August 28, 2008 Share Posted August 28, 2008 Here's a simple example, easily improved upon. (<input type="text" name="phone1" id="phone1" size="3" maxlength="3" onkeyup="if(this.value.length()==this.getAttribute('maxlength')){document.getElementById('phone2').focus();}">) - <input type="text" name="phone2" id="phone2" size="4" maxlength="4" onkeyup="if(this.value.length()==this.getAttribute('maxlength')){document.getElementById('phone3').focus();}"> - <input type="text" name="phone3" id="phone3" size="4" maxlength="4"> It's quite basic, all inside textboxes, and could be improved upon by separating it into a function which checks it's length and returns true/false, etc... Link to comment https://forums.phpfreaks.com/topic/121774-move-between-text-boxes/#findComment-628277 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.