I hava a problem in the filter functionality for a column thats has dropdown values .Below is my code,
{
name: 'statusFlag',
width: 130,
editable:true,
edittype:'select',
formatter : 'select',
searchoptions:{sopt:['cn','eq','ne']},
editoptions:{value:{Y:'Active',N:'Inactive'}}
}
If I perform search with 'y' I am seeing records with column value active, and If I perform search with 'n', I am seeing records with column value inactive. I want the same functionality to work when I enter active and inactive instead of y /n. How should i changed the code. Should i use formatOptions or anything else.
You need add stype: "select" property and extend searchoptions with value:
{
name: 'statusFlag',
width: 130,
editable: true,
edittype: 'select',
formatter: 'select',
searchoptions: { sopt: ['eq', 'ne'], value: ':Any;Y:Active;N:Inactive' } },
editoptions: { value: 'Y:Active;N:Inactive' }
}
The usage of :Any part in searchoptions.value is recommended if you use filterToolbar. If you use only searching dialog then you can remove the value and just use the same value like in editoptions.
Related
{
name: 'SelectedMaterial', datafield: 'SelectedMaterial',
sortable: false, align: 'center', width: '250', search: true,
formatter: 'checkbox', formatoptions: { disabled: false },
edittype: "checkbox", editoptions: { value: "Yes:No"}
}
based on value return from database, set checkbox checked or unchecked
You use formatter: 'checkbox' which parse the input data and display unchecked checkbox if the data is one of the following values: false, f, 0, no, n, off. All other input values will be displayed as the checked checkbox. I would recommend you to use 0 and 1 (corresponds to bit datatype of Transact-SQL) or true and false (corresponds to Boolean datatype, which exist in the most computer languges) as the input values.
I am using jqGrid to render some data. Now I want the ability to modify the data based on the values of two different select boxes. For example, I have a dropdown of location id's and a dropdown of date ranges. I want to filter by the location id and date range, handling this logic in my /something/search action. How can I pass this additional data into jqGrid dynamically? So, (1) on the initial load and (2) when on onChange event is fired, i'll pass in something like {data: {location_id: 10, range_start: '1/1/2012', range_end: '1/5/2010'}}. I could then read this in as a param, just like I do for "page", "rows", "sidx", etc..
Edit:
Included my existing code if needed:
grid.jqGrid({
url: "/something/search",
datatype: "json",
colNames: ['', 'ID', 'Description', 'Start', 'End', 'Last Updated'],
colModel: [{name:'act',index:'act', width:16,sortable:false},
{ name: 'id', index: 'id', width: 100, hidden: true },
{ name: 'description', index: 'description', width: 200 },
{ name: 'start_date', index: 'start_date', width: 120 },
{ name: 'end_date', index: 'end_date', width: 120 },
{ name: 'last_update', index: 'last_update', width: 120 }],
rowNum: 20,
rowList: [10, 20, 50],
pager: '#data-list-pager',
sortname: 'ident',
viewrecords: true,
sortorder: "desc",
multiselect: false,
height: "100%",
caption: "",
altRows: true,
width: 865});
The first way to solve the problem is to follow the way which I described here. In the case the controls which the user will use to filter the grid will be outside of the grid.
Another way which I can suggest is to use the Toolbar Searching. The advantage of the approach is that the controls used for searching will be integrated in the grid. In the case you can use either the select control or text input with the jQuery UI Datepicker.
To add the Toolbar Searching you need just call filterToolbar with the parameters which you prefer. If you would you stringResult: true option the format of the filters parameter which will be send to the server will be the same like in case of the usage of advanced searching. To define 'greater or equal' searching operation for the 'start_date' and the 'less or equal' searching operation for the 'end_date' you need just add searchoptions having 'ge' or 'le' as the first element of the sopt property.
As the result one will be able to filter the grid:
and
see the demo.
This doesn't seem to make sense, and unfortunately the one example on trirand seems to have the same bug
with this column model
{name:'txtFixtureType', index:'txtFixtureType', width:110,
stype: 'select',
edittype:'select', editoptions: {
value: ":All;1:Division 1;2:Division 2"}},
Enabling a toolbar search results in a select for the column, with the values populated. However with the advanced search dialog the select appears, but contains no values.
Is there some addition property that needs to be set?
Try with
{ name: 'txtFixtureType', index: 'txtFixtureType', width: 110,
edittype: 'select',
editoptions: { value: ":All;1:Division 1;2:Division 2" },
stype: 'select',
searchoptions: { sopt: ['eq', 'ne'], value: ":All;1:Division 1;2:Division 2" }
}
Additionally depend of your data saved it can be needed to use formatter: 'select' (see the documentation).
In general you can do combine toolbar searching with advance searching. See the demo from the answer.
I would like to use jqGrid for a great many grids that have only a small set of application-specific column types, and I would like to create a way to enforce consistency. For example, I want all my columns that show the compliance status of a row to have a certain format, be aligned a certain way, have specific search options, etc. So instead of having a colmodel entry like this:
{ name: 'ABC', width: 80, align: 'center', stype: "select",
searchoptions: { value: "1:Compliant;0:Not Compliant"} }
I would like to have one like this:
{ name: 'ABC', width: 80, mytype: compliancestatus }
where compliancestatus is a function I would write.
Is this kind of thing possible - without modifying the jqGrid source code? If so, can someone point me to an example of this type of extension?
Since jqGrid 3.8.2 are column templates supported.
You can just define for example
var compliancestatus = {
width: 80,
align: 'center',
stype: "select",
searchoptions: { value: "1:Compliant;0:Not Compliant" }
};
somewhere in the scope of visibility and then just use in colModel
{ name: 'ABC', template: compliancestatus }
In the template you can include any parameters. If the column definition has the same property but with the same value like
{ name: 'ABC', width: 100, template: compliancestatus }
the value from the colModel (width: 100 in the case) will be used.
I suggested the feature some time before and I use it intensively myself. For example I have many grids having many columns with checkboxes. I use the following template in the case:
mySettings.templateCheckbox = {
formatter: 'checkbox', align: 'center', width: 20,
edittype: 'checkbox', editoptions: { value: "1:0" },
stype: "select", searchoptions: { sopt: ['eq', 'ne'], value: ":Any;1:Yes;0:No" }
};
In the same way I defined many other templates which reduce the code of grids and improve managing of the common grid style.
If you want to change some common default settings for all columns you can use cmTemplate parameter of jqGrid. For example
cmTemplate: { align: 'center' }
You can use it as additional parameter of jqGrid or set it like any other default parameter with respect of
$.extend($.jgrid.defaults, {
cmTemplate: { align: 'center' }
});
Read more about the column templates here.
Here's a simple question. I have a jqGrid that's working great but I want set the default value for a checkbox to checked when user adds a new item. Here's a snippet of code:
{name: "Active", index: "active", width: 80, align: "center", sortable: false,
editable: true, edittype: "checkbox", editoptions: {value: "Yes:No"}}
I don't see anything in the documentation:
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:common_rules
You can use
editoptions: {value: "Yes:No", defaultValue: "Yes"}
(see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:common_rules#editoptions).
By the way, I personally use always the formatter: "checkbox" for columns like you have. Moreover
stype: "select", searchoptions: { value: "1:Yes;0:No" }
can also be helpful if you allow to search for values from the column.
UPDATED: Free jqGrid 4.13.6 (currently 4.13.6-pre, which one can get from GitHub) supports new stype: "checkbox". One can use, for example
stype: "checkbox", searchoptions: { sopt: ["eq"], value: "true:false" }
to have 3-state checkbox in the filter toolbar and 2-state checkbox in the Searching Dialog. The above searchoptions.value value means that the checked box corresponds the value "true" und unchecked box the value "false".
I have used this, it worked.
editoptions: {value: "true:false", defaultValue: "true"}