PDA

View Full Version : How to post all modified records in editorgrid ?



pankajspace
17 Jul 2009, 1:43 AM
Hello friends,
I have written a following handler function on a menu button (of a EditorGridPanel) click.
After clicking this button I want to send all edited data to the server. Can anybody tell me how to do that? Here is my code.

Here is a code section which i need to modify?????
----------------------------------------------------------------------------------
handler: function (e) {
var allRecords = grid.store.getModifiedRecords();
debugger;
console.log(allRecords);
var conn = new Ext.data.Connection();
conn.request({
url: 'updateData.php',
params: {
action: 'update',
json: allRecords
},
success: function (resp, opt) {
// e.commit();
},
failure: function (resp, opt) {
// e.reject();
}
});
------------------------------------------------------------------------------


Here is the complete code of my page.----->>>>>>>>
------------------------------------------------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Object Manager</title>
<link type="text/css" rel="stylesheet" href="lib/extjs/resources/css/ext-all.css" />
<style type="text/css">
#dvMain, #dvSave
{
width: 1000px;
margin: auto;
padding: 10px;
}
.ndhScroll
{
overflow: scroll;
}
</style>
<script type="text/javascript" src="lib/extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="lib/extjs/ext-all-debug.js"></script>
<script type="text/javascript">
Ext.onReady(function()
{
Ext.BLANK_IMAGE_URL = 'images/s.gif'; //Required for extjs to work properly.

var types = new Ext.data.SimpleStore( //Combobox options data store.
{
fields: ['id', 'type'],
data : [['1','String'],['2','Large Text'],['3','Foreign Key'],['4','Integer'],['5','Float'],['6','Date'],['7','Date Time'],['8','$Time Stamp$'],['9','$User$'],['10','Serial Primary']]
});

var store = new Ext.data.Store //Main data store.
({
data:
[
["","id", "ID", "Primary Key", "Serial Primary", 20, "false", 0, "false", "false", "", "", "", ""]
],
reader: new Ext.data.ArrayReader({id:'id'},
[
'id',
'name',
'dspName',
'message',
'type',
{name:'length', typr:'int'},
'search',
'dspWeight',
'sort',
'required',
'object',
'keyProp',
'valProp1',
'valProp2'
])
});

var text_edit = new Ext.form.TextField(); //TextField Editor.
var checkbox_edit = new Ext.form.Checkbox(); //Checkbox Editor.
var type_edit = new Ext.form.ComboBox //Combobox Editor.
({
readOnly : true,
typeAhead: true,
triggerAction: 'all',
mode: 'local',
store: types,
displayField:'type',
valueField: 'type'
});
/*
var textArea_edit = new Ext.form.TextArea //TextArea Editor.
({
name: 'message',
hideLabel: true,
labelSeparator: '',
height: 100,
anchor: '100%'
});
*/
var ds_model = Ext.data.Record.create( //Data Format for adding data row.
[
'id',
'name',
'dspName',
'message',
'type',
{name:'length', typr:'int'},
'search',
'dspWeight',
'sort',
'required',
'object',
'keyProp',
'valProp1',
'valProp2'
]);

var grid = new Ext.grid.EditorGridPanel //Defining Grid.
({
renderTo: Ext.get('dvMain'),
frame:true,
title: 'Object Manager',
height:500,
width:1000,
enableColumnMove: false,
clicksToEdit: 1,
// bodyCssClass: Ext.Element.addClass('ndhScroll'),
store: store,
selModel: new Ext.grid.RowSelectionModel({singleSelect:false}),
columns:
[
{header: "Id", dataIndex: 'id'},
{header: "Name", dataIndex: 'name',sortable: true,editor: text_edit},
{header: "Display Name", dataIndex: 'dspName',sortable: true,editor: text_edit},
{header: "Message", dataIndex: 'message',sortable: true, editor: text_edit},
{header: "Type", dataIndex: 'type',sortable: true,editor: type_edit},
{header: "Length", dataIndex: 'length',sortable: true,editor: text_edit},
{header: "Search", dataIndex: 'search',sortable: true,editor:checkbox_edit},
{header: "Display(Wt.)", dataIndex: 'dspWeight',sortable: true,editor: text_edit},
{header: "Sort", dataIndex: 'sort',sortable: true,editor:checkbox_edit},
{header: "Required", dataIndex: 'required',sortable: true,editor:checkbox_edit},
{header: "Object", dataIndex: 'object',sortable: true,editor: text_edit},
{header: "Key Prop", dataIndex: 'keyProp',sortable: true,editor: text_edit},
{header: "Value Prop", dataIndex: 'valProp1',sortable: true,editor: text_edit},
{header: "Value Prop", dataIndex: 'valProp2',sortable: true,editor: text_edit},
],
tbar: //Tool Bar For adding and Removing Row.
[{
text: 'Add Field',
icon: 'images/table_add.png',
cls: 'x-btn-text-icon',
handler: function()
{
grid.getStore().insert
(
grid.getStore().getCount(),
new ds_model
({
id:'',
name:'',
dspName:'',
message:'',
type:'',
length:'',
search:'',
dspWeight:'',
sort:'',
required:'',
object:'',
keyProp:'',
valProp1:'',
valProp2:''
})
);
grid.startEditing(grid.getStore().getCount()-1,1);
}
},
{
text: 'Remove Field',
icon: 'images/table_delete.png',
cls: 'x-btn-text-icon',
handler: function()
{
var sm = grid.getSelectionModel();
if (sm.hasSelection())
{
var sel = sm.getSelected();
Ext.Msg.show
({
title: 'Remove Record.',
buttons: Ext.MessageBox.YESNOCANCEL,
msg: 'Remove Row '+sel.data.name+'?',
fn: function(btn)
{
if (btn == 'yes')
{
grid.getStore().remove(sel);
}
}
});
}
}
},
{
text: 'Save',
icon: 'images/save.gif',
cls: 'x-btn-text-icon',
handler: function(e)
{
var allRecords = grid.store.getModifiedRecords();
debugger;
console.log(allRecords);
var conn = new Ext.data.Connection();
conn.request(
{
url: 'updateData.php',
params:
{
action: 'update',
json: allRecords
},
success: function(resp,opt)
{
// e.commit();
},
failure: function(resp,opt)
{
// e.reject();
}
});
}
}]
/*
listeners:
{
afteredit: function(e)
{
if (e.field == 'name' && e.value == 'Pankaj')
{
Ext.Msg.alert('Error','Pankaj not allowed.');
e.record.reject();
}
else
{
e.record.commit();
}
}
}
*/
});
});
</script>
</head>
<body>
<div id="dvMain" align="center"></div>
<div id="dvSave" align="center"></div>
</body>
</html>

--------------------------------------------------------------------------------








Thanks in advance,
Pankaj.

tryanDLS
17 Jul 2009, 12:34 PM
http://extjs.com/learn/Ext_Forum_Help#How_to_post_code_properly

http://extjs.com/learn/Ext_FAQ_Grid