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

Jquery AJAX提交表单有两种方式,一是url参数提交数据,二是form提交(和平常一样在后台可以获取到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>

你可能感兴趣的:(jQuery ajax)