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. Image for the cookie policy date

Script error when using grid that has Dropdown edit column

I'm using the latest release, when I use a column with an edit type of dropdown, when I add a new record I get this error:

Uncaught TypeError: n.render[(this._id + "_JSONEditingTemplate")] is not a function

I'm not sure if it's related, but before this error I get this one when the grid loads:

Uncaught TypeError: Cannot read property 'ejPvtData' of undefined

Here's my client side code:

$("#ClassificationMapGrid").ejGrid({
                dataSource: ej.DataManager({ url: '@Url.Content("~/MappingData/Data")', updateUrl: '@Url.Content("~/MappingData/Update")', insertUrl: '@Url.Content("~/MappingData/Insert")', removeUrl: '@Url.Content("~/MappingData/Delete")', adaptor: new ej.UrlAdaptor() }),
                allowPaging: true,
                allowSorting: true,
                allowFiltering: true,
                filterSettings: { filterType: "excel" },
                editSettings: { allowEditing: true, allowAdding: true, allowDeleting: true },
                exportToExcelAction: '@Url.Content("~/MappingData/ExportExcel")',
                toolbarSettings: { showToolbar: true, toolbarItems: [ej.Grid.ToolBarItems.Search, ej.Grid.ToolBarItems.ExcelExport, ej.Grid.ToolBarItems.PrintGrid, ej.Grid.ToolBarItems.Add, ej.Grid.ToolBarItems.Edit, ej.Grid.ToolBarItems.Delete, ej.Grid.ToolBarItems.Update, ej.Grid.ToolBarItems.Cancel] },
                pageSettings: { pageSize: 15 },
                sortSettings: { sortedColumns: [{ field: "ClassificationName" }] },
                allowGrouping: false,
                columns: [
                        { field: "ClassificationID", isPrimaryKey: true, visible: false, headerText: "ID", width: 30 },
                        { field: "ClassificationName", headerText: "Name", width: 75, validationRules: { required: true } },
                        { field: "ClassificationDescription", headerText: "Description", width: 150, allowGrouping: false, validationRules: { required: true } },
                        { field: "ClassificationElementType", headerText: "Type", editType: ej.Grid.EditingType.Dropdown, width: 100, allowGrouping: false },
                        { field: "Status", headerText: "Status", width: 50, type: "boolean", editType: ej.Grid.EditingType.Boolean, allowGrouping: false }
                ]
            });

3 Replies

SR Sellappandi Ramu Syncfusion Team November 19, 2015 11:10 AM UTC

Hi Gary Bettencourt,

Thanks for contacting Syncfusion support.

We have tested the reported issue at our end, the problem is occurring when using URLAdaptor with edit type as dropDown.

While setting the edit type as dropDown in URLAdaptor we need to bind the data source to dropDownList by using dataSource property. Because when we set the dropDown edit type, we need to binding the whole data for the particular field, but in URLAdaptor we are unable to get the Whole data of the particular field.

Please refer to the code example and sample,

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

.Datasource(ds => ds.URL("/Grid/Datasource").Adaptor(AdaptorType.UrlAdaptor))

.AllowSorting()

.AllowPaging()

.AllowFiltering()

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

.FilterSettings(filter => { filter.FilterType(FilterType.Menu); })

.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).Type("number").Width(90).ValidationRules(v => v.AddRule("required", true).AddRule("number", true)).Add();

    col.Field("EmployeeID").HeaderText("Employee ID").TextAlign(TextAlign.Left).Width(90).Add();

    col.Field("ShipName").HeaderText("ShipName").Type("string").Width(200).Add();

    col.Field("Freight").HeaderText("Freight").TextAlign(TextAlign.Right).Width(80).Type("number").EditType(EditingType.Numeric).Format("{0:C}").Add();

    col.Field("ShipCity").HeaderText("ShipCity").EditType(EditingType.Dropdown).DataSource((IEnumerable<object>)ViewBag.dataSource2).Width(150).Add();

})
)

[Controller]

public ActionResult GridFeatures()

        {

            ViewBag.dataSource2 = City;

            return View();

        }

        public List<object> City

        {

            get

            {

                var Orders = new NorthwindDataContext().OrdersViews.Select(x=>x.ShipCity).Distinct().ToList();

                var ShipCity = new List<object>();

                foreach (var id in Orders)

                {

                    ShipCity.Add(new { value = id, text = id });

                }

                return ShipCity;

            }
        }


Sample: http://www.syncfusion.com/downloads/support/directtrac/147364/ze/Sample_1473641544620873

In the above sample we have iterate the ShipCity field in orders table and add to the list value.

Note: While binding the data to dropdown we need to specify the text and value property.

Regards,
Sellappandi R


JI juan infante coronado replied to Sellappandi Ramu April 1, 2018 08:40 PM UTC

Hi Gary Bettencourt,

Thanks for contacting Syncfusion support.

We have tested the reported issue at our end, the problem is occurring when using URLAdaptor with edit type as dropDown.

While setting the edit type as dropDown in URLAdaptor we need to bind the data source to dropDownList by using dataSource property. Because when we set the dropDown edit type, we need to binding the whole data for the particular field, but in URLAdaptor we are unable to get the Whole data of the particular field.

Please refer to the code example and sample,

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

.Datasource(ds => ds.URL("/Grid/Datasource").Adaptor(AdaptorType.UrlAdaptor))

.AllowSorting()

.AllowPaging()

.AllowFiltering()

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

.FilterSettings(filter => { filter.FilterType(FilterType.Menu); })

.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).Type("number").Width(90).ValidationRules(v => v.AddRule("required", true).AddRule("number", true)).Add();

    col.Field("EmployeeID").HeaderText("Employee ID").TextAlign(TextAlign.Left).Width(90).Add();

    col.Field("ShipName").HeaderText("ShipName").Type("string").Width(200).Add();

    col.Field("Freight").HeaderText("Freight").TextAlign(TextAlign.Right).Width(80).Type("number").EditType(EditingType.Numeric).Format("{0:C}").Add();

    col.Field("ShipCity").HeaderText("ShipCity").EditType(EditingType.Dropdown).DataSource((IEnumerable<object>)ViewBag.dataSource2).Width(150).Add();

})
)

[Controller]

public ActionResult GridFeatures()

        {

            ViewBag.dataSource2 = City;

            return View();

        }

        public List<object> City

        {

            get

            {

                var Orders = new NorthwindDataContext().OrdersViews.Select(x=>x.ShipCity).Distinct().ToList();

                var ShipCity = new List<object>();

                foreach (var id in Orders)

                {

                    ShipCity.Add(new { value = id, text = id });

                }

                return ShipCity;

            }
        }


Sample: http://www.syncfusion.com/downloads/support/directtrac/147364/ze/Sample_1473641544620873

In the above sample we have iterate the ShipCity field in orders table and add to the list value.

Note: While binding the data to dropdown we need to specify the text and value property.

Regards,
Sellappandi R

ok


FS Farveen Sulthana Thameeztheen Basha Syncfusion Team April 2, 2018 12:41 PM UTC

 Hi Juan, 

Thanks for your update. Please get back to us if you need any further assistance. 

Regards, 

Farveen sulthana T 


Loader.
Live Chat Icon For mobile
Up arrow icon