Home/ Questions/Q 7558951
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-30T12:30:28+00:00

I have a drop down list with each value corresponding to a case/switch statement

  • 0

I have a drop down list with each value corresponding to a case/switch statement which will display a grid of text input fields with a submit button. However it doesn’t seem to work. Please check the fiddle or the code below.

http://jsfiddle.net/7PEhv/3/

    <html>
    <body>
      <FORM NAME=frmOne>
      <select name='myfield' onchange='this.form.submit()'>
        <option value = 2>2x2</option>
        <option value = 3>3x3</option>
        <option value = 4>4x4</option>
        <option value = 5>5x5</option>
      </select>
      </form>

    <script type="text/javascript">

      size = document.frmOne.myfield.value

      switch (size)
      {
        case 2:
          <input type="integer" name="name1"/>
          <input type="integer" name="name2"/>
          <input type="integer" name="name3"/>
          <input type="integer" name="name4"/>
          <input type="button" Value="Add Into Array" 
          onclick="insert(this.form.name.value), insert2(this.form.name2.value);"/>
        break;
        case 3:
          <input type="integer" name="name1"/>
          <input type="integer" name="name2"/>
          <input type="integer" name="name3"/>
          <input type="integer" name="name4"/>
          <input type="integer" name="name5"/>
          <input type="integer" name="name6"/>
          <input type="integer" name="name7"/>
          <input type="integer" name="name8"/>
          <input type="integer" name="name9"/>
          <input type="button" Value="Add Into Array" 
          onclick="insert(this.form.name.value), insert2(this.form.name2.value);"/>
       break;
       case 4:
         <input type="integer" name="name1"/>
         <input type="integer" name="name2"/>
         <input type="integer" name="name3"/>
         <input type="integer" name="name4"/>
         <input type="integer" name="name5"/>
         <input type="integer" name="name6"/>
         <input type="integer" name="name7"/>
         <input type="integer" name="name8"/>
         <input type="integer" name="name9"/>
         <input type="integer" name="name10"/>
         <input type="integer" name="name11"/>
         <input type="integer" name="name12"/>
         <input type="integer" name="name13"/>
         <input type="integer" name="name14"/>
         <input type="integer" name="name15"/>
         <input type="integer" name="name16"/>
         <input type="button" Value="Add Into Array" 
         onclick="insert(this.form.name.value), insert2(this.form.name2.value);"/>

       break;
       default:
         document.write("Pick a selection");
       }
    </script>  

   </body>
 </html>​
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If I correctly guessed what you need here’s the code that you require: http://jsfiddle.net/uJABa/5/ You will need to tweak it a bit, to have insert function successfully execute, but I think you can get the idea from the code.

    function showBoxes(select)
{
   var selectedValue = $(select).find('option:selected').val();
      switch (selectedValue)
      {
        case "2":
          $("#grid").html('<input type="integer" name="name1"/><input type="integer" name="name2"/><input type="integer" name="name3"/><input type="integer" name="name4"/><input type="button" id="insertButton" Value="Add Into Array"/>');
          break;
        case "3":
          $("#grid").html('<input type="integer" name="name1"/><input type="integer" name="name2"/><input type="integer" name="name3"/><input type="integer" name="name4"/><input type="integer" name="name5"/><input type="integer" name="name6"/><input type="integer" name="name7"/><input type="integer" name="name8"/><input type="integer" name="name9"/><input id="insertButton" type="button" Value="Add Into Array"/>');
          break;
        default:
          console.log("Select valid value");
          break;
      }
   $("#insertButton").click(insert);
}

function insert() {}
    • 0