php - Variables in javascript, auto populate form -
i'm having problem receiving more 8 values javascript on script... should auto populate fields on dropdown option (select), work properly, can't more 8 values... where's problem? thanks!
<script type="text/javascript"> // format of storedetails() // name,addr1,addr2,addr3,phone,fax,email,webpage, url var storedetails = [ ['please select','','','','','','','',''], ['please select','test1','test2','test3','test4','test5','test6','test7','test8'] // note: no comma ]; function setup(ta) { var str = "<select id='store' class='styled-select' onchange='storeinfo()'>"; (var i=0; i<storedetails.length; i++) { str += '<option value="'+storedetails[i].join('|')+'">'+storedetails[i] [0]+'</option>'; } str +='</select>'; document.write(str); } function storeinfo() { var sel = document.getelementbyid('store').selectedindex; var tmp = []; tmp.push(sel); (var i=1; i<8; i++) { tmp.push(storedetails[sel][i]); } document.getelementbyid('txtname').value = tmp[1]; document.getelementbyid('txtaddr1').value = tmp[2]; document.getelementbyid('txtaddr2').value = tmp[3]; document.getelementbyid('txtaddr3').value = tmp[4]; document.getelementbyid('txtphone').value = tmp[5]; document.getelementbyid('txtphone2').value = tmp[6]; document.getelementbyid('txtemail').value = tmp[7]; document.getelementbyid('txtwebpage').value = tmp[8]; document.getelementbyid('txturl').value = tmp[9]; } </script> </head> <body> <div class="container"> <header class="clearfix"> <img src="logo.png"/> <nav class="codrops-demos"> <a class="current-demo" href="index.php">some text</a> </nav> </header> <section class="main clearfix"> <div class="fleft"> <p>da bi porucili vizit karte, izaberite ime kolicinu, zatim potvrdite.</p> </div> <div class="fleft"> <form id="testconfirmjq" name="testconfirmjq" method="post" action="output.php"> <script type="text/javascript">setup();</script> <table border="0"> <input type="text" hidden="hidden" id="txtname" name="txtname" size="30" value=""> </td></tr> <input type="text" hidden="hidden" id="txtaddr1" name="txtaddr1" size="30" value=""> </td></tr> <input type="text" hidden="hidden" id="txtaddr2" name="txtaddr2" size="30" value=""></td></tr> <input type="text" hidden="hidden" id="txtaddr3" name="txtaddr3" size="30" value=""> </td></tr> <input type="text" hidden="hidden" id="txtphone" name="txtaddr3" size="30" value=""> </td></tr> <input type="text" hidden="hidden" id="txtphone2" name="txtphone2" size="30" value=""></td></tr> <input type="text" hidden="hidden" id="txtemail" name="txtemail" size="30" value=""> </td></tr> <input type="text" hidden="hidden" id="txturl" name="txturl" size="30" value=""></td> </tr> <tr><td>how much?:</td><td><input type="text" id="kolicina" name="kolicina" size="5" value=""></td></tr> <tr><td><input id="submitjq" name="submitjq" type="submit" class="styled-button-1" value="confirm" /></td></tr> </table> </form>
you're limiting size of tmp
in loop (ranging i = 1
i < 8
). few changes:
var storedetails = [ ['a store','test1','test2','test3','test4','test5','test6','test7','test8','url'] // note: no comma ]; function setup() { var str = "<select id='store' class='styled-select' onchange='storeinfo()'>"; str += '<option disabled="disabled" selected="selected">please select</option>'; (var i=0; i<storedetails.length; i++) { str += '<option value="'+storedetails[i].join('|')+'">'+storedetails[i] [0]+'</option>'; } str +='</select>'; document.write(str); } function storeinfo() { var sel = document.getelementbyid('store').value; var values = sel.split("|"); document.getelementbyid('txtname').value = values[1]; document.getelementbyid('txtaddr1').value = values[2]; document.getelementbyid('txtaddr2').value = values[3]; document.getelementbyid('txtaddr3').value = values[4]; document.getelementbyid('txtphone').value = values[5]; document.getelementbyid('txtphone2').value = values[6]; document.getelementbyid('txtemail').value = values[7]; document.getelementbyid('txtwebpage').value = values[8]; document.getelementbyid('txturl').value = values[9]; } setup();
...and form:
<form> <input id="txtname" /> <input id="txtaddr1" /> <input id="txtaddr2" /> <input id="txtaddr3" /> <input id="txtphone" /> <input id="txtphone2" /> <input id="txtemail" /> <input id="txtwebpage" /> <input id="txturl" /> </form>
this code is working in environment.
Comments
Post a Comment