We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

In-line Grid Dropdown in edit mode

Thread ID:

Created:

Updated:

Platform:

Replies:

132784 Sep 20,2017 04:55 PM Sep 25,2017 09:12 AM ASP.NET MVC 3
loading
Tags: Grid
Sam
Asked On September 20, 2017 04:55 PM

Hello,

Can you please help me map grid value with the dropdown?  When I try edit the row, the column show blank, it would not map with dropdown's value.

And how can you make the Grid's edit mode as default?

I am using the latest version of Syncfusion: 15.3450.0.29

Controller:
public class FeeScriptsController : Controller
    {
        public ActionResult Index()
        {
            List<FeeScriptModel> studentList = new List<FeeScriptModel>() {
                    new FeeScriptModel(){ DescriptionValue=1 },
                    new FeeScriptModel(){ DescriptionValue=2 },
                    new FeeScriptModel(){ DescriptionValue=3  },
                    new FeeScriptModel(){ DescriptionValue=4 },
                    new FeeScriptModel(){ DescriptionValue=5 }
                };
 
            List<dropDown> list = new List<dropDown>();
            list.Add(new dropDown(3, 1));
            list.Add(new dropDown(4, 2));
 
 
            ViewBag.dataSource = studentList;
            ViewBag.dataSource2 = list;
            return View();
        }
}

Cshtml:
@(Html.EJ().Grid<FeeScriptModel>("FlatGrid")
            .Datasource((IEnumerable<FeeScriptModel>)ViewBag.dataSource)
            .AllowPaging()
            .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("DescriptionValue")
                .HeaderText("Desc Value")                
                .Add();
                col.Field("DescriptionValue")
                    .HeaderText("dropdown")
                    .DataSource(ViewBag.dataSource2)
                    .EditType(EditingType.DropdownEdit).Add();
            })
)

Thank you.

Thavasianand Sankaranarayanan [Syncfusion]
Replied On September 21, 2017 12:12 PM

Hi Sam, 

Thanks for contacting Syncfusion support. 
 
In this query, we suspect that you want to populate ejDropDownList in any one of Grid column. In the given code snippet you have bound a local data to DropDownlist. So, we suggest you to pass the dataSource as text and value pair to the ejDropDownList. 
 
For an example, we have done dropdown list for the column “ShipCountry”. 
 
Refer the below code example. 
 
[GridCOntroller.cs]   
 
public class GridController : Controller 
    { 
                 List<Employees> emp = new List<Employees>(); 
        public ActionResult GridSample() 
        { 
             
            --- 
 
            BindDataSource(); 
            ViewBag.dropData = emp; 
            return View(); 
        } 
        private void BindDataSource() 
        { 
            if (emp.Count == 0) 
            { 
               emp.Add(new Employees() { text = "Argentina", value = "Argentina" }); 
                emp.Add(new Employees() { text = "Austria", value = "Austria" }); 
                emp.Add(new Employees() { text = "Belgium", value = "Belgium" }); 
                emp.Add(new Employees() { text = "Brazil", value = "Brazil" }); 
                emp.Add(new Employees() { text = "Canada", value = "Canada" }); 
                 
                --- 
 
           } 
        } 
         
        public class Employees 
        { 
            public string text { get; set; } 
            public string value { get; set; } 
        } 
         
---------------------------------- 
 
[GridSample.cshtml] 
 
@(Html.EJ().Grid<object>("FlatGrid") 
         
        .AllowPaging()    /*Paging Enabled*/ 
         
        ---- 
 
       .Columns(col => 
        { 
             
        ---- 
 
col.Field("ShipCountry").HeaderText("Ship Country").EditType(EditingType.Dropdown) 
.DataSource((IEnumerable<object>)ViewBag.dropData).Width(110).Add(); 
             
        })) 
     
 
  

We have prepared a single sample and it can be downloadable from the below location. 


Refer the help documentation. 



Regards, 
Thavasianand S. 


Sam
Replied On September 22, 2017 08:55 AM

Hi,

I know how to populate data for the grid and the dropdown,  but when in edit-mode,  they are not mapped together.  I attached a screenshot shown example.

Thank a lot.


Attachment: Capture_955989b2.zip

Thavasianand Sankaranarayanan [Syncfusion]
Replied On September 25, 2017 09:12 AM

Hi Sam, 

We have analyzed your given screen shot and we suspect that you have pass the dataSource for ejGrid as text and value. But we suggest you to pass the text and value pair dataSource for that dropdown column in Grid. 

Refer the below code example. 

[GridController.cs]    
  
public class GridController : Controller  
    {  
                 List<Employees> emp = new List<Employees>();  
        public ActionResult GridSample()  
        {  
              
            var DataSource = new NorthwindDataContext().OrdersViews.ToList(); 
            ViewBag.datasource = DataSource; // dataSource for Grid 
 
            BindDataSource();  
            ViewBag.dropData = emp; // dataSource for dropdown column 
            return View();  
        }  
        private void BindDataSource() // creating dataSource for dropdown column 
        {  
            if (emp.Count == 0)  
            {  
               emp.Add(new Employees() { text = "Argentina", value = "Argentina" });  
                emp.Add(new Employees() { text = "Austria", value = "Austria" });  
                emp.Add(new Employees() { text = "Belgium", value = "Belgium" });  
                emp.Add(new Employees() { text = "Brazil", value = "Brazil" });  
                emp.Add(new Employees() { text = "Canada", value = "Canada" });  
                  
                ---  
  
           }  
        }  
          
        public class Employees  
        {  
            public string text { getset; }  
            public string value { getset; }  
        }  
          
----------------------------------  
  
[GridSample.cshtml]  
  
@(Html.EJ().Grid<object>("FlatGrid")  
         .Datasource((IEnumerable<object>)ViewBag.datasource)  // binding dataSource for Grid 
        .AllowPaging()    /*Paging Enabled*/  
          
        ----  
  
       .Columns(col =>  
        {  
              
        ----  
  
col.Field("ShipCountry").HeaderText("Ship Country").EditType(EditingType.Dropdown)  
.DataSource((IEnumerable<object>)ViewBag.dropData).Width(110).Add(); // bind those text and value pair data to the dropdown column 
              
        }))  
      
  



  
If you still face the same issue then please reproduce the issue in the following attached sample. 


Regards, 
Thavasianand S. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;