jqgrid - saveRow url throwing an exception - jqgrid

In inline editing mode, clicking on "Save" is throwing an error.
var rowSave = function(id){
jQuery("#myjqgrid").jqGrid('saveRow',id,{
"succesfunc": function(response) {
return true;
},
"url": myjqgrid.json
"mtype": "GET"
});
}
Is it because the url is set to json?
Basically, I get JSON response when the grid is loaded the first time. After I edit the row in inline editing mode, the edited data should be sent to the server. When the data is saved on the server, it should return the updated JSON and the grid row data should be updated with the updated JSON response.

Looking at this doc page:
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:inline_editing#saverow
in the section for saveRow it says:
url: if defined, this parameter replaces the editurl parameter from the options array. If set to 'clientArray', the data is not posted to the server but rather is saved only to the grid (presumably for later manual saving).
and a bit below:
Except when url (or editurl) is 'clientArray', when this method is called, the data from the particular row is POSTED to the server in format name: value, where the name is a name from colModel and the value is the new value.
so it seems you need to supply the server URL that will accept data here. In some of the examples on the same page you can see something like this:
...
editurl: "server.php",
...

Related

Create data url dynamically with jqgrid

I need to setup grid virtual mode, but data url should be prepared dynamically. More precisely I need to read the value from some input on the page and paste its value into data url. Unfortunately, there is only an example of grid virtual mode with static url (i.e. url itself is not formed dynamically).
It seems that it is possible to reassign data url like this:
$("#grid-id").jqGrid('setGridParam', { url: <new_url_here> }).trigger('reloadGrid');
Thanks to Oleg I found more elegant solution. When initializing grid I need to specify postData parameter like this:
$("#grid").jqGrid({
url: <url_without_parameters>,
postData: {
fileName: function() { return $("#input").val(); }
},
...
});
And to refresh grid I need to make the following call:
$("#grid").trigger("reloadGrid");

jqgrid autocomplete on dynamic local source

Im trying to work form editing with autocomplete .. its source is different every time user opens edit form
when opening edit form :
beforeShowForm: function(frm) {
var id = grid.jqGrid('getGridParam','selrow');
if (id) {
var ret = grid.jqGrid('getRowData',id);
AccCode = ret.szAccCode;
};
$.post("url_getchildren", { szAccCode: AccCode}).
done(function(data) {
lschildcode=data;
});
},
i have managed result from server,
but i cant send it to grid.
colModel :
{name:'szAccParentCode',index:'szAccParentCode', editable:true, edittype:'text',
editoptions : {
dataInit: function(elem){
$(elem).focus(function(){
this.select();
}),
$(elem).autocomplete({
source:lschildcode
})
}
}
},
why i cant pass lschildcode to autocomplete's source? and autocomplete kept sending term to server every time i type in the box.
TIA
I think that dataInit (and so autocomplete) will be called before done of the $.post will be executed.
To fix the problem you can for example call $("#szAccParentCode").autocomplete({source:lschildcode}) inside of done.
Another way: one can use URL as the value of source. The URL can contains some additional parameters. If you need use HTTP POST you can declare source as function and call response parameter (callback function) inside of success or done of your source implementation. Just look at the implementation of source in the remote with caching example and examine the code (click on "view source") or examine the source code of jQuery UI Autocomplete near $.ajax usage (see here).

Update mysql table with a click of dropdownlist in the view

Can someone please help me i want to update a database record by using the dropdownlistbox,
so when i select an option from the dropdown the database is updated with that value for that record, without having to click a submit button using codeigniter.
I know the best way to go about this is with AJAX
Yeah AJAX can make it work, and doing it with jQuery can make it a lot easier. You can add an event listener to your dropdown list, listening to a change in its value:
$("#the-dropdown-list").change(function() {
var value = $(this).attr("value");
$.ajax({
url: "path/to/controller/action/",
type: "POST",
data: {value: value},
success: function() {
// whatever you want to do after
}
});
});
This will detect a change in the dropdown list value, and then send it to the controller action given in url in $.ajax object. After that you can just update the database record like you would usually do. In the controller, the new value can be obtained using $_POST['value'], since we defined type to be POST and the different values to be passed to controller action are in the data.

Proper way to page jqGrid

I need to display a number of "dynamic" grids using jqGrid. By dynamic I mean that both definition and data of the grid are retrieved from a database. There are many grids on the page, so I am trying to minimize the number of server trips, and there is a lot of data, so server-side paging is a must.
My workflow is
On initialization of each grid, retrieve grid definition and first
page of data in one server call.
If a user sorts/pages, then retrieve a page of data from the server
Because I want to retrieve the grid definition and first page of data in one call, I cannot use datatype: 'json', url: '###' approach; instead I do:
grid.jqGrid({
mtype: 'post',
...
datatype: function (postdata) {
if (!init.data) {
var request = {
screenId: settings.screenId,
pageNumber: postdata.page,
pageSize: postdata.rows,
sortColumn: postdata.sidx,
sortDirection: postdata.sortd,
date: settings.date
};
site.callWs("/MyService", request, function (pageResponse) {
//WHAT TO CALL HERE TO SET A PAGE OF DATA?
});
} else {
//WHAT TO CALL HERE TO SET A PAGE OF DATA?
init.data = null;
}
}
});
My data object (pageResponse or init.data) looks like this
I am not sure what method to call on jqGrid once a page of data is returned. I considered addJSONData, but it seems so inefficient to convert JSON back to string, then use EVAL(). Also, considered addRowData or setting the data property, but I am confused how to instruct jqGrid that I am doing server-side paging -- if I set the data property to one page of records, what do I need to do to tell jqGrid that there is a total of 50 records and this is page 1 out of 10.
Thanks for your help.
It was a user error (mine :). I had some show/hide logic in loadComplete of jqGrid, but this event does not fire when addJSONData is called.
addJSONData works just fine when provided with a properly-structured JavaScript object.

jqGrid 4.2 Custom search with non-grid fields

I'm using jqGrid 4.2 with the filterToolbar, which works great. I'd like to add some type of custom search to query (server-side) fields that are not part of the colModel.
Prior to 4.0 I would have used filterGrid along the lines of this:
$('#keyword').jqGrid('filterGrid', '#ticket-grid',
{
gridModel: false,
filterModel: [
{ label: 'Keyword', name: 'keyword', stype: 'text'},
{ label: 'Inclued Closed?',name : 'includeClosed', stype: 'checkbox'}
]
});
I understand that this is no longer supported, and an stype: 'checkbox' doesn't work anyway.
How do I do this with the new search module/mechanism?
If I understand you correct you have already on the page, for example above the grid, some controls (text input, selects, chechboxes) which allow the user to define additional criteria of the results which the user want see in the grid. In the case you can use postData with methods (functions) in the way described in the old answer.
If any kind of grid refreshing: request to filter the data from the searching toolbar, changing of the page or the page size, changing of sorting and so on will always follow to the Ajax request to the server. In the case the properties from postData option of jqGrid will be added like other standard parameters (sidx, sord, page, ...). If one from the properties of the postData is defined as function (if a method of postData) then the function will be called to construct the parameter which will be sent to the server. So the current information from you custom searching controls (text input, selects, chechboxes) will be send to the server. In the way you need only use the parameters on the backend to filter the results.
So you have to define fields yourself. For example the text input with id="keyword-input" and checkbos with id="includeClosed" and then use postData in about the following form:
$('#keyword').jqGrid(
// ... other jqGrid options
postData: {
keyword: function () { return $('#keyword-input').val(); },
includeClosed: function () { return $('#includeClosed')is(':checked'); },
}
});

Resources