AJAX implementation Form form submission

1. Using AJAX to implement asynchronous operation, click the login button, that is, trigger the form of the submission of the event, data transfer to the backend

Jsp:

<script type= "Text/javascript" src= "resources/js/jquery.js" ></script><script type= "Text/javascript "Src=" resources/js/login.js "></script><form id =" form ">       <table align =" center ">           < tr>               <td> user name </td><td><input type = "text" id = "UserName" name = "UserName" ></td>< c3/></tr>           <tr>               <td> password </td><td><input type = "password" id = "USERPWD" name = " Userpwd "></td>           </tr>           <tr>               <td align =" left "><input id =" SUBMITBTN "type ="  Submit "VALUE =" Login "style =" Background-color:cyan;color:blue "></td>               <td align =" right "><button style = "Background-color:cyan;color:blue" ><a href = "/ssm/user/toregister" > Registration </a></button> </td>           </tr>       </table>     </form>

Js:

1$(function(){2$ ("#submitbtn"). Click (function(){3 login ();4     })5 })6 functionLogin () {7     varUserName = $ ("#userName"). Val ();//gets the value of the username8     varUserpwd = $ ("#userPwd"). Val ();//gets the value of the Userpwd9 $.ajax ({TenURL: "User/judgelogin", OneType: "POST", Adata:{"UserName": UserName, "Userpwd": Userpwd}, -DataType: "JSON",
 -Successfunction(returndata) {
 the alert (returndata);
 -  }
 -  })
 -}

JS Another method of passing a value:

1 function Login () {2 $.ajax ({3URL: "User/judgelogin",4Type: "POST",5data:$ ("#form"). Serialize (),//Serialization of Forms6DataType: "JSON",7 success:function (returndata) {8 alert (returndata);9         }Ten     }) One}

Controller layer Receive:

1     /**2 * Login Judgment3      * @paramUserdto4      * @return5      */6 @ResponseBody7@RequestMapping ("/judgelogin")8      PublicString judgelogin (userdto userdto) {9         intK =Userservice.judgelogin (userdto);Ten         if(k > 0) { One             return"--Login successful! --"; A}Else { -             return"--Login failed! --"; -         } the}

Effect Show:

AJAX implementation Form form submission