Home/ Questions/Q 8400767
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-09T21:38:19+00:00

I’m attempting to make a form that asks the user for a number of

  • 0

I’m attempting to make a form that asks the user for a number of units, then asks whether or not they would like those units to be provisioned, and depending on the answer, generates text fields corresponding with the number of units the typed in, along with a text field asking for an account number.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">

</script>


<script type="text/javascript">

function Getunits(value) {
var units = document.getElementById('units');
for(count=0; count<=units; count++) {
$("<input type='text'>").appendTo("inpane");
 }
document.getElementByTag('futureacc').InnerHTML='What is your account number? <input type="text" value="accountnum">';

}
</script>
</head>
<body>
<div id="container">
<form method="post" action="sendcontact.php">
<div id="unitammount" class="inpane">
Number of units ordered: <input type="text" name="units" id="units"/><br />
</div>

<div id="futureacc" class="inpane">
Are these units to be provisioned? <input type="radio" name="select" value="yes" onClick="Getunits('units.value')"/> Yes <input type="radio" name="select" value="no"/> No
</div>

Obviously I would like the new text fields to appear inside the futureacc div and inpane div respectively.

I don’t know whether it’s the loop that doesn’t do anything or that I’m not appending correctly but as I currently have it this does nothing…

Any help would be greatly appreciated.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You had a number of errors with your code. It was confusing because you were mixing jQuery and pure Javascript. It’s generally better to just use jQuery if you’ve decided to use it anyway. Your loop should have been iterating while it was smaller than units.val(), not while it was smaller than or equal to units. innerHTML is spelled with a lowercase “i,” and your appendTo selector needed a period before the class name. I went ahead and cleaned up your code so it should work now!

    HTML:

    <div id="container">
    <form method="post" action="sendcontact.php">
        <div id="unitammount" class="inpane">
              Number of units ordered: <input type="text" name="units" id="units"/>
        </div><br>

        <div id="futureacc" class="inpane">
            Are these units to be provisioned? <input type="radio" name="select" value="yes" onClick="getUnits()"/> Yes <input type="radio" name="select" value="no"/> No <br>
        </div>
    </form>
</div>​

    Javascript:

    function getUnits() {
    var units = $("#units").val();
    for (var count = 0; count < units; count++) {
        $("<input type='text' /><br>").appendTo("#futureacc");
    }
    $("#futureacc").append('<br>What is your account number? <input type="text" placeholder="accountnum">');
}​

    WORKING DEMO

    • 0