`

ajax提交表单

 
阅读更多

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
   
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
   
    <!-- easyui的样式 -->
    <link rel="stylesheet" type="text/css" href="../js/jquery-easyui-1.3.1/themes/default/easyui.css">
    <!-- 小图标的样式 -->
    <link rel="stylesheet" type="text/css" href="../js/jquery-easyui-1.3.1/themes/icon.css">
   
    <script type="text/javascript" src="../js/jquery-easyui-1.3.1/jquery-1.8.0.min.js"></script>
    <script type="text/javascript" src="../js/jquery-easyui-1.3.1/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="../js/jquery-easyui-1.3.1/locale/easyui-lang-zh_CN.js"></script>
 
 <script type="text/javascript">
  var loginAndRegDialog;
  $(function(){
   loginAndRegDialog = $('#loginAndRegDialog').dialog({
    closable:false,
    modal : true,
    buttons : [{
     text : '登录',
     handler : function(){
      $.ajax({
       type : "POST",
       url : 'http://localhost:81/sdsweb/userMgr/user/login.action',
       data : {
        uname : $('#loginAndRegDialog input[name=name]').val(),
        password : $('#loginAndRegDialog input[name=password]').val()
       },
       //data : $('loginAndRegForm').serialize(),

        //dataType指定以后,r的值就是对应的类型,比如dataType指定成json以后,jquery就会把返回的字符串转换成json对象,r也就是json对象了
       dataType : 'text',

       success : function(r){
        alert(r);
       },
       error : function(){
        //$.messager.alert('Warning','The warning message','error');

          //从右下角慢慢弹出来
        $.messager.show({
         title : '提示',
         msg : '登录失败'
        });
       }
      });
     }
    },{
     text : '注册',
     handler : function(){
      alert("注册");
     }
    }]
   });
  });
 </script>
 
  </head>
 
  <body>

   //用dialog的形式展现表单
  <div id="loginAndRegDialog" class="easyui-dialog" title="用户登录" style="top:100px;width:400px;height:200px;">
   <form id="loginAndRegForm">
    <table>
     <tr>
      <th>
       用户名
      </th>
      <td>
       <input name="name" />
      </td>
     </tr>
     <tr>
      <th>
       密码
      </th>
      <td>
       <input name="password" type="password" />
      </td>
     </tr>
    </table>
   </form>
   
  </div>
 </body>
</html>

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics