Is there any chance to use CheckBox as jqGrid Filter?
Assuming, that i have field with values only 0 and 1.
If checkbox will be checked then filtred value will be 1, no filtering.
The reason, why one don't use checkboxes in the filter toolbar, is very simple: one need 3-state checkbox: checked, unchecked and not-defined:
"checked" state means filtering by checked (1 value in your case)
"unchecked" state means filtering by unchecked (0 value in your case)
"not-defined" state means no filtering by the column
Because of that one use mostly the property like
stype: "select", searchoptions: { sopt: ["eq", "ne"], value: ":Any;1:Yes;0:No" }
to have drop-down select element in the filter toolbar. The texts "Any", "Yes" and "No", like the values 1 and 0 can be changed to another values depend on your requirements.
UPDATED: jqGrid allows to to create custom searching interface by usage stype: "custom" and implementing custom_element and custom_value callbacks of of searchoptions See the old answer and the Searching Dialog. I would still don't recommend you to do this, because it makes things more complex without any real benefit for the user. I'm sure that some users will ask you for filtering about non-checked state: the more users the more different opinions. Select is the standard interface which know everybody and everybody understand it's meaning in the same way.
I modified the old demo to the following which demonstrates the possibility of stype: "custom" in the searching toolbar. After the click on the custom control of the filter toolbar one will see the picture like below:
I used in the demo of cause free jqGrid fork of jqGrid - the fork, which I develop staring with the end of 2014.
Related
I have a jqgrid with certain columns. I am trying to call a custom_function to validate the cell value.
I am also getting a regular expression from the database into rowData, which I want to use to validate the cell value.
var ret = jQuery("#settingsListGrid").jqGrid('getRowData', id);
cm.editrules = {
required: true,
custom: true,
custom_func: ValidateData,
custom_value:ret.RegX
};
So I need to pass rowData to a custom function.
ValidateData = function (value, colname, customValue) {
return customValue.test(value) ?
[true] :
[false, "Invalid Data"];
}
I want to pass the rowData using customValue
Please help?
The answer depend on the fork of jqGrid, which you use. I understand the problem which you wrote, but one have to change the code of jqGrid (the implementation of custom validation) to implement the requirement.
I develop free jqGrid fork of jqGrid after Tony Tomov changed the license agreement of jqGrid, renamed his product in version 4.7.1 to Guriddo jqGrid JS (see the post) and made it commercial (see the prices here). After starting the development based on the last free 4.7 version I made a lot of changes and improvements in the code and have implemented many new features. The feature which you need is implemented starting with version 4.12.1 (see here). Thus you can easy solve your problem after updating to the current free jqGrid 4.13.2.
The new feature works as following:
editrules: {
required: true,
custom: ValidateData,
custom_value: ret.RegX
}
It's important that one should specify the custom validation function as the value of custom property instead of usage custom_func. It allows free jqGrid to hold compatibility to old versions (via custom: true and custom_func), but providing new parameters of the validation callback via function as the value of custom property.
The new style ValidateData will look like
var ValidateData = function (options) {
return customValue.test(options.newValue) ?
[true] :
[false, "Invalid Data"];
}
with only one options parameter, which have many properties which you could use. Such style allows to provide many helpful information without the requirement to have a lot of unneeded parameters. Moreover the style of callback options allows to extend the options object in the future versions without breaking compatibility to previous versions.
The options parameter have the following properties
newValue - the current (modified) value which need be validated
oldValue - the previous value (the old value) of the cell before the modification
cmName - the column name. It could be practical if you use one callback function in many columns and you want to implement a little different behavior for different columns. It could be additionally helpful for producing readable error message in case of validation error.
iCol - the index in the current colModel which corresponds the column (the column cmName)
cm - the element of colModel, which represent the currently validating column.
rowid - the rowid of the current editing row. One can use getLocalRow for example to get the content of other columns before editing. It's important to remark that getLocalRow works only in case of usage datatype: "local" or loadonce: true. The method getRowData or getCell can be safe used to get data in form editing mode or to access the data, which are not currently editing (in cell or inline editing mode).
iRow - numeric index of the current editing row from the top of the grid (from the top of HTML <table>)
oldRowData - will be set only in case of usage inline editing or cell editing. It's not defined in form editing mode. It represent the values
mode - shows which editing mode is used now. It can be "addForm", "editForm" (in case of usage form editing), "cell" (cell editing), "add" or "edit" (inline editing). In some other callback function the property could have two other values: "filter" (field from the filter toolbar) or "search" (for validation of the field of the searching dialog)
tr and td - the DOM elements of the row and cell of the grid which will be edited using form editing mode. The properties will be set only in case of form editing.
I hope that the large set of properties of options parameter allows you easy implement your requirements on any custom validation.
I am trying to put editable value either true or false depend on the value of the cell in colModel. Is there is any way to do that?
{name:'keywords',index:'keywords', width:150, editable:true,edittype:'select',
editrules:{required: true},
editoptions:{value:{'one':'one','two':'two','three':'three','four':'four'},size:5} },
In this I want to set editable:false if the cellvalue exist else editable:true and editoptions:{value:{'one':'one','two':'two',...} for a particular cell.
The most easy way to implement the requirement would be to use free jqGrid. It's the fork (based on jqGrid 4.7) which I develop currently. Because of such requirements I implemented the feature described in the wiki article. It allows to define editable property as function. So you need just to define the callback from which you returns true or false base on any your custom criteria. The callback editable get many information about the context of execution as properties of the only parameter. The rowid, iRow, iCol and name properties allows you to use getLocalRow or getCell to get contain of any column of the row. So you can enable editing selectively in very simple way.
If you can't upgrade to free jqGrid then you can use old tricks which are specific for the editing mode which you use. I can forward you to the answer which can be used in case of form editing and this one which can be used in case of form editing if you call editRow directly. In case of usage inlineNav or formatter: "actions" there are alternative solutions which you can find also in my old answers.
In jqgrid advanced searching, the value selected in drop down list was cleared after i add new criteria.
Below detail for your reference.
1) in jqgrid column model
{name:'instrumentType',
index:'instrumentType',
searchoptions:{
dataInit:instrumentTypeDataInit,
sopt: ['eq','ne','nu','nn','in','ni']},
align:"left",
stype:'select'},
2) javascripts function for instrumentTypeDataInit
instrumentTypeDataInit=function(el){
var categoryInstrumentTypeOptions = "${categoryInstrumentTypeOptions}";
$(el).append(categoryInstrumentTypeOptions);
}
3) when add criteria "Instrument Type", and select "OPTION", it goes well.
4) when add another criteria, the value selected is cleared.
Does anyone know why it is? and what's the solution? thanks a lot.
EDIT:
i've used the dataInit function in the wrong way, used searchOptions.value instead, the issue has been resolved, you can refer another post:best way to dynamically populate dropdown options in jqgrid advanced searching
i've used the dataInit function in the wrong way, used searchOptions.value instead, the issue has been resolved, you can refer another post, Oleg has given an answer:
I am new to jqGrid, and having trouble with achieving a couple of tasks. Any guidance will be a huge help.
I have a field (CREATE_DATE) whose value needs to be passed in the edit form. To achieve this I have to make it editable, but at the same time I don't want it to display in the edit form. Something similar to this issue (http://stackoverflow.com/questions/2368051/jqgrid-how-to-have-hidden-fields-in-an-edit-form) Something like this is what I want to achieve.
$('#CREATE_DATE_id]').attr('type', 'hidden');
Thanks a lot.
If you have some hidden column in the grid and you want to send the value only during the row editing you should include in the definition of the column the following properties:
editable: true, hidden: true, hidedlg: true, editrules: { edithidden: true }
If you want to display the column in the grid and need to send the data to the server, but you just don't want to display the data in the edit form you can mark the column as editable: true, but hide the field inside of beforeShowForm callback. You can even implement different behavior in Add and in Edit forms. See the answer for more details.
Pls have a look at http://jsfiddle.net/chugh97/YWVA8/56/
I have frozen the Inv No column. What I want to achieve is freeze the checkbox column only so when some one scrolls the checkbox column is not hidden from user's view.
Recently I answered here on the same question. Nevertheless I find the question very good and I think that the sharing of the solution could be interesting for many users of jqGrid. So I repeat the answer here shortly.
The demo which I created based on the demo from the answer allows not only make the column with the checkboxes be frozen, but additionally allows to implement inline editing together with the frozen columns:
I hope that Tony make the corresponding changes in the main code of jqGrid and the inline editing will be removed from the list of limitations of frozen columns.
The most important part of the code which do the trick is below
$grid.jqGrid('filterToolbar', {stringResult: true, searchOnEnter: false, defaultSearch: "cn"});
$grid.jqGrid('setColProp', 'cb', {frozen: true});
$grid.jqGrid('setGridParam', {multiselect: false});
$grid.jqGrid('setFrozenColumns');
$grid.jqGrid('setGridParam', {multiselect: true});
if($.isFunction($grid[0].p._complete)) {$grid[0].p._complete.call($grid[0]);}
fixPositionsOfFrozenDivs.call($grid[0]);
The implementation of the function fixPositionsOfFrozenDivs you can find either in the code of the demo or in the text of already referenced old answer.