Kendo Grid - Customize Filter Row - telerik

there is a feature called "Filter Row" in Kendo Grid
http://demos.telerik.com/kendo-ui/grid/filter-row
I want to add a drop-down list instead of a text box or a number box, to the filter box. It's for filtering a column that has countries. So I want list of countries in a drop-down list. How can I do this?

It's very similar to the custom Filter Menu (http://demos.telerik.com/kendo-ui/grid/filter-menu-customization). I made the mistake of no using valuePrimitive: true. You might not want it in your situation but keep that in mind.
Here's a sample: http://dojo.telerik.com/OKaS
Also, the filter menu should take up the editor model of the column but it's not always what you want.
Edit
Starting from 2014 Q2 SP1, the template function now receives an object containing "datasource" and "element". In my example, you would have to change the dropdown initialization from "container.kendoDropDownList" to "container.element.kendoDropDownList". The datasource is empty in my example but I'm assuming this can be used to pass the choices to a control without requiring another datasource or to externalize your current. I have not experimented with this feature but I suggest you do before taking my sample blindly.

As Pluc mentioned earlier valuePrimitive: true will help you create a custom filter for your grid/columns to send id's to your controller, if you are not using setting this property true you will receive an Object in your controller instead of a number, the conversion will not be made automatically . This is still working as of 2019

Related

DropDownList in custom Grid popup editor - filter datasource

I'm using a custom popup editor in a detail grid (several fields are using data attribute initialization).
One of the fields is a Kendo DropDownList, but I need the options in the list to be filtered based on the value of one of the fields in the currently expanded master row.
I've managed a buggy workaround by setting a global variable when a master row is expanded and then filtering the dropdownlist's datasource using a function call on the open event.
I'm sure there must be a better way to do this. Is it possible to specify a datasource filter using data attribute initialization -- I can't see anything in the docs for this.
Thanks
Missed the obvious...
I just needed to filter the datasource for the drop down list in the grid's edit event.

Which dojo widget should be used for DropDown

I wish to create dynamic dropdown, meaning the value of the second dropdown changes with the change in selection on the first. I was looking through the Dojo docs and it seems there are 3 different widgets that I can use,
dijit/form/ComboBox
dojox/form/DropDownSelect
dijit.form.Select
Now I am confused as to which one should i use for creating Dynamic DropDowns?
You can choose anyone depending upon what extra features you want. While dijit.form.Select is your normal HTML select, combobox and filteringselect offer more features.
Follow http://kennethfranqueiro.com/2010/06/combobox-vs-filteringselect/ for a comparison between the two. You can also play with them to know how they work.
I had used FilteringSelect in my app for the same behavior as need.
Differences between dojo dropdown :
Select It is simple combobox like select in HTML with no validation
and not provide any search facility inside select options.
ComboBox It is pure form of combobox and name as ComboBox again it
will not provide any default validation but it provide search
facility within its options.
FilteringSelect It is an advance form of select have default
facility of validation and search facility. And it also has property
to take value as input tag take value in HTML.
In dojo you can also try custom validation which is provided inside dojox library. I hope it will help you.

jQgrid multiselect with dynamic changed cell value based on dropdown selection

I just found that sample
http://www.ok-soft-gmbh.com/jqGrid/DataToMultiSelect2.htm
I want to have something similar:
I want to be able to post selected values on server and also i want to have a dropdown and based on that dropdown selection another cell value of that row gettign changed
How can i do that?
|Id|Dropdown|ValueChangedOnDropdownChanged|
1 A[A/B] A selected
2 B[A/B] B selected
*[A/B] it is dropdown options
I am not sure that I understand your question correct. The demo which you reference in your question I created before for the answer and this one.
Look at the another old demo. It shows how to implement dependent select (dropdown) list. The demo shows how to it in inline editing, form editing and the searching toolbar. In case of the usage of server base data you will have to use dataUrl and buildSelect to implementation of the same behavior. The dataUrl should be used instead of the v property of the searchoptions or editoptions. The buildSelect can be used ton only to modify the server response, but just as the good place to rebuild the dependent select (dropdown list).

jqGrid using radio buttons for editable rows

I'm currently using jqGrid and ASP.Net MVC. With my current project, my goal is to provide a grid of data to the end user, and they can then edit this. The data is machine-generated, and the users will be confirming if the machine is correct or not.
I think ideally for speed, I'd like to provide a row per item, with a radio button group as the editable. The users could then pick from the values 'Unknown', 'Correct', 'Incorrect'.
As there will be a lot of data, I'd also like to provide a control of some type that can set all rows in the grid to one of the available radio button choices, for the user experience.
Given that there seems to be no native support for this in jqGrid, I wanted to ask if anyone has had any experience writing something like this, and whether this is achievable and reliable, or whether I should stick with the drop-down editable approach that is native to jqGrid.
To implement radio button as the editable instead of the standard drop-down editable approach you can use so named custom editing feature of jqGrid (see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:common_rules#custom). This allows you to create any custom control to edit the cell value. An example of the implementation you can find here: Add multiple input elements in a custom edit type field.
To set all rows in the grid to one of the available radio button choices you can use either a control outside of jqGrid or add an additional custom button in the navigation bar (see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:custom_buttons). If you search for navButtonAdd you will find a lot of examples how to implement this, for example, Jqgrid: navigation based on the selected row. Because you use server based data, you can just call a method on the server to make the changes which you need and then call trigger("reloadGrid") to refresh jqGrid data.

InfoPath 2007 - Populate drop-down list on-the-fly

I'm working on an InfoPath 2007 form. I have two drop-down lists and i need the second to be populated with items bases on the value chosen in the first list. I use c# to populate the drop-dpwn lists from external sources. I've tried to use the OnChange event to make all this, but the second list is still empty.
If anyone knows, please tell me.
You can filter the entries for the second drop-down list based on your first list (but only if the entries are based on a data source, not manually entered).
Bring up the properties window for
your second drop-down list.
Select your data source.
Click on the button to the right of the Entries text box.
Select the repeating node you wish to use for the basis of your list entry.
Click the Filter Data button. From here you can enter a filter to limit the entries displayed based on the value of your first drop-down list.
Your question was a bit ambiguous. You may be trying to populate a secondary data source based off of your first drop-down list. This should work fine with an OnChange event. Can you post the code you are using to do this?
Some additional tips that may help:
The change event will not fire until focus moves off of the list box. So, for the second drop down to populate, you will need to set the first drop-down then hit tab or click elsewhere in the form.
I don't know the size or nature of the data source you are using for the second drop-down list, but you may consider downloading the entire data source and filter it using the method I described above. This may be a better solution as you won't need to make a database query between entering the first list box and the second one.

Resources