Fill in the data in the input field automatically

Question

I have four input fields. If the user fills in the first field and presses the button, he should autofill the remaining input fields with the user input value in the first field. Can this be done using javascript? Or should I say to fill in the text fields with the latest data entered by the user?

Answer 1

Press the button, call this function

function fillValuesInTextBoxes() { var text = document.getElementById("firsttextbox").value; document.getElementById("secondtextbox").value = text; document.getElementById("thirdtextbox").value = text; document.getElementById("fourthtextbox").value = text; } 

Answer 2

Yes it is possible. For instance:

  <form id="sampleForm"> <input type="text" id="fromInput" /> <input type="text" class="autofiller"/> <input type="text" class="autofiller"/> <input type="text" class="autofiller"/> <input type="button"value="Fill" id="filler" > <input type="button"value="Fill without jQuery" id="filler2" onClick="fillValuesNoJQuery()"> </form> 

with javascript

  function fillValues() { var value = $("#fromInput").val(); var fields= $(".autofiller"); fields.each(function (i) { $(this).val(value); }); } $("#filler").click(fillValues); 

Suppose you have jQuery . You can see how it works here: http://jsfiddle.net/ramsesoriginal/yYRkM/

Although I would like to point out that you should not include jQuery only for this function ... if you already have this, this is great, but just go to:

  fillValuesNoJQuery = function () { var value = document.getElementById("fromInput").value; var oForm = document.getElementById("sampleForm"); var i = 0; while (el = oForm.elements[i++]) if (el.className == 'autofiller') el.value= value ; } 

You can also see this in action: http://jsfiddle.net/ramsesoriginal/yYRkM/

Answer 3

or if input: checkbox

 document.getElementById("checkbox-identifier").checked=true; //or ="checked"