html - Javascript - Change iframe src with switch -
i've been struggling 2 days now. i've been asked build sort of log in page. doesn't have provide actual security, it's purpose direct people different sites based on code enter. i've got switch working , fire alerts when appropriate number sent through form, when give number should update iframe src, nothing happens. i'm thoroughly confused, i've got same code working update iframe button press, not work here. appreciated.
<!doctype html> <html> <head> <meta charset="utf-8"> <title>test</title> <style type="text/css"> body { background-image: url(images/bgtile.png); background-repeat: repeat; position: absolute; width: 100%; height: 100%; } .pageframe { padding: 0px; height: 797px; width: 1809px; overflow: hidden; position: absolute; z-index: 1; } .loginform { position: absolute; top: 45%; left: 50%; width: 211px; height: 74px; text-align: center; margin-left: -105.5px; margin-top: 42px; font-family: "gill sans", "gill sans mt", "myriad pro", "dejavu sans condensed", helvetica, arial, sans-serif; color: #ffffff; line-height: 21px; margin-bottom: 5px; z-index: 2; } .submitbutton { margin-top: 5px; } </style> </head> <script type="text/javascript"> <!-- function runlogin(form) { var login = form.dealerid.value; switch(login) { case "1": loaddealer("0"); break; case "2": alert("this"); break; case "3": alert("that"); break; default: alert("the other thing");; break; } } var dealershipsarray = [ "null_images/filmstripnull.html" ]; function loaddealer(i) { var dealership = document.getelementbyid("dealercontainer"); dealership.src = dealershipsarray[i]; } //--> </script> <body> <iframe id="dealercontainer" class="pageframe" scrolling="no" frameborder="0" seamless></iframe> <div class="lutherlogo"></div> <div id="loginbox" class="loginform"><form name="myform" onsubmit="runlogin(this)"> please enter dealer display code<br> <input type=text value="" name="dealerid"> <div class="submitbutton"><input type=button value="submit" name="mybutton"></div> </form> </div> </body> </html>
here working version.
i did fixes in 2 places:
- return false submit handler, otherwise form submits , refreshes itself
- the submit button should of type="submit" otherwise handler won't called
<!doctype html> <html> <head> <meta charset="utf-8"> <title>luther automotive display ad login</title> <style type="text/css"> body { background-image: url(images/bgtile.png); background-repeat: repeat; position: absolute; width: 100%; height: 100%; } .pageframe { padding: 0px; height: 797px; width: 1809px; overflow: hidden; position: absolute; z-index: 1; } .lutherlogo { position: absolute; background-image: url(images/lutherlogo.png); background-repeat: no-repeat; background-position: 50% 50%; width: 117px; height: 72px; top: 45%; left: 50%; margin-left: -58.5px; margin-top: -36px; } .loginform { position: absolute; top: 45%; left: 50%; width: 211px; height: 74px; text-align: center; margin-left: -105.5px; margin-top: 42px; font-family: "gill sans", "gill sans mt", "myriad pro", "dejavu sans condensed", helvetica, arial, sans-serif; color: #ffffff; line-height: 21px; margin-bottom: 5px; z-index: 2; } .submitbutton { margin-top: 5px; } </style> </head> <script type="text/javascript"> <!-- function runlogin(form) { var login = form.dealerid.value; switch(login) { case "1": loaddealer("0"); break; case "2": alert("foo"); break; case "3": alert("bar"); break; default: alert("foo bar"); break; } return false; } var dealershipsarray = [ "null_images/filmstripnull.html" ]; function loaddealer(i) { var dealership = document.getelementbyid("dealercontainer"); dealership.src = dealershipsarray[i]; } //--> </script> <body> <iframe id="dealercontainer" class="pageframe" scrolling="no" frameborder="0" seamless></iframe> <div class="lutherlogo"></div> <div id="loginbox" class="loginform"><form name="myform" onsubmit="runlogin(this)"> please enter dealer display code<br> <input type=text value="" name="dealerid"> <div class="submitbutton"><input type="submit" value="submit" name="mybutton"></div> </form> </div> </body> </html>
Comments
Post a Comment