1 <h1>Ajax version</h1>2 3 <form id="the-form" action="/1/account/login/?" method="post">4 <input type="email" id="u" placeholder="User" required><br>5 <input type="password" id="p" placeholder="Password" required><br>6 <input type="submit" value="Login">7 </form>8 9 <script type="text/javascript">10 11 var form = document.getElementById('the-form');12 function sendForm(e) {13 if (form.checkValidity()) {14 var u = encodeURIComponent(document.getElementById('u').value);15 var p = encodeURIComponent(document.getElementById('p').value);16 17 var ajax = new XMLHttpRequest();18 ajax.open('post', '/1/account/login/?u='+u+'&p='+p);19 ajax.onreadystatechange = function() {20 if (ajax.readyState == XMLHttpRequest.DONE) {21 alert(ajax.responseText);22 }23 };24 ajax.send();25 }26 e.preventDefault();27 return false;28 }29 30 form.addEventListener('submit', sendForm, true);31 </script>32 33 <style type="text/css">34 form {35 max-width: 200px;36 display: block;37 margin: 0 auto;38 padding: 20px;39 border: solid silver 1px;40 }41 42 form input[type="email"],43 form input[type="password"],44 form input[type="submit"] {45 border: solid silver 1px;46 display: block;47 margin: 0 -1px;48 width: 100%;49 }50 51 form input[type="submit"] {52 padding: 8px 0;53 cursor: pointer;54 }55 56 form input[type="submit"]:hover {57 background: #F4F4F4;58 }59 </style>Este ShareCode tiene versiones:
- function addParams(fo... (18/07/2013)
- function addParams(fo... (18/07/2013)
Enlace
El enlace para compartir es: