Grid inline editing - DropDown field not set to correct value

[Tom Frajer]

Hi,

I created editable grid with some DropDown columns:

col.Field(m => m.ns_to_state).HeaderText("Přechod do stavu").EditType(EditingType.Dropdown).DataSource(ViewBag.workflowStates).Width(50).Add();

In my DataSource, I have List of text and values - DataSource(ViewBag.workflowStates):

    public class DropDownTextValue

    {

        public DropDownTextValue()

        {

        }

        public DropDownTextValue(string text, int value)

        {

            this.text = text;

            this.value = value;

        }

        public string text { get; set; }

        public int value { get; set; }

    } 

Here: Field(m => m.ns_to_state) I have string text that I want to display in grid - this is OK. 

My problem is that once I click any row to edit it, I see dropdown correctly populated with text and values from ViewBag.workflowStates, but there is always first item selected in the dropdown. How can I make it show item that is in the grid before edititing the row?

Please see attached image for details. 

Thank you,

Tom

Attachment: screenshots__33e5ac96.zip

[Venkatesh Ayothi Raman]

Hi Tom, 

Thanks for contacting Syncfusion support. 

We were unable to reproduce the issue at our end and created a sample for your application. This issue has been reproduced when editing the Grid record in which editable value doesn’t match the Dropdown data source value. For e.g. If Grid record has customerID column value as “Mike” but in dropdown data source doesn’t have the “Mike” value. This is the cause of this issue. Please refer to the sample, 

Sample:http://www.syncfusion.com/downloads/support/directtrac/general/7z/DropdownData1525720120 

If we you still face the same issue, then could you please provide the following details? 

1)      Share the Grid code example. 

2)      Essential studio Version and browser details. 

3)       Share the dropdown datasource code example. 

Regards, 

Venkatesh Ayothiraman. 

[Tom Frajer]

Yes, that is the case. I have integer IDs in dropdown value so those do not match grid records.

It is like if you have this in your example. Im also attaching some of my project sources that you are interested in. Basically, I have texts on my grid, and then same texts in my dropdowns, but dropdowns values are IDs of items from database. I need to have it like this because I have existing applications with its database and Im rewriting that application - keeping old database and its structure.

    public class GridController : Controller

    {

        //

        // GET: /Grid/

        public ActionResult GridFeatures()

        {

            var DataSource = new NorthwindDataContext().OrdersViews.ToList();

            ViewBag.datasource = DataSource;

            List<Employee> employee = new List<Employee>();

            employee.Add(new Employee("1", "ALFKI"));

            employee.Add(new Employee("2", "ANATR"));

            employee.Add(new Employee("3", "AROUT"));

            employee.Add(new Employee("4", "BONAP"));

            employee.Add(new Employee("5", "BOTTM"));

            employee.Add(new Employee("6", "ANTON"));

                 employee.Add(new Employee("7", "BERGS"));

                 employee.Add(new Employee("8", "BLONP"));

                 employee.Add(new Employee("9", "BLAUS"));

            ViewData["LocalDataSource"] = employee;

            return View();

        }

        public ActionResult GetUsers(Syncfusion.JavaScript.DataManager dm)

        {

            //  List<EditableOrder> emp = new List<EditableOrder>();

            // emp.Add(new EditableOrder() { ID = "100", Nome = "Jhon", Email = "[e-mail]", OldPassword = "12345", Password = "123456", ConfirmPassword = "123456" });

            IEnumerable data = OrderRepository.GetAllRecords();

            DataOperations operation = new DataOperations();

            if (dm.Sorted != null && dm.Sorted.Count > 0) //Sorting

            {

                data = operation.PerformSorting(data, dm.Sorted);

            }

            if (dm.Where != null && dm.Where.Count > 0) //Filtering

            {

                data = operation.PerformWhereFilter(data, dm.Where, dm.Where[0].Operator);

            }

            int count = data.Cast<EditableOrder>().Count();

            if (dm.Skip != 0)

            {

                data = operation.PerformSkip(data, dm.Skip);

            }

            if (dm.Take != 0)

            {

                data = operation.PerformTake(data, dm.Take);

            }

            return Json(new { result = data, count = count });

        }

        public ActionResult Insert(EditableOrder value)

        {

            

            var data=OrderRepository.GetAllRecords();

            return Json(value, JsonRequestBehavior.AllowGet);

        }

        public class Employee

        {

            public Employee()

            {

            }

            public Employee(String value, string text)

            {

                this.value = value;

                this.text = text;

            }

            public int value { get; set; }

            public string text { get; set; }

        }

    }

Attachment: source_d181c20b.7z

[Karthick Kuppusamy]

Hi Tom, 

We have analyzed your scenario and we have modified the previous sample based on your requirement. 

Please find the code example. 

 

@(Html.EJ().Grid<object>("FlatGrid") 

        .Datasource((IEnumerable<object>)ViewBag.datasource) 

         . 

         . 

         .EditSettings(edit=>{edit.AllowAdding().AllowDeleting().AllowEditing(); }) 

              .ToolbarSettings(toolbar => 

                { 

                 toolbar.ShowToolbar().ToolbarItems(items => 

                 { 

                  items.AddTool(ToolBarItems.Add); 

                  items.AddTool(ToolBarItems.Edit); 

                  items.AddTool(ToolBarItems.Delete); 

                  items.AddTool(ToolBarItems.Update); 

                  items.AddTool(ToolBarItems.Cancel); 

                }); 

              }) 

                 

        .Columns(col => 

        { 

            col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).TextAlign(TextAlign.Right).Width(75).Add(); 

            col.Field("CustomerID").HeaderText("Customer ID").EditType(EditingType.Dropdown).DataSource((IEnumerable<object>)ViewData["LocalDataSource"]).Width(80).Add();//dropdown dataSource 

            col.Field("EmployeeID").HeaderText("Employee ID").TextAlign(TextAlign.Right).Width(75).Add(); 

            col.Field("Freight").HeaderText("Freight").TextAlign(TextAlign.Right).Width(75).Format("{0:C}").Add(); 

            col.Field("OrderDate").HeaderText("Order Date").Format("{0:dd/MM/yyyy}").TextAlign(TextAlign.Right).Width(80).Add(); 

            col.Field("ShipCity").HeaderText("Ship City").Width(110).Add(); 

             

        })) 

</div> 

 

Please find the server side: 

   

public ActionResult GridFeatures() 

        { 

            var DataSource = new NorthwindDataContext().OrdersViews.ToList(); 

            ViewBag.datasource = DataSource; 

 

            List<Employee> employee = new List<Employee>(); 

            employee.Add(new Employee(1, "ALFKI")); 

            employee.Add(new Employee(2, "ANATR")); 

            employee.Add(new Employee(3, "AROUT")); 

            employee.Add(new Employee(4, "BONAP")); 

            employee.Add(new Employee(5, "BOTTM")); 

            employee.Add(new Employee(6, "ANTON")); 

            employee.Add(new Employee(7, "BERGS")); 

            employee.Add(new Employee(8, "BLONP")); 

            employee.Add(new Employee(9, "BLAUS")); 

            ViewData["LocalDataSource"] = employee;//dropdown data source 

            return View(); 

        } 

Note:  

 

1.     The dropdown must be contains from grid records. 

2.      While performing editing operation in grid , the dropdown text is used for display purpose . and value is reference of grid records (So grid save the edited record based on its dropdown value) 

 

This is the default behavior. 

 

Please share the following details to us it would be helpful for us to find the prompt solution. 

 

1.Which value do you want to like to save? 

 

2.Do you want to save the data like foreignkey concept? 

 

3.Please share more details about your requirement. 

 

 

For your reference we have created a sample and same it can be downloaded from the following location. 

http://www.syncfusion.com/downloads/support/directtrac/general/ze/DropdownData-1728454032.zip. 

 

Regards, 

K.Karthick. 

 

[Tom Frajer]

1, I want to show Employee.text in the grid column and also in the drop down list. Employee.value will be used only internaly and will be passed to controler on editing and/or deleting. Employee.value is foreign key to another table in database (primary key of list of emloyees). All operations will be taken on values (ids). Text is only for user presentation in views.

2, Yes, it is foreign key to another table in database.

[Tom Frajer]

I tried your latest sample application. You did not included MDF database so I used MDF from previous sample (not sure if this is OK). Once I run it, I see the grid, doubleclick record in grid and it behaves in same bad way like in my application. In dropdown, I see always first item selected (for example, if editing ANTON, after doubleclick, I see ALFKI in the dropdown). After update operation, there is numeric ID shown in the grid - this is secon problem. Expected behaviour is, that when I doubleclick ANTON record, it switches to inline editing, I see dropdown with ANTON selected, make some changes and then after save see text (not numeric value) in my grid.

[Karthick Kuppusamy]

Hi Tom, 

We have analyzed your requirement and while performing editing operation in grid,the dropdown text is used for display purpose and value is reference of grid records (So grid save the edited record based on its dropdown value). 

 

This is the default behavior. 

 

We suggest you to use the foreignkey concept for your requirement. 

 

Please find the code example. 

 

@(Html.EJ().Grid<object>("FlatGrid") 

        .Datasource((IEnumerable<object>)ViewBag.datasource) 

        . 

        . 

        .        

     .Columns(col => 

        { 

         col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).TextAlign(TextAlign.Right).Width(75).Add(); 

        col.Field("CustomerID").HeaderText("CustomerID"). 

        ForeignKeyField("ID").ForeignKeyValue("Name").EditType(EditingType.Dropdown).DataSource((IEnumerable<object>)ViewData["LocalDataSource"]).Width(80).Add(); 

        col.Field("EmployeeID").HeaderText("Employee ID").TextAlign(TextAlign.Right).Width(75).Add(); 

        col.Field("Freight").HeaderText("Freight").TextAlign(TextAlign.Right).Width(75).Format("{0:C}").Add(); 

        col.Field("OrderDate").HeaderText("Order Date").Format("{0:dd/MM/yyyy}").TextAlign(TextAlign.Right).Width(80).Add(); 

        col.Field("ShipCity").HeaderText("Ship City").Width(110).Add(); 

             

        })) 

</div> 

Foreign key dataSource: 

 

List<Employee> employee = new List<Employee>(); 

            employee.Add(new Employee("ALF", "ALFKI"));//like the text and vaue pair 

            employee.Add(new Employee("ANA", "ANATR")); 

            employee.Add(new Employee("ARO", "AROUT")); 

            employee.Add(new Employee("BON", "BONAP")); 

            employee.Add(new Employee("BOT", "BOTTM")); 

            employee.Add(new Employee("ANT", "ANTON")); 

            employee.Add(new Employee("BER", "BERGS")); 

            employee.Add(new Employee("BLO", "BLONP")); 

            employee.Add(new Employee("BLA", "BLAUS")); 

            ViewData["LocalDataSource"] = employee; 

 

         

 public class Employee 

        { 

            public Employee() 

            { 

 

            } 

            public Employee(string text, string value) 

            { 

                this.Name = text; 

                this.ID = value; 

            } 

            public string ID { get; set; } 

            public string Name { get; set; } 

         

Please refer the following UG link for more information. 

https://help.syncfusion.com/js/grid/columns#foreign-key-column. 

For your reference we have created a sample based on your requirement and same it can be downloaded from the following location. 

http://www.syncfusion.com/downloads/support/directtrac/general/ze/DropdownData-323582591-624468587.zip. 

Online link: http://mvc.syncfusion.com/demos/web/grid/foreignkeycolumn. 

Please let us know if you have any concern. 

Regards, 

K.Karthick. 

 

[Tom Frajer]

Perfect, that is it! :)

Thank you very much for help!

[Karthick Kuppusamy]

Hi Tom, 

Thanks for the update. 

We are happy to hear that your requirement is achieved. 

Regards, 

K.Karthick.