easyui Jquery 编程form load只执行一次,怎么回事?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了easyui Jquery 编程form load只执行一次,怎么回事?相关的知识,希望对你有一定的参考价值。

我设置了一个form ‘ff',然后用$('#ff').form('load','XXX.ashx')初始化,成功。我修改内容提交到后台,也成功了。但是我无法看到修改,无论再如何调用$('#ff').form('load','XXX.ashx'),就是不执行。无法刷新。官网示例上两个按钮('load',数据)、('load','XXX.json')来回载入没有一点儿问题。

重新加载是对datagrid的加载,你是用form加载事件提交没问题,但是用form重新加载时看不到datagrid的数据重新更新是吧。你试试$("#gridId").datagrid("loadData", eval("(" + data + ")")); 的方式。追问

兄台的意思是把form当DataGrid调用,用DataGrid的loaddata?
我这个页面就一个form,没用datagrid。
我的需求是重新加载form时显示后台的最新数据。
目前想到的方法是多次调用load方法,通过load调用后台数据库返回json。
问题是目前load只能调用一次,之后无论怎么调用都会跳过,不执行。

参考技术A “设置了一个form ‘ff',然后用$('#ff').form('load','XXX.ashx')初始化,成功。”我这个都没成功。请问他这个json又是哪种格式的?追问

json:"\"name\":\"value\",………"这样就行,name我是要跟form里的input控件的id、name属性都一样,就会自动匹配。

参考技术B 试一试

var _t=function()
return Date.parse(new Date())



$('#ff').form('load',time:new _tt(),'XXX.ashx')

JQuery EasyUI的常用组件

jQuery EasyUI 是一个基于 jQuery 的框架,集成了各种用户界面插件,该框架提供了创建网页所需的一切,帮助您轻松建立站点。

注:本次介绍的JQuery EasyUI版本为1.5版。

一.表单

form提供了各种方法来操作执行表单字段,比如:ajax提交, load, clear等等。当提交表单的时候可以调用validate方法检查表单是否有效。

用法:

使用form标签创建

 

<form id="ff" method="post">   
    <div>   
        <label for="name">Name:</label>   
        <input class="easyui-validatebox" type="text" name="name" data-options="required:true" />   
    </div>   
    <div>   
        <label for="email">Email:</label>   
        <input class="easyui-validatebox" type="text" name="email" data-options="validType:‘email‘" />   
    </div>     
</form>  

 

 使用jquery实现表单的异步提交:

$(‘#ff‘).form({    
    url:...,    
    onSubmit: function(){ 
        //提交表单时执行的操作 
    },    
    success:function(data){    
       //提交成功后返回的结果 
    }    
});    
// 提交表单    
$(‘#ff‘).submit();  

 通过以上操作就可以使用form表单将数据提交到后台。

 

二.数据表格(数据表格)

 

DataGrid以表格形式展示数据,并提供了丰富的选择、排序、分组和编辑数据的功能支持。DataGrid的设计用于缩短开发时间,并且使开发人员不需要具备特定的知识。它是轻量级的且功能丰富。单元格合并、多列标题、冻结列和页脚只是其中的一小部分功能。

用法:

html标签:

<table class="easyui-datagrid" style="width:400px;height:250px"   
        data-options="url:‘datagrid_data.json‘,fitColumns:true,singleSelect:true">   
    <thead>   
        <tr>   
            <th data-options="field:‘code‘,width:100">编码</th>   
            <th data-options="field:‘name‘,width:100">名称</th>   
            <th data-options="field:‘price‘,width:100,align:‘right‘">价格</th>   
        </tr>   
    </thead>   
</table>

 用jquery接受数据:

$(‘#dg‘).datagrid({    
    url:‘datagrid_data.json‘,       
});  

 就可以将后台数据以表格的方式展现到前台。

三.可编辑数据表格

首先需要加载edatagrid扩展,加载完成后才能使用。

在HTML标签里面创建数据表格:

<table id="tt" style="width:600px;height:200px"   
        title="Editable DataGrid"   
        singleSelect="true">   
    <thead>   
        <tr>   
            <th field="itemid" width="100" editor="{type:‘validatebox‘,options:{required:true}}">Item ID</th>   
            <th field="productid" width="100" editor="text">Product ID</th>   
            <th field="listprice" width="100" align="right" editor="{type:‘numberbox‘,options:{precision:1}}">List Price</th>   
            <th field="unitcost" width="100" align="right" editor="numberbox">Unit Cost</th>   
            <th field="attr1" width="150" editor="text">Attribute</th>   
        </tr>   
    </thead>   
</table>

 jquery操作:

$(‘#tt‘).edatagrid({    
    url: ‘datagrid_data.json‘,    
    saveUrl: ...,    
    updateUrl: ...,    
    destroyUrl: ...    
});  

 就可以通过双击修改表格数据。

常用方法:

$(‘#tt‘).edatagrid("saveRow");//保存编辑行并发送到服务器
$(‘#tt‘).edatagrid("destroyRow");//销毁当前选择的行
$(‘#tt‘).edatagrid("addRow");//添加一个新的空行

 以上就是jquery easyui的一些常用组件。

 

以上是关于easyui Jquery 编程form load只执行一次,怎么回事?的主要内容,如果未能解决你的问题,请参考以下文章

jQuery EasyUI学习

JQuery EasyUI的常用组件

easyui form load方法使用教程

EasyUI使用Jquery.load动态加载时重新渲染

jquery easyui datagrid.load方法参数传递问题 .

jQuery easyui 扩展form插件的三个方法