Bind MultiSelect Dropdown to Microsoft SQL Server Table Column

Hello Syncfusion,

I am having a batch edit grid in which I have a column that is supposed to be a multiselect dropdown, however, I have written method to bind the column both on saving and returning records, however, I am getting a build up error on my project as you can see in the screen below:


How can I achieve a proper function multi select dropdown that is having a datasource from the Microsoft SQL Server.Below in the grid column snippet of my multi select dropdown.

 <GridColumn Field=@nameof(CouncilofDecisionsCountry.NonImplementationReason) HeaderText="Reason for Non/Delayed Implementation" Width="150">

                                                            <EditTemplate Context="NonImpReasonContext">

                                                                @{

                                                                    List<int> c = new List<int>();

                                                                    if (!string.IsNullOrEmpty((NonImpReasonContext as CouncilofDecisionsCountry).NonImplementationReason))

                                                                    {

                                                                        var a = (NonImpReasonContext as CouncilofDecisionsCountry).NonImplementationReason.Split(',');


                                                                        foreach (var n in a)

                                                                        {

                                                                            //int b = Convert.ToInt32(n.Trim());

                                                                            int b = Convert.ToInt32(n.Trim());

                                                                            c.Add(b);

                                                                        }

                                                                    }

                                                                    <SfMultiSelect @bind-Value="@(c.ToArray())" DataSource="@NonImplementationReasonData" TValue="int[]" TItem="ANonImplementationReasons"></SfMultiSelect>

                                                                    <MultiSelectFieldSettings Value="@nameof(ANonImplementationReasons.Id)" Text="@nameof(ANonImplementationReasons.Name)"></MultiSelectFieldSettings>

                                                                }

                                                            </EditTemplate>

                                                            <Template Context="NonImplemReasonsContext">

                                                                @{

                                                                    var d = (NonImplemReasonsContext as CouncilofDecisionsCountry).NonImplementationReason;

                                                                    <span>@String.Join(",", d)</span>

                                                                }

                                                            </Template>

</GridColumn>

I have attached the razor page in which I am doing this as shown below and the model class of my database table.


Thank You


Attachment: MultiselectError_c96f7c82.rar

3 Replies

VN Vignesh Natarajan Syncfusion Team November 22, 2021 06:58 AM UTC

Hi Ssekamatte,  
 
Thanks for contacting Syncfusion support.  
 
Query: “however, I am getting a build up error on my project as you can see in the screen below: 
 
We have analyzed your query and we are able to reproduce the reported issue at our end also while preparing a sample using your code example. This is because the @bind-Value property of MultiSelect cannot be converted value (you have converted the values to Array). Because @bind-Value denotes two way binding where values selected in component will be directly reflected in the EditForm (i.e) Grid edit action. 
 
From your code example, we found that you have defined the MultiSelect component wrongly (MultiSelectFieldSettings is defined outside of MultiSelect Component) in the EditTemplate. Also you have defined the type of column as String and tried to display the int[] as TValue for MultiSelect component. So we are quite confused about the values being displayed in the Grid for NonImplementationReason column. Kindly confirm whether it is string made of list of integers “1,2,3,4,5,” or string made of list of string “ItemA, itemB, ItemD”. Because in the MultiSelect Component you have defined the value in key value pair.        
 
Already we have documented topic on rendering MultiSelect component inside the Grid Edit mode. Kindly refer the below UG for your reference 
 
 
Also for your convenience we have prepared a sample as per your code example and modified the sample to compile and execute successfully. We have saved the changes in Grid using OnCellSave event of Grid. Kindly refer the below sample.  
 
 
 
If you are still facing any issues, kindly get back to us with more details about your requirement.  
 
Regards, 
Vignesh Natarajan   



SJ Ssekamatte James November 24, 2021 11:01 AM UTC

Hi  Vignesh,

I am glad to inform you that the solution you provided to me here last has helped me achieve what I wanted.

Thank You very much.




VN Vignesh Natarajan Syncfusion Team November 25, 2021 03:54 AM UTC

Hi Ssekamatte,  

Thanks for the update.  

We are glad to hear that you have resolved your query using our sample solution.  

Please get back to us if you have further queries.  

Regards, 
Vignesh Natarajan 


Loader.
Up arrow icon