`
rautinee
  • 浏览: 98246 次
  • 来自: 成都 四川
社区版块
存档分类
最新评论

如何在jqgrid的form editing中添加关联datepicker

阅读更多
最近接了一个项目,用的还是jqgrid,jqgrid更新的很快,现在都是3.8.1的版本了,功能也比以前强大了很多,很多激动人心的功能都实现了!
开发过程中需要对form editing中的字段添加datepicker,网上找到了一篇,大概思路是一样的,就是对jqgrid的navGrid进行定义,首先查jqgrid的wiki,具体的文档可以看这里http://www.trirand.com/jqgridwiki/doku.php?id=wiki:form_editing
都文档得知我们需要用到的events主要是这个afterShowForm

我的解决思路是,在用户点击navGrid中的edit图标按钮时,弹出编辑窗口,也就是form editing,
定义一个函数
function showudate(tmpob)
{
$(function() {
		tmpob.datepicker({
			changeMonth: true,
			changeYear: true,
			dateFormat: "yy-mm-dd"
			
		});
	});
}
这个函数我就不需要解释了,很简单
然后在afterShowForm中调用这个函数就可以了,具体的写法:
jQuery("#list2").jqGrid('navGrid','#pager2',{edit:true,add:true,del:true},{width:400,height:400,afterShowForm:function(){showudate($("#tt\\.mt_date"));}},{width:400,height:400},{},{multipleSearch:true},{});//注释tt.mt_date是我关联datepicker的输入框的id的名称,width:400,height:400是定义的form editing的大小


具体效果见附件中的图片
  • 大小: 31.9 KB
分享到:
评论
3 楼 sun123start 2013-03-19  
看了一下文档,总算知道tt\\.mt_date是来自哪里的。
2 楼 xuanwf 2011-03-10  
代码可以贴全吗?我没有成功!
1 楼 lplong 2011-03-02  
那jqgrid与My97DatePicker集成怎么使用啊?

相关推荐

    jqGrid_api中文文档

    数据部分讲解了如何使用jqGrid进行数据的添加、删除、修改和检索操作,这对于构建动态的Web应用尤为重要。 通过这些知识点,我们可以了解到jqGrid不仅是一个用于展示数据的表格,它还包含丰富的功能,包括与服务器...

    jqgrid jqgrid 增删查改 添加toolbar 不保存到数据库 artdialog 弹出框

    jqgrid jqgrid 增删查改 添加toolbar 不保存到数据库 artdialog 弹出框

    JqGrid中文API文档

    JqGrid是一款强大的JavaScript数据网格组件,用于在Web应用程序中展示和操作数据。它基于jQuery库,提供了丰富的功能,如分页、排序、过滤、编辑和格式化数据。本中文API文档将帮助开发者深入理解并有效利用JqGrid的...

    jqGrid中文文档.doc

    jqGrid 是一个基于 jQuery 的数据网格插件,用于在网页上展示和操作表格化的数据。在开始使用 jqGrid 之前,需要具备基本的 JavaScript 和 jQuery 知识,因为 jqGrid 是构建在 jQuery 库之上的。jQuery 提供了简便的...

    jqgrid中文文档API

    jQgrid中文文档API jQgrid是一个功能强大且流行的JavaScript插件,用于创建交互式表格。它基于jQuery库,提供了许多强大的功能,例如排序、过滤、编辑、分页等,使得开发者可以快速创建复杂的表格应用程序。本文将...

    jqGrid 离线帮助手册

    Form Editing HOWTO Subgrids Subgrid Subgrid as grid HOWTO Tree Grid Configuration Nested Set Model Adjacency Model HOWTO Importing and Exporting Methods HOWTO User Modules Show/Hide Columns Table to...

    jqGrid表格数据展示插件

    对于编辑功能,jqGrid提供了两种模式:inline editing(行内编辑)和form editing(表单编辑)。行内编辑允许用户直接在表格中修改单元格内容,而表单编辑则会弹出一个包含所有列的编辑表单,更适用于多字段的复杂...

    jqGrid 离线帮助手册 来源官方wiki

    Form Editing HOWTO Subgrids Subgrid Subgrid as grid HOWTO Tree Grid Configuration Nested Set Model Adjacency Model HOWTO Importing and Exporting Methods HOWTO User Modules Show/Hide Columns Table to...

    jqGrid 属性中文配置文档

    注意,这个值是在初始化的时候设定好了,如果要在运行中设置宽度,需要通过 setGridWidth 方法来修改。默认值为 false,这个属性不能修改。 caption jqGrid 的 caption 属性用于设置 Grid 的标题。默认值为空字符串...

    jqGrid_api中文文档.doc

    配置数据源可以是静态数据、JSON、XML 或者其他数据格式,jqGrid 能够自动处理这些数据并展示在表格中。 搜索功能在 jqGrid 中十分强大,不仅有内置的搜索工具栏,还可以自定义搜索条件和搜索行为。这使得用户能够...

    jqGrid3.6中文文档

    jqGrid 是一个基于 jQuery 的数据网格插件,用于在网页中展示和操作表格数据。它遵循 B/S(浏览器/服务器)架构,服务器负责数据管理,而客户端负责数据显示和交互。jqGrid 提供了一种高效的方式来展示数据库中的...

    JqGrid插件+JqGridDemo+JqGrid主题

    JqGrid是一款强大的JavaScript表格插件,用于在Web应用程序中展示和操作数据。它基于jQuery库,提供了丰富的功能,如数据排序、筛选、分页、编辑、添加、删除和保存等,极大地增强了网页中表格的交互性和数据管理...

    jqGrid 中文大全(1)

    在“jqGrid中文大全(1)”这个压缩包中,包含了一系列关于jqGrid的中文教程和文档,这些资料可以帮助开发者更深入地理解和应用jqGrid。以下是一些主要知识点的详细介绍: 1. **安装jqGrid**: jqGrid的安装通常涉及...

    jqgriddemo,样式漂亮,可以直接使用

    6. **插件和扩展**:尝试使用一些预设的插件,如Navigator、Form Editing等,以增强表格的功能。 通过深入学习和实践“jqgriddemo”,不仅可以提升对jqGrid的理解,还能为实际项目开发积累宝贵经验。对于前端开发者...

    深入研究jqgrid

    - `jqGrid Form Editing`提供了弹出式或内联编辑模式,方便用户对数据进行编辑操作。 **四、Nova_CN与jqGrid** `Nova_CN`可能是指一个jqGrid的中文版或者特定配置,它可能是针对中国用户的本地化版本,包含中文...

    jqGrid 3.7

    4. **JavaScript 插件**:“js”目录可能包含jqGrid的额外插件或扩展,比如树形结构的支持(treegrid)、行内编辑模式(inline editing)、弹出式编辑对话框(form editing)等,这些插件增强了jqGrid的功能性。...

    Guriddo_jqGrid_JS_5_2_X_demo.rar

    3. 编辑功能:表格中的单元格和行都可以进行编辑,支持单行和多行编辑模式,以及 inline editing(行内编辑)、form editing(表单编辑)和popup editing(弹出式编辑)。 4. 表格操作:提供增删改查(CRUD)操作,...

    JqGrid3.9详细中文文档

    刚收集到的JqGrid的详细中文文档,版本3.9

    jqgrid加载本地数据并且分页例子

    jqGrid是一款功能强大的JavaScript表格插件,用于在网页上展示并操作数据,它支持各种操作,包括...在实际项目中,你可能需要根据具体需求调整jqGrid的配置,如添加自定义列处理函数,实现更复杂的数据过滤和检索功能。

Global site tag (gtag.js) - Google Analytics