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.

Grid Editing with Datatable

Thread ID:

Created:

Updated:

Platform:

Replies:

128093 Jan 2,2017 05:24 AM Jan 3,2017 07:50 AM JavaScript 1
loading
Tags: ejGrid
Satheesh Kumar
Asked On January 2, 2017 05:24 AM

Hi

I am binding a grid using datatable and the columns are dynamic. I have also enabled adding and editing using inline edit form mode. While posting data to mvc controller i am not able to get the values. I have tried various combinations in the signature but still unable to get the inserted/updated data. Here is the code i have used.

Javascript:
  var dataManager = ej.DataManager({
                                                url: "Module/GetData",
                                               insertUrl:"Module/InsertGridItem",
                                                adaptor: new ej.UrlAdaptor()
                                            });
  $("#Grid").ejGrid({
                                                dataSource: dataManager,
...
.....
 });

MVC:
DataSource:
 public ActionResult GetData(Syncfusion.JavaScript.DataManager dm)
{
 DataTable dt = new DataTable();
//dt=from db....
            return Json(new { result = ConvertTableToList(dt), count =dt.Rows.Count }, JsonRequestBehavior.AllowGet);
}
public static List<Dictionary<string, object>> ConvertTableToList(DataTable dt)
        {
            return dt.AsEnumerable()
              .Select(r => r.Table.Columns.Cast<DataColumn>()
                      .Select(c => new KeyValuePair<string, object>(c.ColumnName, r[c.Ordinal])
                     ).ToDictionary(z => z.Key, z => z.Value)
              ).ToList();
        }


CRUD Action:
public ActionResult InsertGridItem(FormCollection value)-Not working
public ActionResult InsertGridItem(Object value)-Not working
public ActionResult InsertGridItem(DataTable value)-Not working

Thanks for your help in advance.


Jayaprakash Kamaraj [Syncfusion]
Replied On January 3, 2017 07:50 AM

Hi Satheesh, 
 
Thank you for contacting Syncfusion support. 
 
To overcome this problem we suggest you to use ExpandoObject class for dynamic binding. The ExpandoObject class enables you to add and delete members of its instances at run time and also to set and get values of these members. Please refer to the below document and code example 
 

<script type="text/javascript"> 
    $(function () { 
        
        $("#Grid").ejGrid({ 
            dataSource: ej.DataManager({ 
                url: "/Grid/DataSource", 
                updateUrl: "/Grid/Update", 
                insertUrl: "/Grid/Insert", 
                removeUrl: "/Grid/Delete", 
                adaptor:"UrlAdaptor" 
             
            }), 
.. 
 
        }); 
    }); 
 
</script> 
 
………………………… 
 
        public ActionResult DataSource(DataManager dm) 
        { 
            List<ExpandoObject> datasource = new List<ExpandoObject>(); 
            dynamic row = new ExpandoObject(); 
            row.id = 1; 
            row.verified = true; 
            row.name = "Name 1"; 
            datasource.Add(row); 
            dynamic row1 = new ExpandoObject(); 
            row1.id = 2; 
            row1.verified = false; 
            row1.name = "Name 2"; 
            datasource.Add(row1); 
            var dt = new DataTable(); 
            foreach (var col in ((IDictionary<string, object>)datasource[0])) 
            { 
                dt.Columns.Add(col.Key, col.Value.GetType()); 
            } 
            foreach (dynamic val in datasource) 
            { 
                IDictionary<string, object> items = val; 
                dt.Rows.Add(items.Values.ToArray()); 
            } 
            IEnumerable DataSource = ConvertTableToList(dt); 
            DataResult result = new DataResult(); 
            DataOperations operation = new DataOperations(); 
            result.result = DataSource; 
            result.count = result.result.AsQueryable().Count(); 
            if (dm.Skip > 0) 
                result.result = operation.PerformSkip(result.result, dm.Skip); 
            if (dm.Take > 0) 
                result.result = operation.PerformTake(result.result, dm.Take); 
            return Json(result, JsonRequestBehavior.AllowGet); 
        } 
        public static List<Dictionary<string, object>> ConvertTableToList(DataTable dt) 
        { 
            return dt.AsEnumerable() 
              .Select(r => r.Table.Columns.Cast<DataColumn>() 
                      .Select(c => new KeyValuePair<string, object>(c.ColumnName, r[c.Ordinal]) 
                     ).ToDictionary(z => z.Key, z => z.Value) 
              ).ToList(); 
        } 
        public ActionResult Insert(ExpandoObject value) 
        { 
            //do your operations here 
        } 
        public ActionResult Update(ExpandoObject value) 
        { 
            //do your operations here 
        } 
 
        public ActionResult Delete(int key) 
        { 
            //do your operations here 
 
        } 
        public class DataResult 
        { 
            public IEnumerable result { get; set; } 
            public int count { get; set; } 
} 
        } 

The editing is performed based on the primary key column so we need to set isPrimarykey property for primary key column and refer to the below help document and code example. 
 
 
 
<script type="text/javascript"> 
    $(function () { 
        
        $("#Grid").ejGrid({ 
.. 
            dataBound: function(args){ 
                //for editing actions, primaryKey column is must  
                //we have defined them in the dataBound event 
                //always recommended to placed the primarykey column as first column 
                var column = args.model.columns[0]; 
                column.isPrimaryKey = true; 
                //Here columns method used to update the particular column 
                this.columns(column, "update"); 
            }, 
.. 
 
        }); 
    }); 
 
</script> 
 

Regards, 
 
Jayaprakash K. 


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.

;