Jump to content

Recommended Posts

Well, if you want to take accessability in mind as well as compatability for user without JS enabled I would start go with a max number of input boxes and then show/hide the appropriate number. Then if the user does not have JS enabled they will just get the max allowable.

 

If you can't go with a max value then you will have to create the fields dynamically which will prevent anyone without JS enabled from using your page. Plus, you will have to think about what to do if the user wants to reduce the number of fields (if anything).

 

Here's a script I alredy have which starts with four fields and then as you get to the end will continue to add fields one at a time automatically. I like this better than adding a predetermined set of fields specified by the user as it only adds fields as they need them. But, this could be easily modified to do exactly as you asked in your post

 

<html>
<head>

<script>

function addTiming(field)
{
  thisFieldIdx = field.id.substr(6);
  newFieldIdx  = thisFieldIdx*1 + 1;

  if (!document.getElementById('timing'+newFieldIdx))
  {
    timingDiv = document.getElementById('timings');
    timingDiv.innerHTML = timingDiv.innerHTML +
    'Timing '+newFieldIdx+': <input type="text" name="timing'+newFieldIdx+'" id="timing'+newFieldIdx+'" onfocus="addTiming(this);"><br>';
  }

  document.getElementById('timing'+thisFieldIdx).select();
  document.getElementById('timing'+thisFieldIdx).focus();
  return;
}

</script>
</head>

<body>
<form name="formname">

<div id="timings">

Timing 1: <input type="text" name="timing1" id="timing1"><br>
Timing 2: <input type="text" name="timing2" id="timing2"><br>
Timing 3: <input type="text" name="timing3" id="timing3"><br>
Timing 4: <input type="text" name="timing4" id="timing4" onfocus="addTiming(this);"><br>

</form>
</div>

</body>
</html>

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.