update dojo datagrid - ajax

I need to display a data grid in my website. When user logs into website, an ajax request is send to get whole data for the grid. After that cell updates will come(json response) from dojo ajax requests to server. So how to update those cells only in data grid automatically.

To update items in the datagrid store :
grid.store.fetch({query:{/*find items to update*/},
onItem : function(gridItem){
grid.store.setValue(gridItem, attr, value);
});
grid.store.save();
Setting the attributes you want to update to the appropriate value from the xhr response.

Related

JQGrid : Delay in "dataurl" need to be notified

I have a JQGrid with one of cells as a "select" edit type. Data in this cell comes from "dataurl".
While adding a new row/editing an existing row, retrieval of data for "select" cell takes around 40 to 50 seconds. The delay is not an issue but during that time I need to show a Loading message on the Grid or into the "select" cell.
Any suggestions ?
One can use ajaxSelectOptions option to customize jQuery.ajax request used to get data from dataUrl. For example you can use beforeSend callback to do some actions before Ajax request, you can add error callback, set timeout option which specify the timeout of Ajax request in milliseconds and so on.
To show the "Loading..." message on the grid you need just show the div optionally with overlay. The answer) and another one describes in details how it can be done.

how to avoid calling page_load method when binding grid with different data

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}]);

Is there a way to combine Server Binding and Ajax Binding to eliminate the extra request made in Ajax Binding on a Kendo grid?

By default the Kendo Grid for ASP.NET MVC will perform server side requests and load the page and grid on a single request. However, when configured for ajax binding the Kendo Grid for ASP.NET MVC will make ajax requests after the page is loaded which requires one extra request (one for the page and one extra for the data used by the grid). Is there a way to combine server binding and ajax binding to eliminate the extra request made in ajax binding alone? All I'm looking is to load the data for the page and grid at the same request (like Server Side Binding) for the first time and use ajax binding for subsequent requests. To disable the initial load on ajax binding we can disable the AutoBind Configuration Option (autoBind:false) of the grid. Now, I need a way to show the data on the grid while the autobind option is disabled. Any idea????
To bind the Grid initially you should either pass your collection to the Grid method.
Html.Kendo().Grid<Customers>(theCollectionOfCustomersWhichWillBeUsedInitially)
//...
Or you could pass it to the BindTo method (which is actually the same ;)
Html.Kendo().Grid<Customers>()
.Name("someName")
.BindTo(sameCollectionasAbove)

jqGrid saveCell method returns nothing except gridelement. can i get true/false or can i pass a callback to saveCell?

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.

using jqGrid addJSONData function with scroll and loadonce option at same time

in my web application i am already using jqgrid since version 3.5.
at my application such as search window, page is comming with no date. after user entering seach parameter when clicking search buton i have done request, grid data and other variable that i needed has come with this ajax request.
so i populate grid with addJSONData metod such as ;
var data = {"page":"1″,"total":0,"records":0,"rows":[{"id":"1","cell":["1-480","1884","BASYAYLA"]},{"id":"2″,"cell":["2-481","1983","SARIVELILER"]}]};
// data variable has return from ajax request.
var mygrid = jQuery("#mygrid")[0];
mygrid.addJSONData(data);
Grid populating is problem when you working with big data set. Yesterday i seen new properties called scroll and loadonce at demo page.
I understand that when i use datatype except than json.
i try to use these metod but i am not able to success.
How could i use addJSONData, scroll and loadonce at same time.
i find solution myself
when you are using loadonce metod it will turn datatype to local so addJSONData metod dont work because datatype is not json.
by following these steps, problem has solved.
i set datatype local to grid dont make first call
$.extend($.jgrid.defaults,{
datatype: "local"
});
for loading data to grid. i follow these commands;
$("#"+objeId).setGridParam({datatype:'json', loadonce:true});
mygrid.addJSONData(myjsongrid);
$("#"+objeId).setGridParam({datatype:'local'});
every thing work fine for me.

Resources