博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
EASYUI 表单(FORM)用法
阅读量:6581 次
发布时间:2019-06-24

本文共 1684 字,大约阅读时间需要 5 分钟。

转自:https://blog.csdn.net/lenovouser/article/details/52514906

今日(2014-07-23 10:18:01)开始学习EasyUI

1,ajax提交只是简单的异步和文本提交。提交的数据需要序列化或程序指定。同时,数据也需要自己验证。如果使用easyui的验证组件validatebox,则需要在提交前调用,如下:

     if ($("#formname").form("validate")){

          $.ajax(......)

     }

2,easyui的form提交也可以实现无刷新提交,而且可以提交file。但是easyui的form提交是通过ifram实现的,定位在屏幕的 -1000,-1000位置,变相不显示,提交的数据也不需要程序指定和序列化。通过此方式传递的数据是不能被firebug捕捉到的。form提交自动 调用validaebox组件验证提交。

3,ajax可以指定dateType:‘json’,但form提交需要对返回的数据进行JSON转换,调用$.parseJSON().

1,提交与验证:

jQuery EasyUI里表单(Form)的用法和jQuery里AJAX的用法差不多。这些参数的用法

参数名 类型 描述 默认值
url 字符串 表单提交的地址 null
事件名 参数 描述
onSubmit none 提交之前触发的事件,如果返回false可以防止提交
success data 表单提交成功的时候触发
方法名 参数 描述
submit options 执行提交的操作,选项的参数是一个对象,这个对象包括以下的属性:
url:设置提交的地址;
onSubmit:提交之前的回调函数
submit:提交成功后的回调函数
load data 加载记录来填充表单
选项参数可以是一个字符串或者是一个对象,字符串意味着是一个远程地址,否则就是一个本地的数据记录
clear none 清空表单数据
validate none 表单字段的验证,如果返回true,则说明所有的字段都是合法的。这个方法可以和validatebox插件联合使用

只需在OnSubmit事件中使用Return$("#form1").form('validate');即可。该方法会自动对我们指定的required=true的验证字段进行验证,不通过时会返回false:

  1. $('#fm_line').form('submit', {  
  2.                 url:'line!saveBgLine.do',  
  3.                 onSubmit: function(){  
  4.                         if($("#fm_line").form("validate"))  
  5.                             return true  
  6.                         else  
  7.                             return false;  
  8.                     },  
  9. //注意ajax的url的后台action方法必须有返回值return "json",而不是return null,否则下面的回调函数不起作用,sucess方法失效  
  10.                 success:function(data){  
  11.                            //此处data={"Success":true}实际为字符串,而不是json对象,需要用如下代码处理  
  12.                     var obj = jQuery.parseJSON(data);  
  13.                     if(obj.Success){  
  14.                         $.messager.alert('消息','保存成功!');  
  15.                         $('#tab_line').datagrid('reload');  
  16.                         $("#fm_line").form("clear");  
  17.                                              top.location.href = "main/main.html"; //转主页面
  18.                     }else{  
  19.                         $.messager.alert('消息','保存失败!');  
  20.                     }  
  21.                 }  
  22.               });  

2,使用easyUi

    添加 jquery.js,easyui.js

    添加本地支持easyui-lang-zh_CN.js

    样式表easyui.css和图标icon.css

3,调试对象。

    console.info($('#obj')); 不要使用alert

你可能感兴趣的文章
BATJ面试必会之 Spring 篇(一)
查看>>
表驱动法
查看>>
什么是企业内训
查看>>
firefox无法显示java插件plugin
查看>>
H3C设备之OSPF DR选举
查看>>
List grantee right in oracle
查看>>
Activity生命周期
查看>>
通过VBS编写自动输入账号和密码、自动登录程序的脚本
查看>>
MTK APSoC SDK MT7621编译固件的快速开始
查看>>
深度解析Istio系列之安全模块篇
查看>>
Linux 系统 审计
查看>>
JS -------------------设置弹出框位置屏幕的中间
查看>>
性能测试 vbs使用(一)
查看>>
1.2 linux哲学思想
查看>>
jQuery基础
查看>>
BZOJ5312:冒险——题解
查看>>
echarts,两点连线,中间断裂
查看>>
samba简易配置
查看>>
庆祝在CNBlogs开博!
查看>>
javascript reverse string
查看>>