[Catalyst] Jason Kohles' tutorial on ExtJs editable data grids
and Catalyst
jagdish eashwar
jagdish.eashwar at gmail.com
Fri Apr 17 04:20:14 GMT 2009
Hi,
No I don't get any javascript error in the error log when I hit 'save', and
it doesn't save the changes in the database either. Just nothing happens.
On Thu, Apr 16, 2009 at 9:34 PM, W. Tyler Gee <geekout at gmail.com> wrote:
> Is there a javascript error when you hit save or is it getting to the
> server? Where is your actual problem?
>
>
> On Thu, Apr 16, 2009 at 5:30 AM, jagdish eashwar <
> jagdish.eashwar at gmail.com> wrote:
>
>> Hi Peter,
>> Thanks for writing in. It is really not my code at all. I have taken it
>> all from the tutorial. I thought that people will get a better perspecti=
ve
>> if I referred them to the tutorial. Nevertheless, I am pasting code from=
the
>> advent.js file below. ( I have made a few inconsequential changes though,
>> like the values in the drop down etc.)
>>
>> /*
>> * advent.js
>> */
>>
>> Ext.onReady(function() {
>>
>> var col_model =3D new Ext.grid.ColumnModel([
>> {
>> id: 'id',
>> header: 'ID',
>> dataIndex: 'id',
>> width: 40
>> },
>> {
>> id: 'name',
>> header: 'Name',
>> dataIndex: 'name',
>> editor: new Ext.form.TextField({
>> allowBlank: false,
>> })
>> },
>> {
>> id: 'occupation',
>> header: 'Occupation',
>> dataIndex: 'occupation',
>> width: 70,
>> editor: new Ext.form.ComboBox({
>> typeAhead: true,
>> triggerAction: 'all',
>> transform: 'occpopup',
>> lazyRender: true,
>> listClass: 'x-combo-list-small'
>> })
>> }
>> ]);
>>
>> col_model.defaultSortable =3D true;
>>
>>
>> var People =3D Ext.data.Record.create([
>> { name: 'id', type: 'int'},
>> { name: 'name', type: 'string'},
>> { name: 'occupation', type: 'string'}
>> ]);
>>
>>
>> var store =3D new Ext.data.JsonStore({
>> url: gridurl,
>> root: 'people',
>> fields: People
>> });
>>
>> var grid =3D new Ext.grid.EditorGridPanel({
>> store: store,
>> cm: col_model,
>> title: 'Edit Persons',
>> width: 600,
>> height: 300,
>> frame: true,
>> autoExpandColumn: 'name',
>> renderTo: 'datagrid',
>> tbar: [
>> {
>> text: 'New Person',
>> handler: function() {
>> var p =3D new People({
>> name: 'Unnamed New Person',
>> occupation: 'Unknown',
>> });
>> grid.stopEditing();
>> store.insert( 0, p );
>> grid.startEditing( 0, 1 );
>> },
>> },
>> {
>> text: 'Save Changes',
>> handler: function() {
>> grid.stopEditing();
>> var changes =3D new Array();
>> var dirty =3D store.getModifiedRecords();
>> for ( var i =3D 0 ; i < dirty.length ; i++ ) {
>> var id =3D dirty[i].get( 'id' );
>> var fields =3D dirty[i].getChanges();
>> fields.id =3D dirty[i].get( 'id' );
>> changes.push( fields );
>> }
>> console.log( changes );
>> submitChanges( changes );
>> store.commitChanges();
>> },
>> },
>> {
>> text: 'Discard Changes',
>> handler: function() {
>> grid.stopEditing();
>> store.rejectChanges();
>> },
>> }
>> ]
>> });
>>
>>
>> store.load();
>>
>> function submitChanges( data ) {
>> Ext.Ajax.request({
>> url: posturl,
>> success: function() { store.reload() },
>> params: { changes: Ext.util.JSON.encode( data ) }
>> });
>> }
>> });
>>
>> gridurl and posturl are defined in index.tt2 pasted below. It also
>> contains a link to advent.js.
>>
>> [% META title =3D 'Advent AJAX Grid' %]
>> <script type =3D "text/javascript">
>> var posturl =3D '[% Catalyst.uri_for("/people_data_submit") %]';
>> var gridurl =3D '[% Catalyst.uri_for("/people_data") %]';
>> </script>
>> [% js_link (src =3D '/static/advent.js') %]
>> <div id =3D "datagrid"></div>
>> <select id=3D"occpopup" style=3D"display: none">
>> <option value=3D"SBI">SBI</option>
>> <option value=3D"IBS">IBS</option>
>> <option value=3D"ICICI">ICICI</option>
>> <option value=3D"SELF">SELF</option>
>> </select>
>>
>>
>>
>>
>>
>> On Thu, Apr 16, 2009 at 7:41 PM, Peter Karman <peter at peknet.com> wrote:
>>
>>> jagdish eashwar wrote on 04/16/2009 05:55 AM:
>>> > Hi,
>>> >
>>> > I have been able to work through all of Jason Kohles' tutorial except
>>> the
>>> > part about saving changes back in the database. The 'New Person' and
>>> > 'Discard Changes' in the tool bar are working, but the 'Save Changes'
>>> is
>>> > not. I have checked several times for any typing mistakes that I might
>>> have
>>> > committed, but that part of the code is not working for me. I wonder
>>> if the
>>> > argument ('data') in the submitChanges function is to be substituted
>>> with
>>> > something more explicit by the reader. I will be glad to receive some
>>> help
>>> > and guidance.
>>> >
>>> > I forgot to mention in my earlier post that the tutorial is available
>>> at
>>> > http://www.catalystframework.org/calendar/2007/9.
>>>
>>> Tip: you won't get any useful help until you show us your code.
>>>
>>>
>>> --
>>> Peter Karman . peter at peknet.com . http://peknet.com/
>>>
>>>
>>> _______________________________________________
>>> List: Catalyst at lists.scsys.co.uk
>>> Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
>>> Searchable archive:
>>> http://www.mail-archive.com/catalyst@lists.scsys.co.uk/
>>> Dev site: http://dev.catalyst.perl.org/
>>>
>>
>>
>> _______________________________________________
>> List: Catalyst at lists.scsys.co.uk
>> Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
>> Searchable archive:
>> http://www.mail-archive.com/catalyst@lists.scsys.co.uk/
>> Dev site: http://dev.catalyst.perl.org/
>>
>>
>
> ~Tyler
>
>
> _______________________________________________
> List: Catalyst at lists.scsys.co.uk
> Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst
> Searchable archive:
> http://www.mail-archive.com/catalyst@lists.scsys.co.uk/
> Dev site: http://dev.catalyst.perl.org/
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.scsys.co.uk/pipermail/catalyst/attachments/20090417/fc0e7=
a5c/attachment.htm
More information about the Catalyst
mailing list