jquery ajax提交表单数据的两种方式


首先要下载Jquery、Jquery.form这两个插件,网上很多的!

  一:Url参数提交数据

<script type ="text/javascript" src ="../js/jquery.js"></script>
<script type="text/javascript">
        function checkCorpID()//检测客户编号是否可用
        {
            if($.trim($("#txtF_CORPID")[0].value)=="")//txtF_CORPID是客户编号输入框
            {
                alert("请输入客户编号!");
            }
            else
            {
                $("#checkFlag").html("正在检测");//显示提示信息
                $.ajax({
                 type: "get",
                 url: "CheckCorpID.ashx",
                 data: "ID="+$.trim($("#txtF_CORPID")[0].value),//提交表单,相当于CheckCorpID.ashx?ID=XXX
                 success: function(msg){$("#checkFlag").html("");alert(  msg ); }   //操作成功后的操作!msg是后台传过来的值
                }); 
            } 
        }
</script>

  后台代码:

if(context.Request.Params["ID"].ToString()!="")
        {
            Pxt.Logic.SYS.CORP_BASE_INFO cbiL = new Pxt.Logic.SYS.CORP_BASE_INFO();
            bool flag=cbiL.checkCorpID(context.Request.Params["ID"].ToString());
            if (flag)
            {
                context.Response.Write("该客户编号已被占用!");
            }
            else
            {
                context.Response.Write("该客户编号可用!");
            }
        }
二:Form提交数据

  前台代码:

<script type ="text/javascript" src ="../js/jquery.js"></script> //必须要引用
    <script type ="text/javascript" src ="../js/jquery.form.js"></script> //必须要引用
    <script type="text/javascript">
         // wait for the DOM to be loaded
          $(document).ready(function() 
            {
                $('#Tip').hide();//显示操作提示的元素不可见
                $('#form1').submit(function()//提交表单
                {
                    //alert("ddd");
                    var options = { 
                    target:'#Tip', //后台将把传递过来的值赋给该元素
                    url:'ReturnVisit.aspx?flag=do', //提交给哪个执行
                    type:'POST', 
                    success: function(){ alert($('#Tip').text());} //显示操作提示
                    }; 
                    $('#form1').ajaxSubmit(options); 
                    return false; //为了不刷新页面,返回false,反正都已经在后台执行完了,没事!
                });  
            }
         );
     </script>
<body>
    <form id="form1" runat="server">
    <div>
        <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td colspan="2" class="tableCategory">客户回访</td>
          </tr>
          <tr>
            <td width="30%" class="tableBg1">客户名称:</td>
            <td class="tableBg2">
                <asp:TextBox ID="txtF_CorpName" runat="server"></asp:TextBox>
                    </td>
          </tr>
          <tr>
            <td width="30%" class="tableBg1">回访主题:</td>
            <td class="tableBg2">
                <asp:TextBox ID="txtF_ReturnVisitTitle" runat="server"></asp:TextBox>
                    </td>
          </tr>
          <tr>
            <td width="30%" class="tableBg1">联系人:</td>
            <td class="tableBg2">
                <asp:TextBox ID="txtF_ContractPerson" runat="server"></asp:TextBox>
                    </td>
          </tr>
          <tr>
            <td width="30%" class="tableBg1">联系人职务:</td>
            <td class="tableBg2">
                <asp:TextBox ID="txtF_ContractPersonPosition" runat="server"></asp:TextBox>
                    </td>
          </tr>
          <tr>
            <td width="30%" class="tableBg1">联系电话:</td>
            <td class="tableBg2">
                <asp:TextBox ID="txtF_ContractPhone" runat="server"></asp:TextBox>
                    </td>
          </tr>
          <tr>
            <td width="30%" class="tableBg1">回访时间:</td>
            <td class="tableBg2">
                <asp:TextBox ID="txtF_ReturnVisitDate" runat="server"></asp:TextBox>
                    </td>
          </tr>
          <tr>
            <td width="30%" class="tableBg1">回访内容:</td>
            <td class="tableBg2">
                <asp:TextBox ID="txtF_ReturnVisitContent" runat="server"></asp:TextBox>
                    </td>
          </tr>
          <tr>
            <td width="30%" class="tableBg1">回访相关文档:</td>
            <td class="tableBg2">
                <asp:TextBox ID="txtF_ReturnVisitFile" runat="server"></asp:TextBox>
                    </td>
          </tr>
          <tr>
            <td width="30%" class="tableBg1">&nbsp;</td>
            <td class="tableBg2">
                <asp:Button ID="Submit_BT" runat="server" Text="确定" CssClass="button" />
                <input type="reset" class="button" value="还原" />
            </td>
          </tr>
        </table>
        <span id="Tip"></span>
    </div>
    </form>
</body>

后台代码:

protected void Page_Load(object sender, EventArgs e)
    {
        {
            if (Request.QueryString["flag"] != null && Request.QueryString["flag"].ToString() == "do")
            {
                
                Pxt.Logic.DBRec.ReturnVisit bll = new Pxt.Logic.DBRec.ReturnVisit();
                if (bll.Add(model(0)) > 0)
                {
                    Response.Write("操作成功!");
                    Response.End();
                }
            }
        }
    }
    /**//// <summary>
    /// 根据不同需要,设定模型->获取模型
    /// </summary>
    /// <param name="id">ID值</param>
    /// <returns></returns>
    private Pxt.Model.DBRec.ReturnVisit model(int id)
    {
//获取表单值
        string F_CorpName = Request.Form["txtF_CorpName"].ToString();
        string F_ReturnVisitTitle = Request.Form["txtF_ReturnVisitTitle"].ToString();
        string F_ContractPerson = Request.Form["txtF_ContractPerson"].ToString();
        string F_ContractPersonPosition = Request.Form["txtF_ContractPersonPosition"].ToString();
        string F_ContractPhone = Request.Form["txtF_ContractPhone"].ToString();
        DateTime F_ReturnVisitDate = DateTime.Parse(Request.Form["txtF_ReturnVisitDate"].ToString());
        string F_ReturnVisitContent = Request.Form["txtF_ReturnVisitContent"].ToString();
        string F_ReturnVisitFile = Request.Form["txtF_ReturnVisitFile"].ToString();
        string Refer = Session["username"].ToString();
        DateTime DoTime = DateTime.Now.Date;
        Pxt.Model.DBRec.ReturnVisit model = new Pxt.Model.DBRec.ReturnVisit();
        if (id > 0)//修改记录,否则表示增加记录
        {
            model.ID = id;
        }
        model.F_CorpName = F_CorpName;
        model.F_ReturnVisitTitle = F_ReturnVisitTitle;
        model.F_ContractPerson = F_ContractPerson;
        model.F_ContractPersonPosition = F_ContractPersonPosition;
        model.F_ContractPhone = F_ContractPhone;
        model.F_ReturnVisitDate = F_ReturnVisitDate;
        model.F_ReturnVisitContent = F_ReturnVisitContent;
        model.F_ReturnVisitFile = F_ReturnVisitFile;
        model.Refer = Refer;
        model.DoTime = DoTime;
        return model;
    }


  注:Jquery.form是Jquery用于帮助操作表单的一个插件!


« 
» 
快速导航

Copyright © 2016 phpStudy | 豫ICP备2021030365号-3