DWZ控件中Ajax提交form表单

1.表单样式

2.表单代码

<div class="pageContent">
<form:form id="borrowFormName" method="post" action="${ctx}/borrowLog/save" enctype="multipart/form-data"  modelAttribute="borrowLog" class="pageForm required-validate" onsubmit="return validateCallback(this, dialogAjaxDone_form)">
<input type="hidden" name="archiveId" value="${archiveId}" />
<div class="pageFormContent" layoutH="58">
<div class="unit">
<label>借阅部门：</label>
    <input type="text" name="org" size="40" minlength="2" maxlength="20" class="commonName required" value=""/>
</div>
<div class="divider"></div>


<div class="unit">
<label>借&nbsp;&nbsp;阅&nbsp;&nbsp;人：</label>
<input type="text" id="employeeName" name="employeeName" size="40" minlength="2" maxlength="20" class="commonName required" value=""/>
</div>
<div class="divider"></div>

<!-- <div class="unit">
<label>借阅时间：</label>
<input type="text" id="d4311" name="beginTime" size="14" class="required" onClick="WdatePicker({dateFmt:'yyyy-MM-dd',readOnly:true,maxDate:'#F{$dp.$D(\'d4311\')}'})" value="{:date('yyyy-MM-dd',time())}" readonly="readonly"/>
</div>
<div class="divider"></div> -->
<div class="unit">
<label>借阅用途：</label>
<input type="text" id="purpose" name="purpose" size="40" minlength="2" maxlength="10" class="commonName required" value=""/>
</div>
<div class="divider"></div>
</div>
<div class="formBar">
<ul>
<li><div class="buttonActive"><div class="buttonContent"><button type="submit">提交</button></div></div></li> <!-- onclick="return checkCert();" -->
<li><div class="button"><div class="buttonContent"><button type="button" class="close">取消</button></div></div></li>
</ul>
</div>
</form:form>
</div>

3.表单提交js

<script type="text/javascript">

function validateCallback(form, callback) {  
    var $form = $(form);  
    //验证表单如果有非法字段 返回  
    if (!$form.valid()) {  
        return false;  
    }  
    //Ajax向后台提交数据  
    $.ajax({  
        type: form.method || 'POST',  
  url:$form.attr("action"),  
        //获取表单的内容数据  
        data:$form.serializeArray(),  
        dataType:"json",  
        cache: false,  
        //执行回调函数  
        success: callback || DWZ.ajaxDone,  
        error: DWZ.ajaxError  
    });  
   //保证不会通过普通表单提交  
   return false;  
}  
//自定义函数
function dialogAjaxDone_form(json){
DWZ.ajaxDone(json);
if (json.statusCode == DWZ.statusCode.ok){ 
var message = json.message;
var messageInfo = message.split(",")[0];
var id = message.split(",")[1];
alertMsg.info(messageInfo);
 
window.location.replace("${ctx}/borrowLog/download/"+id);
}
}
</script>