Re: [Catalyst] Jason Kohles' tutorial on ExtJs editable data grids and Catalyst
Hi Ian,
I am using ubuntu 8.04 and firefox 2 and no firebug because on my ubuntu
installation firefox 3 hangs and I am unable to install a version of firebug
that is compatible with firefox 2. In the absence of firebug, I looked for
the javascript errors in the firefox error log and there were none.
I am hoping that when ubuntu 9.04 is released a little later this month, I
will be able to start using firefox 3 and firebug.
I am working through Jason Kohle's tutorial on a single computer. It's a
good tutorial and all of it 'just worked' except for saving changes back to
the database.
On Fri, Apr 17, 2009 at 12:27 PM, Ian Docherty catal...@iandocherty.comwrote:
jagdish eashwar wrote:
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.
This might be obvious to you in which case I apologise, javascript errors
do not appear in the (server) error log file. You need to check for errors
client side.
Are you using something like Firefox and FireBug to test your javascript on
your browser?
Regards
Ian
On Thu, Apr 16, 2009 at 9:34 PM, W. Tyler Gee geek...@gmail.com mailto:
geek...@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.eash...@gmail.com mailto:jagdish.eash...@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 perspective 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 = 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 = true;
var People = Ext.data.Record.create([
{ name:'id',type: 'int'},
{ name: 'name',type: 'string'},
{ name: 'occupation',type: 'string'}
]);
var store = new Ext.data.JsonStore({
url: gridurl,
root: 'people',
fields: People
});
var grid = 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 = 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 = new Array();
var dirty = store.getModifiedRecords();
for ( var i = 0 ; i dirty.length ; i++ ) {
var id = dirty[i].get( 'id' );
var fields = dirty[i].getChanges();
RE: [Catalyst] Jason Kohles' tutorial on ExtJs editable data grids and Catalyst
Comment out console.log and see if that fixes your problem. Please
someone correct me if I'm wrong, but isn't that firebug only?
From: jagdish eashwar [mailto:jagdish.eash...@gmail.com]
Sent: Friday, April 17, 2009 12:20 AM
To: The elegant MVC web framework
Subject: Re: [Catalyst] Jason Kohles' tutorial on ExtJs editable data
grids and Catalyst
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 geek...@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.eash...@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
perspective 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 = 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 = true;
var People = Ext.data.Record.create([
{ name:'id',type: 'int'},
{ name: 'name',type: 'string'},
{ name: 'occupation',type: 'string'}
]);
var store = new Ext.data.JsonStore({
url: gridurl,
root: 'people',
fields: People
});
var grid = 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 = 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 = new Array();
var dirty = store.getModifiedRecords();
for ( var i = 0 ; i dirty.length ; i++ ) {
var id = dirty[i].get( 'id' );
var fields = dirty[i].getChanges();
fields.id = 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 = 'Advent AJAX Grid' %]
script type = text/javascript
var posturl = '[% Catalyst.uri_for(/people_data_submit) %]';
var gridurl = '[% Catalyst.uri_for(/people_data) %]';
/script
[% js_link (src = '/static/advent.js') %]
div id = datagrid/div
select id=occpopup style=display: none
option value=SBISBI/option
option value=IBSIBS/option
option value=ICICIICICI/option
option value=SELFSELF/option
/select
On Thu, Apr 16, 2009 at 7:41 PM, Peter
[Catalyst] Jason Kohles' tutorial on ExtJs editable data grids and Catalyst
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.
Jagdish Eashwar
___
List: Catalyst@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/
Re: [Catalyst] Jason Kohles' tutorial on ExtJs editable data grids and Catalyst
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 . pe...@peknet.com . http://peknet.com/
___
List: Catalyst@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/
Re: [Catalyst] Jason Kohles' tutorial on ExtJs editable data grids and Catalyst
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 perspective 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 = 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 = true;
var People = Ext.data.Record.create([
{ name:'id',type: 'int'},
{ name: 'name',type: 'string'},
{ name: 'occupation',type: 'string'}
]);
var store = new Ext.data.JsonStore({
url: gridurl,
root: 'people',
fields: People
});
var grid = 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 = 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 = new Array();
var dirty = store.getModifiedRecords();
for ( var i = 0 ; i dirty.length ; i++ ) {
var id = dirty[i].get( 'id' );
var fields = dirty[i].getChanges();
fields.id = 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 = 'Advent AJAX Grid' %]
script type = text/javascript
var posturl = '[% Catalyst.uri_for(/people_data_submit) %]';
var gridurl = '[% Catalyst.uri_for(/people_data) %]';
/script
[% js_link (src = '/static/advent.js') %]
div id = datagrid/div
select id=occpopup style=display: none
option value=SBISBI/option
option value=IBSIBS/option
option value=ICICIICICI/option
option value=SELFSELF/option
/select
On Thu, Apr 16, 2009 at 7:41 PM, Peter Karman pe...@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
Re: [Catalyst] Jason Kohles' tutorial on ExtJs editable data grids and Catalyst
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.eash...@gmail.comwrote:
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 perspective 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 = 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 = true;
var People = Ext.data.Record.create([
{ name:'id',type: 'int'},
{ name: 'name',type: 'string'},
{ name: 'occupation',type: 'string'}
]);
var store = new Ext.data.JsonStore({
url: gridurl,
root: 'people',
fields: People
});
var grid = 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 = 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 = new Array();
var dirty = store.getModifiedRecords();
for ( var i = 0 ; i dirty.length ; i++ ) {
var id = dirty[i].get( 'id' );
var fields = dirty[i].getChanges();
fields.id = 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 = 'Advent AJAX Grid' %]
script type = text/javascript
var posturl = '[% Catalyst.uri_for(/people_data_submit) %]';
var gridurl = '[% Catalyst.uri_for(/people_data) %]';
/script
[% js_link (src = '/static/advent.js') %]
div id = datagrid/div
select id=occpopup style=display: none
option value=SBISBI/option
option value=IBSIBS/option
option value=ICICIICICI/option
option value=SELFSELF/option
/select
On Thu, Apr 16, 2009 at 7:41 PM, Peter Karman pe...@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
Re: [Catalyst] Jason Kohles' tutorial on ExtJs editable data grids and Catalyst
jagdish eashwar wrote on 04/16/2009 10:30 AM: [% META title = 'Advent AJAX Grid' %] script type = text/javascript var posturl = '[% Catalyst.uri_for(/people_data_submit) %]'; var gridurl = '[% Catalyst.uri_for(/people_data) %]'; Should probably be: var posturl = '[% c.uri_for(/people_data_submit) %]'; var gridurl = '[% c.uri_for(/people_data) %]'; -- Peter Karman . pe...@peknet.com . http://peknet.com/ ___ List: Catalyst@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/
Re: [Catalyst] Jason Kohles' tutorial on ExtJs editable data grids and Catalyst
No, 'c.uri_for' doesn't seem to work. With 'Catalyst.uri_for', I am at least able to fetch records from the database. If I change it to 'c.uri_for', even that stops. On Thu, Apr 16, 2009 at 9:59 PM, Peter Karman pe...@peknet.com wrote: jagdish eashwar wrote on 04/16/2009 10:30 AM: [% META title = 'Advent AJAX Grid' %] script type = text/javascript var posturl = '[% Catalyst.uri_for(/people_data_submit) %]'; var gridurl = '[% Catalyst.uri_for(/people_data) %]'; Should probably be: var posturl = '[% c.uri_for(/people_data_submit) %]'; var gridurl = '[% c.uri_for(/people_data) %]'; -- Peter Karman . pe...@peknet.com . http://peknet.com/ ___ List: Catalyst@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@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/
Re: [Catalyst] Jason Kohles' tutorial on ExtJs editable data grids and Catalyst
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 geek...@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.eash...@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 perspective
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 = 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 = true;
var People = Ext.data.Record.create([
{ name:'id',type: 'int'},
{ name: 'name',type: 'string'},
{ name: 'occupation',type: 'string'}
]);
var store = new Ext.data.JsonStore({
url: gridurl,
root: 'people',
fields: People
});
var grid = 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 = 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 = new Array();
var dirty = store.getModifiedRecords();
for ( var i = 0 ; i dirty.length ; i++ ) {
var id = dirty[i].get( 'id' );
var fields = dirty[i].getChanges();
fields.id = 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 = 'Advent AJAX Grid' %]
script type = text/javascript
var posturl = '[% Catalyst.uri_for(/people_data_submit) %]';
var gridurl = '[% Catalyst.uri_for(/people_data) %]';
/script
[% js_link (src = '/static/advent.js') %]
div id = datagrid/div
select id=occpopup style=display: none
option value=SBISBI/option
option value=IBSIBS/option
option value=ICICIICICI/option
option value=SELFSELF/option
/select
On Thu, Apr 16, 2009 at 7:41 PM, Peter Karman pe...@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'
[Catalyst] Jason Kohles' tutorial on ExtJs editable data grids and Catalyst
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.
___
List: Catalyst@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/
