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. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

DropDownEdit with databound items

Thread ID:

Created:

Updated:

Platform:

Replies:

147474 Sep 11,2019 10:12 PM UTC Sep 16,2019 10:24 AM UTC ASP.NET Core - EJ 2 5
loading
Tags: DataGrid
Michael J Norman
Asked On September 11, 2019 10:15 PM UTC

I am having trouble getting the dropdownedit type to work correctly for columns in a DataGrid.  I have tried using the code provided in the documentation, but I only see the standard Dropdownlist content which are the unique items for that column.

Below is what I have--

@{
    var editParams = new { @params = new { value = "Germany" } };
}
<ejs-grid id="grid" height="600" dataSource="@ViewBag.datasource" allowFiltering="true" dataBound="dataBound" enableVirtualization="true" allowExcelExport="true" toolbarClick="toolbarClick" toolbar="@(new List() { "ExcelExport" })"   >
    <e-grid-filterSettings type="Menu">e-grid-filterSettings>
    <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true">e-grid-editSettings>
    <e-grid-columns>
        <e-grid-column width="100" field="Id" isPrimaryKey="true" headerText="@Html.DisplayNameFor(model => model.Id)" >e-grid-column>
          ...
        <e-grid-column width="100" field="Message" headerText="@Html.DisplayNameFor(model => model.Message)" editType="dropdownedit" edit=editParams >e-grid-column>
      e-grid-columns>
ejs-grid>


This produces the following instead of just "Germany" from the editParams (image blurred)





Thavasianand Sankaranarayanan [Syncfusion]
Replied On September 12, 2019 11:19 AM UTC

Hi Michael, 

Greetings from Syncfusion support. 

From analyzing your query, we understand you like to use custom datasource in a dropdownlist.
We have already discussed about your requirement in our documentation. Please find the below documentation link for more information. 


If we understood anything wrongly please get back to us with brief explanation. 

Regards, 
Thavasianand S. 


Michael J Norman
Replied On September 12, 2019 01:45 PM UTC

Ok this works.  It is confusing as to why the provided example in the main documentation does not work, https://ej2.syncfusion.com/aspnetcore/documentation/grid/edit/#cell-edit-type-and-its-params, but that is a separate matter.

On a related note, if I include a column with command buttons, I am no longer able to edit the row, and see this error in the console--

Uncaught TypeError: Cannot read property 'startIndex' of undefined


Code is as follows--

List<object> commands = new List<object>();
    commands.Add(new { type = "Edit", buttonOption = new { iconCss = "e-icons e-edit", cssClass = "e-flat" } });
    commands.Add(new { type = "Delete", buttonOption = new { iconCss = "e-icons e-delete", cssClass = "e-flat" } });
    commands.Add(new { type = "Save", buttonOption = new { iconCss = "e-icons e-update", cssClass = "e-flat" } });
    commands.Add(new { type = "Cancel", buttonOption = new { iconCss = "e-icons e-cancel-icon", cssClass = "e-flat" } });

<e-grid-column headerText="Manage Records" width="120" commands=commands></e-grid-column

Thavasianand Sankaranarayanan [Syncfusion]
Replied On September 13, 2019 01:57 PM UTC

Hi Michael, 

Query#1: It is confusing as to why the provided example in the main documentation does not work. 
 
Based on the documentation we have prepared the sample it works fine in our end. Please find the below video link for more information.

Sample demo : https://www.syncfusion.com/downloads/support/forum/147474/ze/Commandcol875682802.zip 

Query#2: if I include a column with command buttons, I am no longer able to edit the row. 
 
We have prepared a sample with command columns. Please find the below code example and sample link for more information. 
 

@{ 
    List<object> commands = new List<object>(); 
    commands.Add(new { type = "Edit", text="Edit", buttonOption = new { iconCss = "e-icons e-edit", cssClass = "e-flat" } }); 
    commands.Add(new { type = "Delete", buttonOption = new { iconCss = "e-icons e-delete", cssClass = "e-flat" } }); 
    commands.Add(new { type = "Save", buttonOption = new { iconCss = "e-icons e-update", cssClass = "e-flat" } }); 
    commands.Add(new { type = "Cancel", buttonOption = new { iconCss = "e-icons e-cancel-icon", cssClass = "e-flat" } }); 
} 
 
 
<div id="ControlRegion"> 
    <ejs-grid id="Grid" dataSource="@ViewBag.DataSource" allowPaging="true" height="310"> 
        <e-grid-editSettings allowDeleting="true" allowEditing="true" mode="Normal"></e-grid-editSettings> 
        <e-grid-columns> 
            <e-grid-column field="OrderID" headerText="Order ID" isPrimaryKey="true" textAlign="Right" width="100"></e-grid-column> 
            <e-grid-column field="CustomerID" headerText="Customer ID" type="string" width="120"></e-grid-column> 
            <e-grid-column field="Freight" headerText="Freight" textAlign="Right" format="C2" editType="numericedit" width="120"></e-grid-column> 
            <e-grid-column field="ShipCountry" headerText="Ship Country" width="150" edit=editParams editType="dropdownedit"></e-grid-column> 
 
                <e-grid-column headerText="Manage Records" width="120" commands=commands> 
                </e-grid-column> 
</e-grid-columns> 
    </ejs-grid> 
    
</div> 


Regards, 
Thavasianand S. 


Michael J Norman
Replied On September 13, 2019 04:18 PM UTC

Thanks for the sample.  It works as you sent it, however if I change the grid to "enableVirtualization=true" instead of "allowPaging=true" the sample breaks, and Chrome console gives the below error when you attempt to edit a row--

"Uncaught TypeError: Cannot read property 'OrderID' of undefined"

Would you be able to update this sample to enable virtualization as well as how to persist the data back to the server?  I went through the samples, and this is the closest it looks to what I'm trying to achieve, https://ej2.syncfusion.com/aspnetcore/documentation/grid/how-to/perform-crud-operation-using-anti-forgery-token/, however I have not been able to make it work.  I think my problem is the path for the Controllers listed in the data-manager line since I never see a postback to the server.

<e-data-manager json="@ViewBag.data" adaptor="RemoteSaveAdaptor" insertUrl="/Home/Insert" updateUrl="/Home/Update" removeUrl="/Home/Delete"></e-data-manager>

Thavasianand Sankaranarayanan [Syncfusion]
Replied On September 16, 2019 10:24 AM UTC

Hi Michael , 

Sorry for the inconvenience. 

From analyzing your query ,You like to do crud actions in Virtualization feature but currently we don’t have support for editing and virtualization feature combination. We have added this feature request to our database. You can now track the current status of this feature request here page https://www.syncfusion.com/feedback/4981/provide-the-support-for-batch-editing-with-virtualization. At the planning stage for every release cycle, we review all open features and identify features for implementation based on specific parameters including product vision, technological feasibility, and customer interest. We will let you know when this feature is implemented.  
 
You can also communicate with us regarding the open features any time using our Feature Report page  

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.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon 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.Close Icon

Live Chat Icon For mobile
Live Chat Icon