Skip to content

seajs ajaxForm.js(form转ajax并集成校验)

awei.yu edited this page Apr 9, 2016 · 1 revision

说明:可根据需要将页面内指定的form表单提交自动转成ajax提交,并自动集成了校验功能

调用方式:

form标签绑定回调

    //通过关键字actionName为指定的form绑定回调,则该form表单的提交将自动转换为ajax提交,在提交完毕之后回调onFormResult方法
    //若不设actionName字段,则为原生form提交方式(提交会发生页面跳转)
    <form actionName="xxx"></form>

##API:

onFormResult:表单提交统一回调

    ajaxForm.onFormResult=function(rs,actionName){
    //rs:服务器返回的数据,如果是json则已经自动完成转型,可直接调用json数据
    //actionName:form绑定的标识码 用于区分不同的表单提交
       switch(actionName){
           case "xxx":
               //actionName为xxx的请求完毕后要执行的代码
        }
    }

addActionResult(actionName,fuc):单独处理某表单回调

问:什么时候用它?
答:一般用于自己封装的插件内部需要有提交的内容,如果还是通过onFormResult处理回调,很有可能其他地方也使用了onFormResult会被覆盖形成冲突。
此接口可直接为指定的actionName绑定回调。当然,普通页面内也可用此方法处理对应actionName的回调,可与onFormResult共存。 参数说明:

actionName(String):用于区分提交(同上文onFormResult中的actionName)
fuc(Function):对应actionName绑定的回调函数,传参:rs为提交完毕之后的返回数据
例:
ajaxForm.addActionResult("xxx",function(rs){})

阻止form表单的回车提交(移动端点击键盘上的"前往"),如下:

    //将form标签的内的回车键与指定的按钮绑定,敲回车即相当于点击指定按钮
    <form enterTo="按钮id"></form>

mySubmit(onlySubmit):submit的封装。

问:何时应该用submit?何时应该用mySubmit?
答:当无须表单校验的时候调用(Form).submit(),否则调用(Form).mySubmit();
参数说明:

    onlySubmit(Boolean):true/false.是否仅仅执行表单提交,跳过onsubmit。默认false

表单二次提交

本插件默认是不允许表单多次提交的,如果真的需要多次,可通过如下方式实现:
(1) html标签实现:

   <form canReSubmit="true"></form>

(2) js实现

(Form).disabled=true/false;

getFormData(FORM):

说明:用于获取指定form内要提交的表单内容,返回值可以配合httpClient作为要提交的内容使用
参数说明:

FORM:form标签(type:node)
Clone this wiki locally