I am using jqgrid 3.8. I have a grid which is having some editable columns.I also have an update button to save the grid contents on the server.
If user clicks on editable cell and changes the content and then clicks on update button, i am doing the following things.(after clicking on cell user directly clicks on update button)
first i am calling jqGrid 'savecell' method with iRow, iCol.
here the cell is being saved/ showing popup for validations.
but i want a callback to know whether cell is saved/not so that i can stop or continue my save functionality.
my sample code is like this
function updateGrid(){
// i have iRow, iCol references in beforeEditCell event as grideditRow, grideditCol.. these values r not getting modified nowhere else..
$(gridid).jqGrid('saveCell', grideditRow, grideditCol);
//logic to get grid data using getchangedcells and send ajax call to server.
var changedCells = $(gridid).jqGrid('getChangedCells', 'dirty');
}
how can i stop update logic after saveCell call if savecell is failed. saveCell is returning only jqgrid element.
is there any mechanism to get true/false from savecell or can i pass some callback to savecell?
There are afterSaveCell and errorCell events. One of the events will be called after saving the cell on the server. If you implement the corresponding event handler, you will be notified whether the saving of the new cell value was successful or not.
Related
When a grid's edition mode is set to "popup", it automatically generates a dialog box to let the user modify the editable fields of the selected row.
Using the grid's "update" method, the values are then persisted in the DB and if the PHP handler routine returns the newly updated row, the grid will magically display the properly modified values of the targeted row while keeping it selected !
MY NEED: I must do the exact same thing but with a self made edition dialog(kendoWindow).
I cannot use the one automatically generated by the grid. (For lots of very good reasons...)
Once closed, my self made edition dialog calls an AJAX routine that persists the data in the DB and returns the newly modified row.
How can i update the grid's dataSource with the PHP returned values and while keeping the targeted row selected ?
NOTE: The Grid's row can only be updated after the "update" call to the PHP server returns since some of the values are modified in the PHP code... values that are displayed in the grid.
I'm not sure if this will fit your needs, but you can change the popup editor by using the editable.template setting. That might let you customize the popup to do whatever else you need it to do.
To select a row you need to locate the <tr> element and pass it to .select() on the grid widget. If you happen to know the UID generated by the DataSource, then you can do:
var rowElement = $(gridWidget.element).find('tr[data-uid="' + uid + '"]');
gridWidget.select(rowElement);
Browser: IE 9
Context: An editable, sortable(server side) KendoUI grid is populated.
Issue: The objective is to pop up a message if there are any unsaved changes.
User clicks on a cell
User edits the text in the cell
User clicks on the column header
The grid’s datasource does not catch the edit. Dirty property of the data item is false.
Kendo UI grid always sorts the column. I have been unable to find a way to intercept the sort event and warn the user and cancel the sort event.
Any help is appreciated.
Version: kendoui.aspnetmvc.2013.2.716
In order to cancel the sort event, call event.preventDefault() in the requestStart event of the datasource.
hasChanges() method of the datasource returns false if
Grid columns are reorderable. (.Reorderable(r => r.Columns(true))
//Kendo htmlhelper code)
Sorting is done on the server
User edits the text in a cell and click on the column header
If you remove the Reorderable setting, hasChanges() method of datasource returns true.
Opening a support ticket for this issue.
In the meantime, if you would like to catch the edit with hasChanges() method when user edits the cell and clicks the column header do not set the Reorderable to true.
Here is a video demonstrating the KendoUI Grid issue
Response from Telerik
Basically this is happening because when reordering the event that is used is the mousedown event.
When the mousedown event is triggered the model is still not updated.
As a work-around I can suggest you the following resolution:
Put this in a script block after initializing the Grid. This way if the Grid is still in edit mode, no matter if you have made a change or not the Dragging will be prevented.
$(function () {
var gr = $('#Grid').data().kendoGrid;
gr.thead.on('mousedown', function (e) {
if (gr.tbody.find('.k-edit-cell').length) {
e.stopImmediatePropagation()
}
});
})
i want to change the data in the gridview on a button click by binding it with a different List<> object on server side, It binds the data successfully but since its a post back on button click the grid view gets loaded with the old data which was initialized to it in the page_load method.
how can i avoid calling the page load method after binding the grid with fresh data in the onclick event of my button.
i tried using (!isPostBack) but it dose not help.
Have your button event set a grid parameter that posts back to your server control that indicates that you are changing which datasource feeds the grid, then reload the grid. It should only be now showing the new dataset.
Example:
$('#gridName').jqGrid('setGridParam', { postData: { ChangeGridDataSet: true} }).trigger('reloadGrid', [{ page: 1}]);
I have been following this example, http://www.ok-soft-gmbh.com/jqGrid/DependendSelects2.htm, as it is just what I need. I have got it working but it doesnt work when scrolling through records. If you bring up the form and scroll from a UK record to a US record, the list doesnt change. The onChange event only fires when the user selects from the select drop down.
Is there a way around this?
Thanks for your help.
James
My old demo uses 'change' event handler defined in the dataEvents property of the editoptions. In the dataEvents array one can define other event handlers.
You need just bind keyup to the column exactly like it's described in the answer. In the body of the event handler you can do the same actions as in the body of the 'change' event handler (you can place the code in a function and call it from the both handlers). In the way you should be able to solve the problem.
UPDATED: I updated the old answer and another one which was origin for the demo which you used. The new demo support the navigation buttons (the buttons to edit the 'next' or the 'previous' row) in the editing form.
I have to validate a couple of fields in the CA grid every time a record is updated/added. The grid is used in the callback mode. What i cannot figure out how to do is cancel the callback if a cell is invalid. I am trying to do this 'onBeforeUpdate' event of the grid. I can call set_cancel(true) to cancel the update. But this will change the row mode from edit to display and i will lose all entered data. What i am trying to do is leave the row in the edit mode when any cell in that row is invalid. One of the things i have thought about but haven't done yet is attempting to change RunningMode to Client, validate the record, and set the RunningMode back to Callback when i'm ready to submit? Any suggestions are very appreciated. Thanks!
Turns out there is a method on the cancel event that allows to leave the row in the edit mode.
eventArgs.set_continue(true);