微擎开发模块之ajax提交表单

大家好，用了csdn这么久，从来没想着写点东西出来，这是我的第一篇博文，主要详细讲解一下微擎ajax提交表单机制。

html代码部分我们按照如下方式写

<form  action="" method="post"    >
        <input type="hidden" name="c" value="entry" />
        <input type="hidden" value="signup" name="do">
        <input type="hidden"  value="sign" name="op">
        <input type="hidden" value="lb_vote" name="m">
        <input type="hidden" name="id" value="{$id}" />
             <div class="form-group">
                <label for="exampleInputEmail1">姓名</label>
                <input type="uname" class="form-control" id="uname" name="uname" placeholder="姓名">

            </div>
            <div class="form-group">
              <label for="exampleInputPassword1">手机号</label>
              <input type="number" class="form-control" id="uphone" name="uphone" placeholder="手机号">

            </div>
           <div class="form-group" style="overflow:hidden;">
            <label for="imgdis">图片</label>
            <div class="imageitem">
                <div class="upload_image">
                    <img   name="imgdis" id="ImgPr" src=""/>
                </div>

              </div>
              <div>
           <div class="upload_btn"   >
                    <span class="icon-plus"></span> 

             <input  type="button" name="file"  id="choose"  />
                </div>
            </div>

          </div>
            <div class="form-group" style="clear:left;margin-top:15px;">
              <label for="exampleInputPassword1" >描述</label>
              <textarea class="form-control"  name="discription" id="discrption"></textarea>
            </div>
              <button type="button" id="sbtn" onclick="subform();" class="form-control btn btn-danger " value="报名">报名</button>   
        </form>

1. 使用ajax提交 ，我们习惯的将button的type设置为button而不是submit（submit是微擎传统提交方式，需要在php端处理，而且需要使用input标签）；

javascript部分的代码我们按照如下写：

<script type="text/javascript">

     function subform(){
if(checkform()){
        var str='';
        var serverId=images.serverId;
        for(var i=0;i<serverId.length;i++){
            str+='&img='+serverId[i];
        }
        $.ajax({
           url:"{php echo $this->createMobileUrl('Signup',array('op'=>'sign'))}",

              //url:'/app/'+"{php echo $this->createMobileUrl('Signup',array('op'=>'sign'))}",
            type:'post',
            data:$("form").serialize()+str,
            dataType:'json',
            success:function(data){

                if(data.success==1){
                    alert("报名成功");

                }else{
                    alert(mydata.desc);
                }
            }
        });
    }


   }
</script>

对于js代码无需多说，就是处理ajax提交的，格式固定，照葫芦画瓢即可。

php后端处理代码

public function baoming(){
	global $_W, $_GPC;
	......此处省略部分代码
	$json=array('success'=>'1','innfo'=>'2');
  	echo json_encode($json);
}

注意，我们后端处理ajax提交过来的数据是通过函数来处理的。