Grid edit drop down grouped

[Manolo Capdevila]

Hi,

I've an editable grid.

A field is DropDown type, and I need show this datasource grouped, but I don't know how to do it.

Also I'll need enable search filter

Thanks

[Vignesh Natarajan]

Hi Manolo, 

 

Thanks for using Syncfusion products. 

 

Query: “I need show this datasource grouped, but I don't know how to do it. Also I'll need enable search filter” 

 

We have analyzed your query and we have achieved your requirement using the ActionComplete event of the grid when requestType is beginedit. Grouping in dropdownlist can be enabled using groupby property. 

 

Refer the below code snippet 

 

     col.Field("ShipName").HeaderText("ShipName").Width(150).Add(); 

            col.Field("ShipCountry").HeaderText("ShipCountry").Width(90).EditType(EditingType.Dropdown).Add(); 

        }) 

         .ClientSideEvents(eve => { eve.ActionComplete("complete"); }) 

) 

<script type="text/javascript"> 

    var skills = [{ 

        skill: "Cabbage", 

        category: "Leafy and Salad" 

    },  

.       .          .         .  

         

{ 

        skill: "Turmeric", 

        category: "Root and Tuberous" 

    }]; 

    function complete(args){ 

        if (args.requestType == "beginedit") 

            //GridID + ColumnName 

            $("#EditingEmployeeID").ejDropDownList({                

                watermarkText: "Select a vegetable", 

                enableFilterSearch: true,  // to enable searching 

                dataSource: skills,                 

                fields: { 

                    text: "skill", 

                    groupBy: "category"   // to enable grouoing  

                } 

            }); 

} 

</script> 

  

Refer the below screenshot for the output 

 

 

 

Refer our help documentation for your reference 

 

https://help.syncfusion.com/api/js/ejgrid#events:actioncomplete  

https://help.syncfusion.com/js/dropdownlist/functionalities#grouping  

https://help.syncfusion.com/js/dropdownlist/filtering#filter-search  

 

Regards, 

Vignesh Natarajan 

[Manolo Capdevila]

Thanks

But one annotation, when I edit, the selected value is not selected, so I  need save the selected value in a variable, assign the datasource, and selected the value saved

[Vignesh Natarajan]

Hi Manolo, 

Thanks for the update. 

Query: “when I edit, the selected value is not selected, so I  need save the selected value in a variable, assign the datasource, and selected the value saved” 

Sorry for the inconvenience caused.  

We have analyzed your issue and we suspect that you are saying that when editing a record, value is not updated for dropdown column. 

Previously we have suggested you to achieve your requirement using ActionComplete event. Kindly modify the sample as below codes.  

      col.Field("ShipName").HeaderText("ShipName").Width(150).Add(); 

            col.Field("ShipCountry").HeaderText("ShipCountry").DataSource((IEnumerable<object>)ViewBag.dataSource1).Width(90).DropDownEditOptions(new DropDownListProperties() { DropDownListFields = { GroupBy = "Category", Text = "Skill", Value = "Skill" }, EnableFilterSearch = true}).EditType(EditingType.Dropdown).Add(); 

        }) 

        

We have achieved your requirement using EditParams of the Grid. For default editors like dropdownlist,numerictext boxes we have support to render its default properties like watermark etc using EditOptions. 

For your convenience we have prepared a sample which can be downloaded from below link 

Sample: http://www.syncfusion.com/downloads/support/forum/136696/ze/SyncfusionMvcApplication401944915226  

Refer the below screenshot for the output 

 

If above solution does not resolve your query, please get back to us with more details. 

Regards, 

Vignesh Natarajan