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.
Syncfusion Feedback

How to Obtain Edited Grid Cell Value In Javascript

Thread ID:

Created:

Updated:

Platform:

Replies:

121709 Jan 19,2016 12:50 AM UTC Jan 20,2016 06:25 AM UTC ASP.NET MVC 3
loading
Tags: Grid
Jeffrey Stone
Asked On January 19, 2016 12:50 AM UTC

I am using a grid in batch edit mode (that supports filtering and grouping) and I am trying to access the value of a boolean column in javascript. If the user modifies the value I still only see the original value.

Here is a portion of the grid:

@(Html.EJ().Grid("Grid")
.Datasource(ds => ds.URL(@Url.Action("BatchDataSource","Reallocate")).BatchURL(@Url.Action("BatchUpdate","Reallocate")).Adaptor(AdaptorType.UrlAdaptor))
.EditSettings(edit => { edit.AllowEditing().EditMode(EditMode.Batch); })
.AllowFiltering()
.AllowGrouping(true)
.ShowColumnChooser()
.Columns(col =>
{
col.Field(r => r.IncludeInReallocation).TextAlign(TextAlign.Center).EditType(EditingType.Boolean).Add();
}))

Here is how I am trying to access the "IncludeInReallocation" field:

var gridInstance = $("#Grid").ejGrid("instance");
var data = $("#Grid").ejGrid("getCurrentViewData");

for (var i = 0; i < data.length; i++) {
   // this next line appears to be returning the original value - and not the value as modified by the user
   if (data[i].IncludeInReallocation) {
     // do stuff
   }
}

What I am trying to do is to allow the user to apply an operation to selected/checked rows in the grid. There is logic in the controller which is pre-selecting rows that need to be acted on (on the web page - the user can still check/uncheck rows as desired).

Regards, Jeff

Gowthami V [Syncfusion]
Replied On January 19, 2016 10:46 AM UTC

Hi Jeffrey,

Thanks for using Syncfusion products.

From your query and code example, we can understood that you want to access the edited data before saving the corresponding data.

The currentViewData gets updated once the data saved. To access the edited data when “Batch” editing, then we can use the method “getBatchChanges”. 


Refer to the below screenshot,




Refer to the below code example,

@(Html.EJ().Grid("Grid")

.Datasource(ds => ds.URL(@Url.Action("BatchDataSource", "Reallocate")).BatchURL(@Url.Action("BatchUpdate", "Reallocate")).Adaptor(AdaptorType.UrlAdaptor))

.EditSettings(edit => { edit.AllowEditing().EditMode(EditMode.Batch); })

.AllowFiltering()

.AllowGrouping(true)

.ShowColumnChooser()

.Columns(col =>

{

    col.Field(r => r.IncludeInReallocation).TextAlign(TextAlign.Center).EditType(EditingType.Boolean).Add();

}))



<script type="text/javascript">

    var gridInstance = $("#Grid").ejGrid("instance");

    var data = $("#Grid").ejGrid("getBatchChanges")["changed"];

    for (var i = 0; i < data.length; i++) {

                if (data[i].IncludeInReallocation) {

            // do stuff

        }

    }
    </script>


Refer to the Help document for more clarification about getBatchChanges method,

http://help.syncfusion.com/js/api/ejgrid#methods:getbatchchanges

If we misunderstood your requirement, please provide below details,

1.       Share the controller code where you have preselected the rows.

2.       In which scenario/event you are using the above code example.

3.       Code example if you are using any AJAX post for calling the controller method.

4.       Full code example used for rendering Grid.

Provided details will help to analyze and provide a solution as early as possible.

Regards,


Gowthami V.


Jeffrey Stone
Replied On January 20, 2016 12:44 AM UTC

Thanks for the quick response. You all do a great job!

Your solution didn't quite get to what I was looking for.  I was able to accomplish this by using: gridInstance._bulkEditCellDetails._data;  This appears to give me access to the filtered rows and to the data that either was returned from the server or, if the user has entered data then it provides the data entered by the user.

var gridInstance = $("#Grid").ejGrid("instance");
// the following line appears to provide access to the data that has & has not been edited by the user
var data = gridInstance._bulkEditCellDetails._data;

var totalAmount = 0;
var count = 0;
for (var i = 0; i < data.length; i++) {
if (data[i].IncludeInReallocation) {
totalAmount += data[i].EquityAmount;
count++;
}
}

if (count > 0) {
var averageAmount = Math.trunc(totalAmount / count);
for (var i = 0; i < data.length; i++) {
if (data[i].IncludeInReallocation) {
gridInstance.setCellValue(i, "DesiredEquityAmount", averageAmount);
}
}
}

Does this look like a good way to get at the data I am looking for?

Regards, Jeff

Gowthami V [Syncfusion]
Replied On January 20, 2016 06:25 AM UTC

Hi Jeffrey,

From the query “access to the filtered rows”, we suspect that you need to access the filtered data with bulk edited details. As per your code example, we can access the filtered data in current page but can’t get the data from the other pages.

If the above scenario is your requirement, then the mentioned code example can be used.

Else please let us know, if the requirement is to access all the filtered data at a time.

Provide above details which will help to analyze the requirement and provide a solution response as early as possible.

Regards,

Gowthami V.




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.

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

;