CellEdit in ejgrid

[Ganga]

how to edit a particular cell(not a single column edit) in ejgrid    
Sample code:(Dnt want a Single column edit)

                                    @(Html.EJ().Grid<Payment>("PaymentSch1")
        .Datasource((IEnumerable<ERP_WEB_MVC4.Models.Pay>)ViewData["Pay1"])
        .AllowScrolling(true)
      .EditSettings(edit => { edit.AllowAdding().AllowDeleting().AllowEditing().EditMode(EditMode.Normal); })
        .ScrollSettings(scroll => { scroll.Height(650).Width(630); })
        .AllowTextWrap()
        .AllowPaging()
        .Columns(col =>
        {
       
            col.Field("Per").HeaderText("%").Width(80).TextAlign(TextAlign.Center).Add();
            col.Field("Calc1").HeaderText("CALC1").Width(100).AllowEditing(false).TextAlign(TextAlign.Center).Add();
            col.Field("Calc2").HeaderText("CALC2").Width(100).AllowEditing(false).TextAlign(TextAlign.Center).Add();
            col.Field("Total").HeaderText("TOTAL").Width(100).AllowEditing(false).TextAlign(TextAlign.Center).Add();
            col.Field("SINO").HeaderText("SINO").Visible(false).Add();
        })
        )

[Alan Sangeeth S]

Hi Ganga,

Thanks for using Syncfusion products.

We suspect that that your requirement is to edit by cell (Batch Editing) and please refer the following online sample and UG documentation link that meets your requirement.

UG Document: http://help.syncfusion.com/ug/js/Documents/batchediting.htm
Online Sample: http://mvc.syncfusion.com/demos/web/grid/batchediting

If we misunderstood your requirement then please get back to us with more information about your requirement such as a screenshot depicting your requirement so that we could provide you a response as early as possible.

Also from your code snippets we found that isPrimaryKey property is not set to the primary key column which is essential for the Editing functionality in Grid. Please refer the following KB.
http://www.syncfusion.com/kb/2675/cant-edit-any-row-except-the-first-row-in-grid

Please let us know if you need any further assistance.

Regards,
Alan Sangeeth S

[Ganga]

celledit not trigger properly.. can u describe how to trigger onchange event while editing particular cell

[Alan Sangeeth S]

Hi Ganga,


Thanks for the update.


We are glad to let you know that we have achieved your requirement using “cellSave” Grid event in which when we change the values in a cell and then moving to next cell we have showed an alert box. Please refer the following code snippets.

@(Html.EJ().Grid<EJGrid.Models.EditableOrder>("Grid")
…

.ClientSideEvents(eve => eve.CellSave("cellSave"))

)

<script>

function cellSave(args) {

if (args.previousValue != args.value)

alert ("valueChanges")

}
</script>

Also please find below the list of events for Batch editing in Grid.

Event	Description
cellSave	Triggered when record cell save.
cellEdit	Triggered when record cell edit.
batchAdd	Triggered when record batch add.
batchDelete	Triggered when record batch delete.
beforeBatchAdd	Triggered before the batch add.
beforeBatchDelete	Triggered before the batch delete.
beforeBatchSave	Triggered before the batch save.

If you do not want to trigger event after navigating from the cell and you want to trigger event for the every immediate change in cell value we suggest you to use “EditTemplate” Grid feature by which we can bind event for the control in the cell. Please refer the following code snippets.

@(Html.EJ().Grid<EJGrid.Models.EditableOrder>("Grid")
…

.Columns(col =>

{

col.Field("Freight").HeaderText("Freight").EditTemplate(a => { a.Create("create").Read("read").Write("write"); }).TextAlign(TextAlign.Right).Width(80).Format("{0:C}").Add();

})

)

<script>

function create() {

return $("<input>");

}

function write(args) {

args.element.ejNumericTextbox({ width: "100%",change:"changeHandler", value: args.rowdata !== undefined ? args.rowdata["Freight"] : "" });

}

function read(args) {

return args.val();

}

function changeHandler(args) {

alert("Immediatechange")

}

</script>

For your convenience we have created a sample and the same can be downloaded from below link.
Sample: http://www.syncfusion.com/downloads/support/forum/119006/EJGrid1782047720.zip


Please refer the following API documentation link for further reference

http://help.syncfusion.com/UG/JS_CR/ejGrid.html#Events


If the above sample does not meet your requirement then please get back to us with more information, such as scenario describing when and why you want to trigger change event, so that we could provide you a response as early as possible.



Please let us know if you need any further assistance.
Regards,
Alan Sangeeth S