jQWidgets Forums
Forum Replies Created
-
Author
-
April 9, 2013 at 3:37 pm in reply to: how to submit cell value on click in the columns header how to submit cell value on click in the columns header #18911
Hi Dimitar,
Thank you for your help. Problem solved!
Best Regards,
DamcApril 9, 2013 at 1:27 pm in reply to: how to submit cell value on click in the columns header how to submit cell value on click in the columns header #18902Hi,
First thank you for your help.
Problem is the same on IE, Chrome or FF. If you first open cell for editing and edit some value and then with mause go to another cell (not in edit mode, only select), and then submit add row button then there is an error.
My code:
<!DOCTYPE html><html lang="en"><head> <title id='Description'>This example shows how to integrate jqxGrid using jqxDataAdapter with Knockout.js. </title> <link rel="stylesheet" href="./2.8.0/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="./jquery-1.9.1.min.js"></script> <script type="text/javascript" src="./json2-2012-10-08.min.js"></script> <script type="text/javascript" src="./knockout-2.2.1.js"></script> <script type="text/javascript" src="./knockout.mapping-2.4.1.js"></script> <script type="text/javascript" src="./2.8.0/jqxcore.js"></script> <script type="text/javascript" src="./2.8.0/jqxdata.js"></script> <script type="text/javascript" src="./2.8.0/jqxbuttons.js"></script> <script type="text/javascript" src="./2.8.0/jqxscrollbar.js"></script> <script type="text/javascript" src="./2.8.0/jqxmenu.js"></script> <script type="text/javascript" src="./2.8.0/jqxgrid.js"></script> <script type="text/javascript" src="./2.8.0/jqxgrid.selection.js"></script> <script type="text/javascript" src="./2.8.0/jqxgrid.edit.js"></script> <script type="text/javascript" src="./2.8.0/jqxknockout.js"></script> <script type="text/javascript" src="./2.8.0/jqxcheckbox.js"></script> <script type="text/javascript"> $(document).ready(function () { //var initialData = []; var initialData = [ { name: "Well-Travelled Kitten", sales: 352, price: 75.95 }, { name: "Speedy Coyote", sales: 89, price: 190.00 }, { name: "Furious Lizard", sales: 152, price: 25.00 }, { name: "Indifferent Monkey", sales: 1, price: 99.95 }, { name: "Brooding Dragon", sales: 0, price: 6350 }, { name: "Ingenious Tadpole", sales: 39450, price: 0.35 }, { name: "Optimistic Snail", sales: 420, price: 1.50 } ]; var GridModel = function (items) { this.items = ko.mapping.fromJS(items); this.disabled = ko.observable(false); this.addItem = function () { // add a new item. }; }; var model = new GridModel(initialData); var source = { localdata: model.items, datatype: 'observablearray' } var dataAdapter = new $.jqx.dataAdapter(source); var ecolumn; var erow; var renderedAddRowN1 = function (element) { jQuery(element).on('click', function (event) { if (erow && ecolumn) { $("#jqxGrid").jqxGrid('endcelledit', erow, ecolumn, false); } model.items.push({ name: ko.observable(null), sales: ko.observable(null), price: ko.observable(null) }); }); return true; } var celledit = function (row, datafield) { erow = row; ecolumn = datafield; }; $("#jqxGrid").jqxGrid({ autoheight: true, source: dataAdapter, editable: true, selectionmode: 'singlecell', columns: [ { text: 'Name', dataField: 'name', width: 200, renderer: function () { return '<div style="margin:4px;float:left"><img id="addN3" src="./addButton.gif" alt="Add row" title="Add row"/></div>'; }, rendered: renderedAddRowN1, cellbeginedit: celledit }, { text: 'Sales', dataField: 'sales', width: 200, cellsalign: 'right', cellbeginedit: celledit }, { text: 'Price', dataField: 'price', width: 200, cellsformat: 'c2', cellsalign: 'right', cellbeginedit: celledit } ] }); ko.applyBindings(model); }); </script></head><body class='default'> <div id='jqxWidget'> <div data-bind="jqxGrid: {disabled: disabled}" id="jqxGrid"> </div> <table style="margin-top: 20px;"> <tbody data-bind="foreach: items"> <tr> <td data-bind="text: name"></td> <td data-bind="text: sales"></td> <td data-bind="text: price"></td> </tr> </tbody> </table> </div></body></html>
April 8, 2013 at 1:39 pm in reply to: how to submit cell value on click in the columns header how to submit cell value on click in the columns header #18842Hi,
I fixed the error with columntype. But there is another error ‘editor is not defined’ when we call endcelledit (Hides the edit cell’s editor and saves or cancels the changes) and cell is not in edit mode. How to check this?
Thank you,
DamcApril 8, 2013 at 10:44 am in reply to: how to submit cell value on click in the columns header how to submit cell value on click in the columns header #18835Hi Dimitar,
Sample does not work. It has error – Can’t read property ‘columntype’ of null.
Best Regards,
DamcApril 8, 2013 at 7:51 am in reply to: how to submit cell value on click in the columns header how to submit cell value on click in the columns header #18806My code:
<!DOCTYPE html><html lang="en"><head> <title id='Description'>This example shows how to integrate jqxGrid using jqxDataAdapter with Knockout.js. </title> <link rel="stylesheet" href="./2.8.0/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="./jquery-1.9.1.min.js"></script> <script type="text/javascript" src="./json2-2012-10-08.min.js"></script> <script type="text/javascript" src="./knockout-2.2.1.js"></script> <script type="text/javascript" src="./knockout.mapping-2.4.1.js"></script> <script type="text/javascript" src="./2.8.0/jqxcore.js"></script> <script type="text/javascript" src="./2.8.0/jqxdata.js"></script> <script type="text/javascript" src="./2.8.0/jqxbuttons.js"></script> <script type="text/javascript" src="./2.8.0/jqxscrollbar.js"></script> <script type="text/javascript" src="./2.8.0/jqxmenu.js"></script> <script type="text/javascript" src="./2.8.0/jqxgrid.js"></script> <script type="text/javascript" src="./2.8.0/jqxgrid.selection.js"></script> <script type="text/javascript" src="./2.8.0/jqxgrid.edit.js"></script> <script type="text/javascript" src="./2.8.0/jqxknockout.js"></script> <script type="text/javascript" src="./2.8.0/jqxcheckbox.js"></script> <script type="text/javascript"> $(document).ready(function () { //var initialData = []; var initialData = [ { name: "Well-Travelled Kitten", sales: 352, price: 75.95 }, { name: "Speedy Coyote", sales: 89, price: 190.00 }, { name: "Furious Lizard", sales: 152, price: 25.00 }, { name: "Indifferent Monkey", sales: 1, price: 99.95 }, { name: "Brooding Dragon", sales: 0, price: 6350 }, { name: "Ingenious Tadpole", sales: 39450, price: 0.35 }, { name: "Optimistic Snail", sales: 420, price: 1.50 } ]; var GridModel = function (items) { this.items = ko.mapping.fromJS(items); this.disabled = ko.observable(false); this.addItem = function () { // add a new item. }; }; var model = new GridModel(initialData); var source = { localdata: model.items, datatype: 'observablearray' } var dataAdapter = new $.jqx.dataAdapter(source); var renderedAddRowN1 = function (element) { jQuery(element).on('click', function (event) { model.items.push({ name: ko.observable(null), sales: ko.observable(null), price: ko.observable(null) }); }); return true; } $("#jqxGrid").jqxGrid({ autoheight: true, source: dataAdapter, editable: true, selectionmode: 'singlecell', columns: [ { text: 'Name', dataField: 'name', width: 200, renderer: function () { return '<div style="margin:4px;float:left"><img id="addN3" src="./addButton.gif" alt="Add row" title="Add row"/></div>' }, rendered: renderedAddRowN1 }, { text: 'Sales', dataField: 'sales', width: 200, cellsalign: 'right' }, { text: 'Price', dataField: 'price', width: 200, cellsformat: 'c2', cellsalign: 'right' } ] }); ko.applyBindings(model); }); </script></head><body class='default'> <div id='jqxWidget'> <div data-bind="jqxGrid: {disabled: disabled}" id="jqxGrid"> </div> <table style="margin-top: 20px;"> <tbody data-bind="foreach: items"> <tr> <td data-bind="text: name"></td> <td data-bind="text: sales"></td> <td data-bind="text: price"></td> </tr> </tbody> </table> </div></body></html>
Best Regards,
DamcApril 8, 2013 at 6:56 am in reply to: render content in the columns header render content in the columns header #18802Hi Peter,
Thank you. It works if rendered function returns true.
Best Regards,
DamcHi Peter,
What do you recommend in order to facilitate users to enter dates in the table. The user can enter the date, leave blank or delete the value (must be empty)?
Thank you for your help.
Hi Peter.
On cell click event (only on first column) we delete selected row. Each time, when we delete the last row, we get the error “TypeError: this.hittestinfo[k] is undefined” (error is visible in firebug).
My code:
<!DOCTYPE html><html lang="en"><head> <title id='Description'>This example shows how to integrate jqxGrid using jqxDataAdapter with Knockout.js. </title> <link rel="stylesheet" href="./2.6.1/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="./jquery-1.9.0.min.js"></script> <script type="text/javascript" src="./json2-2012-10-08.min.js"></script> <script type="text/javascript" src="./knockout-2.2.1.js"></script> <script type="text/javascript" src="./knockout.mapping-2.3.5.js"></script> <script type="text/javascript" src="./2.6.1/jqxcore.js"></script> <script type="text/javascript" src="./2.6.1/jqxdata.js"></script> <script type="text/javascript" src="./2.6.1/jqxbuttons.js"></script> <script type="text/javascript" src="./2.6.1/jqxscrollbar.js"></script> <script type="text/javascript" src="./2.6.1/jqxmenu.js"></script> <script type="text/javascript" src="./2.6.1/jqxgrid.js"></script> <script type="text/javascript" src="./2.6.1/jqxgrid.selection.js"></script> <script type="text/javascript" src="./2.6.1/jqxgrid.edit.js"></script> <script type="text/javascript" src="./2.6.1/jqxknockout.js"></script> <script type="text/javascript" src="./2.6.1/jqxcheckbox.js"></script> <script type="text/javascript"> $(document).ready(function () { //var initialData = []; var initialData = [ { name: "Well-Travelled Kitten", sales: 352, price: 75.95 }, { name: "Speedy Coyote", sales: 89, price: 190.00 }, { name: "Furious Lizard", sales: 152, price: 25.00 }, { name: "Indifferent Monkey", sales: 1, price: 99.95 }, { name: "Brooding Dragon", sales: 0, price: 6350 }, { name: "Ingenious Tadpole", sales: 39450, price: 0.35 }, { name: "Optimistic Snail", sales: 420, price: 1.50 } ]; var GridModel = function (items) { this.items = ko.mapping.fromJS(items); this.disabled = ko.observable(false); this.addItem = function () { // add a new item. if (this.items().length < 20) { this.items.push({ name: ko.observable(null), sales: ko.observable(null), price: ko.observable(null) }); //this.items.push({ name: 'New item', sales: 100, price: 200 }); } alert('Name in first row: ' + this.items()[0].name()); alert('ko.isObservable(this.items): ' + ko.isObservable(this.items)); alert('this.items()[0].name(): ' + ko.isObservable(this.items()[0].name)); }; this.removeItem = function () { // remove the last item. this.items.pop(); this.items()[1].name("AAA"); this.items()[1].sales(999); }; this.updateItem = function () { // update the first item. var item = {}; item.name = ko.observable('name'); item.sales = ko.observable(500); item.price = ko.observable(200); this.items.replace(this.items()[0], item); var record = this.items()[0]; //for (var obj in record) { // record[obj] = ko.observable(record[obj]); //} }; }; var model = new GridModel(initialData); var source = { localdata: model.items, datatype: 'observablearray' } var dataAdapter = new $.jqx.dataAdapter(source); $("#jqxGrid").jqxGrid({ autoheight: true, source: dataAdapter, editable: true, selectionmode: 'singlecell', columns: [ { text: 'Name', dataField: 'name', width: 200 }, { text: 'Sales', dataField: 'sales', width: 200, cellsalign: 'right' }, { text: 'Price', dataField: 'price', width: 200, cellsformat: 'c2', cellsalign: 'right' } ] }); $("#jqxGrid").bind("cellclick", function (event) { var rowindex = event.args.rowindex; var columnindex = event.args.columnindex; if (columnindex === 0) { var rowscount = jQuery("#jqxGrid").jqxGrid('getdatainformation').rowscount; if (rowindex >= 0 && rowindex < rowscount) { if(confirm('Are you sure you want to delete selecteced row?')) { model.items.remove(model.items()[rowindex]); } else { return false; } } } }); ko.applyBindings(model); }); </script></head><body class='default'> <div id='jqxWidget'> <div style="margin-bottom: 10px;"> <input id="addButton" type="button" data-bind="click: addItem, jqxButton: {}" value="Add Item" /> <input id="removeButton" type="button" data-bind="click: removeItem, jqxButton: {}" value="Remove Item" /> <input id="updateButton" type="button" data-bind="click: updateItem, jqxButton: {}" value="Update Item" /> <div data-bind="jqxCheckBox: {checked: disabled}" style='margin-top: 5px;' id="checkBox">Disabled</div> </div> <div data-bind="jqxGrid: {disabled: disabled}" id="jqxGrid"> </div> <table style="margin-top: 20px;"> <tbody data-bind="foreach: items"> <tr> <td data-bind="text: name"></td> <td data-bind="text: sales"></td> <td data-bind="text: price"></td> </tr> </tbody> </table> </div></body></html>
Thank you.
Hi Peter,
I take a look at your’s sample. I made a few adjustments (empty initialData and I use ko.mapping). At add row I test if the item is observable. You can test the code below and see where I have problems.
My code:
<!DOCTYPE html><html lang="en"><head> <title id='Description'>This example shows how to integrate jqxGrid using jqxDataAdapter with Knockout.js. </title> <link rel="stylesheet" href="./2.6.1/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="./jquery-1.9.0.min.js"></script> <script type="text/javascript" src="./json2-2012-10-08.min.js"></script> <script type="text/javascript" src="./knockout-2.2.1.js"></script> <script type="text/javascript" src="./knockout.mapping-2.3.5.js"></script> <script type="text/javascript" src="./2.6.1/jqxcore.js"></script> <script type="text/javascript" src="./2.6.1/jqxdata.js"></script> <script type="text/javascript" src="./2.6.1/jqxbuttons.js"></script> <script type="text/javascript" src="./2.6.1/jqxscrollbar.js"></script> <script type="text/javascript" src="./2.6.1/jqxmenu.js"></script> <script type="text/javascript" src="./2.6.1/jqxgrid.js"></script> <script type="text/javascript" src="./2.6.1/jqxgrid.selection.js"></script> <script type="text/javascript" src="./2.6.1/jqxgrid.edit.js"></script> <script type="text/javascript" src="./2.6.1/jqxknockout.js"></script> <script type="text/javascript" src="./2.6.1/jqxcheckbox.js"></script> <script type="text/javascript"> $(document).ready(function () { var initialData = [];// var initialData = [// { name: "Well-Travelled Kitten", sales: 352, price: 75.95 },// { name: "Speedy Coyote", sales: 89, price: 190.00 },// { name: "Furious Lizard", sales: 152, price: 25.00 },// { name: "Indifferent Monkey", sales: 1, price: 99.95 },// { name: "Brooding Dragon", sales: 0, price: 6350 },// { name: "Ingenious Tadpole", sales: 39450, price: 0.35 },// { name: "Optimistic Snail", sales: 420, price: 1.50 }// ]; var GridModel = function (items) { this.items = ko.mapping.fromJS(items); this.disabled = ko.observable(false); this.addItem = function () { // add a new item. if (this.items().length < 20) { this.items.push({ name: null, sales: null, price: null }); //this.items.push({ name: 'New item', sales: 100, price: 200 }); } alert('Name in first row: ' + this.items()[0].name()); alert('ko.isObservable(this.items): ' + ko.isObservable(this.items)); alert('this.items()[0].name(): ' + ko.isObservable(this.items()[0].name)); }; this.removeItem = function () { // remove the last item. this.items.pop(); this.items()[0].name("AAA"); }; this.updateItem = function () { // update the first item. var item = {}; item.name = 'name'; item.sales = 500; item.price = 200; this.items.replace(this.items()[0], item); }; }; var model = new GridModel(initialData); var source = { localdata: model.items, datatype: 'observablearray' } var dataAdapter = new $.jqx.dataAdapter(source); $("#jqxGrid").jqxGrid({ autoheight: true, source: dataAdapter, editable: true, selectionmode: 'singlecell', columns: [ { text: 'Name', dataField: 'name', width: 200 }, { text: 'Sales', dataField: 'sales', width: 200, cellsalign: 'right' }, { text: 'Price', dataField: 'price', width: 200, cellsformat: 'c2', cellsalign: 'right' } ] }); ko.applyBindings(model); }); </script></head><body class='default'> <div id='jqxWidget'> <div style="margin-bottom: 10px;"> <input id="addButton" type="button" data-bind="click: addItem, jqxButton: {}" value="Add Item" /> <input id="removeButton" type="button" data-bind="click: removeItem, jqxButton: {}" value="Remove Item" /> <input id="updateButton" type="button" data-bind="click: updateItem, jqxButton: {}" value="Update Item" /> <div data-bind="jqxCheckBox: {checked: disabled}" style='margin-top: 5px;' id="checkBox">Disabled</div> </div> <div data-bind="jqxGrid: {disabled: disabled}" id="jqxGrid"> </div> <table style="margin-top: 20px;"> <tbody data-bind="foreach: items"> <tr> <td data-bind="text: name"></td> <td data-bind="text: sales"></td> <td data-bind="text: price"></td> </tr> </tbody> </table> </div></body></html>
Thank you.
Hi Peter,
I have changed my code and still have same problems:
– adding row if we have an empty jqxGrid – items are not observable. If grid is not empty then works.
– add an empty row – problems with null. How we can add an empty row?My code:
this.loadData = function () {
source = {
localdata: self.myData.arrayA,
datatype: ‘observablearray’
};
dataAdapter = new jQuery.jqx.dataAdapter(source);
// grid
$(‘#jqxgrid’).jqxGrid({
width: 885,
source: dataAdapter,
pageable: true,
autoheight: true,
editable: true,
selectionmode: ‘singlecell’,
pagesize: 5,
pagesizeoptions: [‘5′, ’10’],
columns: [{
text: ‘Date from’,
datafield: ‘dateFrom’,
width: 110,
columntype: ‘datetimeinput’,
cellsformat: ‘dd.MM.yyyy’,
initeditor: function (row, cellvalue, editor) {
}
}, {
text: ‘Date to’,
datafield: ‘dateTo’,
width: 110,
columntype: ‘datetimeinput’
}, {
text: ‘Duration’,
datafield: ‘duration’,
width: 120
}, {
text: ‘Some text’,
datafield: ‘text’,
width: 140
}, {
text: ‘Code’,
datafield: ‘code’,
width: 90,
cellsalign: ‘right’
}, {
text: ‘Currency’,
datafield: ‘currency’,
width: 170,
cellsalign: ‘right’
}]
});
};this.addRow_X = function() {
self.myData.arrayA.push ({ dateFrom: null, dateTo: null, duration: null, text: null, code: null, currency: null });
};Hi Peter,
did you manage to find a solution to the problems that I have described (adding rows if we have an empty jqxGridit – items are not observable and how to add an empty row – problems with null)?
Thank you.
Hi Peter,
I have changed my code and found some problems:
1. If It is empty table and I’m calling addrow than items in added row are not an observable in an observableArray – not OK.
2. If there are data loaded in table and I’m calling addrow than items in added row is an observable in an observableArray – it’s OK.
3.I have problems with editing if I add empty row and use null for values -> var datarow = { dateFrom: null, dateTo: null, duration: null, text: null, code: null, currency: null }. Look code below I put empty String.My Code:
this.loadData = function () { source = { localdata: self.myData.arrayA, datatype: 'local', addrow: function (rowid, rowdata, position, commit) { // synchronize with the server - send insert command // call commit with parameter true if the synchronization with the server is successful //and with parameter false if the synchronization failed. commit(true); }, deleterow: function (rowid, commit) { // synchronize with the server - send delete command // call commit with parameter true if the synchronization with the server is successful //and with parameter false if the synchronization failed. commit(true); }, updaterow : function(rowid, rowdata, commit) { commit(true); } }; dataAdapter = new jQuery.jqx.dataAdapter(source); // grid $('#jqxgrid').jqxGrid({ width: 885, source: dataAdapter, pageable: true, autoheight: true, editable: true, selectionmode: 'singlecell', pagesize: 5, pagesizeoptions: ['5', '10'], columns: [{ text: 'Date from', datafield: 'dateFrom', width: 110, columntype: 'datetimeinput', cellsformat: 'dd.MM.yyyy', initeditor: function (row, cellvalue, editor) { } }, { text: 'Date to', datafield: 'dateTo', width: 110, columntype: 'datetimeinput' }, { text: 'Duration', datafield: 'duration', width: 120 }, { text: 'Some text', datafield: 'text', width: 140 }, { text: 'Code', datafield: 'code', width: 90, cellsalign: 'right' }, { text: 'Currency', datafield: 'currency', width: 170, cellsalign: 'right' }] });}; this.addRow_X = function() { var datarow = { dateFrom: '', dateTo: '', duration: '', text: '', code: '', currency: '' }; var commit = $('#jqxgrid').jqxGrid('addrow', null, datarow);};Thank you for your help.
Ni Peter,
I have changed my code and found some problems:
1. If It is empty table and I’m calling addrow than items in added row are not an observable in an observableArray – not OK.
2. If there are data loaded in table and I’m calling addrow than items in added row is an observable in an observableArray – it’s OK.
3.I have problems with editing if I add empty row and use null for values -> var datarow = { dateFrom: null, dateTo: null, duration: null, text: null, code: null, currency: null }. Look code below I put empty String.My Code:
this.loadData = function () { source = { localdata: self.myData.arrayA, datatype: 'local', addrow: function (rowid, rowdata, position, commit) { // synchronize with the server - send insert command // call commit with parameter true if the synchronization with the server is successful //and with parameter false if the synchronization failed. commit(true); }, deleterow: function (rowid, commit) { // synchronize with the server - send delete command // call commit with parameter true if the synchronization with the server is successful //and with parameter false if the synchronization failed. commit(true); }, updaterow : function(rowid, rowdata, commit) { commit(true); } }; dataAdapter = new jQuery.jqx.dataAdapter(source); // grid $('#jqxgrid').jqxGrid({ width: 885, source: dataAdapter, pageable: true, autoheight: true, editable: true, selectionmode: 'singlecell', pagesize: 5, pagesizeoptions: ['5', '10'], columns: [{ text: 'Date from', datafield: 'dateFrom', width: 110, columntype: 'datetimeinput', cellsformat: 'dd.MM.yyyy', initeditor: function (row, cellvalue, editor) { } }, { text: 'Date to', datafield: 'dateTo', width: 110, columntype: 'datetimeinput' }, { text: 'Duration', datafield: 'duration', width: 120 }, { text: 'Some text', datafield: 'text', width: 140 }, { text: 'Code', datafield: 'code', width: 90, cellsalign: 'right' }, { text: 'Currency', datafield: 'currency', width: 170, cellsalign: 'right' }] });}; this.addRow_X = function() { var datarow = { dateFrom: '', dateTo: '', duration: '', text: '', code: '', currency: '' }; var commit = $('#jqxgrid').jqxGrid('addrow', null, datarow);};Thank you for your help.
Hi Peter,
I’m still struggling with my jqGrid add row functionality. Peter did you find solution or any problem why my code posted above doesn’t work?
Thank you for your help.
Hi Peter,
I can’t fix my code for adding a row in jqGrid to work with new version of jqWidgets. Below is code that works with 2.4.2. Can you help me to find problems?
this.loadData = function () { source = { localdata: self.myData.arrayA, datatype: 'local', addrow : function (rowid, rowdata) { var observableArray = self.myData.arrayA, record = null; observableArray.push({ dateFrom: null, dateTo: null, duration: null, text: null, code: null, currency: null }); record = observableArray()[rowid]; for (var obj in record) { record[obj] = ko.observable(record[obj]); } ko.mapping.fromJS(observableArray(), {}, self.myData.arrayA()); }, deleterow : function (rowid) { var observableArray = self.myData.arrayA; observableArray.remove(observableArray()[rowid]); }, updaterow : function(rowid, rowdata) { var observableArray = self.myData.arrayA, record = null; observableArray.replace(observableArray()[rowid], rowdata); record = self.myData.arrayA()[rowid]; for (var obj in record) { record[obj] = ko.observable(rowdata[obj]); } }; dataAdapter = new jQuery.jqx.dataAdapter(source); // grid $('#jqxgrid').jqxGrid({ width: 885, source: dataAdapter, pageable: true, autoheight: true, editable: true, selectionmode: 'singlecell', pagesize: 5, pagesizeoptions: ['5', '10'], columns: [{ text: 'Date from', datafield: 'dateFrom', width: 110, columntype: 'datetimeinput', cellsformat: 'dd.MM.yyyy', initeditor: function (row, cellvalue, editor) { } }, { text: 'Date to', datafield: 'dateTo', width: 110, columntype: 'datetimeinput' }, { text: 'Duration', datafield: 'duration', width: 120 }, { text: 'Some text', datafield: 'text', width: 140 }, { text: 'Code', datafield: 'code', width: 90, cellsalign: 'right' }, { text: 'Currency', datafield: 'currency', width: 170, cellsalign: 'right' }] });}; this.addRow_X = function() { var datarow = {}, paginginformation = null, pagescount = -1; $('#jqxgrid').jqxGrid('addrow', null, datarow); paginginformation = $('#jqxgrid').jqxGrid('getpaginginformation'); pagescount = paginginformation.pagescount; $('#jqxgrid').jqxGrid('gotopage', pagescount);};Thanks for your help.
-
AuthorPosts