zoukankan      html  css  js  c++  java
  • Jquery提交form表单

    前台代码

     1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Js_submit.aspx.cs" Inherits="Ctrip.Corp.Report.OfflineSite.CorpReportSetting.Js_submit" %>
     2 
     3 <html xmlns="http://www.w3.org/1999/xhtml">
     4 <head>
     5     <title>Jquery快速提交form表单</title>
     6     <link type="text/css" href="../Content/Css/StyleSheet.css" rel="Stylesheet" />
     7     <script type="text/javascript" src="../Content/js/jquery.min.js"></script>
     8     <script type="text/javascript" src="../Content/js/jquery.form.js"></script>
     9 </head>
    10 <body>
    11 
    12 <form id="form1" action="?Action=AddCustomer" method="post">
    13     <p><b>新增客户资料</b></p>
    14     <span>Name: </span><input type="text" name="Name" value="abc" /><br />
    15     <span>Age: </span><input type="text" name="Age" value="20" /><br />
    16     <span>Address: </span><input type="text" name="Address" value="武汉" /><br />
    17     <span>Tel:</span> <input type="text" name="Tel" value="12345678" /><br />
    18     <span>Email: </span><input type="text" name="Email" value="test@163.com" /><br />
    19     <br />
    20     <input type="submit" name="btnAddCustomer" value="保存客户资料" />
    21 </form>
    22 
    23 <hr />
    24 <p><b>服务器返回的结果:</b></p>
    25 <textarea id="output" cols="20" rows="50" style=" 90%; height: 200px"></textarea>
    26 
    27 
    28 <script type="text/javascript">
    29     $(function () {
    30         // 只需要下面这个调用就可以将表单改成异步提交方式!
    31         var options = {
    32             success: showResponse,
    33             resetForm: true,
    34 //            url: "../user/msg.do?d=sendMsgByAjax"
    35         };
    36         $("#form1").ajaxForm(options);
    37     });
    38      
    39     function showResponse(result){//回调函数   
    40        if(1 == result){   
    41           alert("信息发送成功!");   
    42      }else{   
    43           $("#output").val(result);
    44       }   
    45     }  
    46 
    47 </script>
    48 
    49 </body>
    50 </html>

    后台代码

     1  public partial class Js_submit : Page
     2     {
     3         protected void Page_Load(object sender, EventArgs e)
     4         {
     5             string action = "";
     6             Customer customer = new Customer();
     7             if (!string.IsNullOrEmpty(Request.QueryString["Action"]))//获取form的Action中的参数
     8             {
     9                 action = Request.QueryString["Action"].Trim();//去掉空格
    10             }
    11 
    12             switch (action)
    13             {
    14                 case "AddCustomer":
    15                     if (!string.IsNullOrEmpty(Request.Form["Address"]) && !string.IsNullOrEmpty(Request.Form["Age"])
    16                         && !string.IsNullOrEmpty(Request.Form["Email"]) && !string.IsNullOrEmpty(Request.Form["Name"]) && !string.IsNullOrEmpty(Request.Form["Tel"]))//获取form中的参数
    17                     {
    18                         customer.Address = Request.Form["Address"].ToString();
    19                         customer.Age = Convert.ToInt32( Request.Form["Age"]);
    20                         customer.Email = Request.Form["Email"].ToString();
    21                         customer.Name = Request.Form["Name"].ToString();
    22                         customer.Tel = Request.Form["Tel"].ToString();
    23                     }
    24                     AddCustomer(customer);
    25                     break;
    26             }
    27         }
    28 
    29         public void AddCustomer(Customer customer)
    30         {
    31             // 简单地返回一个XML字符串。
    32             // 告诉客户端:服务端收到了什么样的数据。
    33             string ss = XMLSerializer.Serialize(customer, typeof(Customer));
    34             Response.Clear();
    35             Response.Write(ss);
    36             Response.End();
    37         }
    38 
    39     }
  • 相关阅读:
    Excel两列查找重复值
    Docker容器的数据卷(data volume),数据卷容器,数据卷的备份和还原
    Ubuntu 搭建 GitLab 笔记 ***
    JIRA使用
    Android.mk文件LOCAL_MODULE_TAGS 说明
    Git Reset 三种模式
    Android常用的编译命令
    Android源码编译
    AOSP---"Android Open-Source Project"
    理解 Android Build 系统
  • 原文地址:https://www.cnblogs.com/AnXinliang/p/5151746.html
Copyright © 2011-2022 走看看