jQuery Grid Plugin - jqGrid - Topic: getting datepicker to work

tim on getting datepicker to work

Sat, 19 Sep 2009 23:08:14 +0300

Thanks, MamaliFrenchi.

I just figured it out too. You're right - I didn't include "js/jquery-ui-1.7.2.custom.min.js".

oops. - though nowhere in the docs or in the forum does it say it's required.

Thanks,

MamaliFrenchi on getting datepicker to work

Sat, 19 Sep 2009 22:58:30 +0300

Sorry I meant jqGrid, and not jqModal. I presume you're using jqgrid 3.5 you need to include also jquery-ui-1.7.1.custom.min.js this i sthe core file of UI since you are using datepicker.

tim on getting datepicker to work

Sat, 19 Sep 2009 19:56:07 +0300

> which version of jqModal?

I am not sure what this means. What is jqModal? is it not included in jQGrid?

I don't see jqModal in the requirements:

http://www.trirand.com/jqgridw.....iki:system


This is what I have:

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>

<script type="text/javascript" src="grid.locale-en.js"></script>

<script type="text/javascript" src="jquery.jqGrid.min.js"></script>



> what are your js files in your page?

This is my jQgrid js:

http://blackstag.com/json.js


This is my json data:

http://blackstag.com/tree-json

MamaliFrenchi on getting datepicker to work

Sat, 19 Sep 2009 19:23:36 +0300

which version of jqModal? and what are your js files in your page?

tim on getting datepicker to work

Sat, 19 Sep 2009 18:51:18 +0300

Ok I've tried to get this to work, but the calendar will not pop up.

Can someone tell me what I am doing wrong ?

Live example:

http://blackstag.com/json-example

Thanks,

-------

* when I remove the editoptions - the cell edit begins to work.

$(document).ready(function(){

2 jQuery("#list").jqGrid({

3 url: 'tree-json',

4 datatype:'json',

5 forceFit:true,

6 cellEdit:true,

7 cellsubmit:'remote',

8 cellurl: 'budget-handler',

9 treeGrid: true,

10 ExpandColumn:'thing',

11 colNames: ["NAMES","DATE"],

12 colModel: [{name: 'thing', index: 'thing', width: 220, hidden: false, sortable: false},

13 {name: 'myDate', index: 'myDate', width: 120, sortable:true, datefmt:"d/m/Y", editrules:{minValue:0, date:true},

14 editable:true, sorttype:"date", editoptions:{size:12, dataInit:function(elem){$(elem).datepicker({dateFormat:'dd/mmm/yy'});}}}

15 ],

16 height: 300,

17 width: 400,

18 imgpath: 'css/sunny/images',

19 caption: 'My Things!',

20 });

21});