1. Home
  2. Forum
  3. ASP.NET Core - EJ 2
  4. How to pass selected row to controller ?

How to pass selected row to controller ?

Hi,

I'm trying to send rowdata model to controller. But everytime controller edit model parameters comes with null values. What am i missing ?

Bests,
Tümer

  public IActionResult Edit(PackageDto package)
        {            
            return PartialView("EditPartial",package);
        }


    <div class="kt-portlet__body">
        <ejs-grid id="Grid" dataSource="ViewBag.datasource" locale="tr" actionComplete="actionComplete" toolbar="@(new List<string>() {"Edit", "Delete"})" allowPaging="true">
            <e-grid-editSettings allowDeleting="true" allowEditing="true" mode="Dialog" template='#dialogtemplate'></e-grid-editSettings>
            <e-grid-columns>
                <e-grid-column field="Id" headerText="Paket No" textAlign="Right" width="120"></e-grid-column>
                <e-grid-column field="Name" headerText="Adı" width="150"></e-grid-column>
                <e-grid-column field="Price" headerText="Ücreti" format="C2" width="130" textAlign="Right"></e-grid-column>
                <e-grid-column field="Duration" headerText="Süresi" width="120"></e-grid-column>
                <e-grid-column field="Description" headerText="Açıklama" width="130" textAlign="Right"></e-grid-column>
                <e-grid-column field="CreatedAt" headerText="Tarih" width="130" format="dd/MM/yyyy" textAlign="Right"></e-grid-column>
            </e-grid-columns>
        </ejs-grid>
    </div>

 function actionComplete(args) {
        
        if (args.requestType === 'beginEdit') {
                let spinner = ej.popups.createSpinner({ target: args.dialog.element });
                ej.popups.showSpinner(args.dialog.element);
                if (args.requestType === 'beginEdit') {
                    var ajax = new ej.base.Ajax({
                        url: "@Url.Action("Edit", "Package")", //render the partial view
                        type: "POST",
                        contentType: "application/json",
                        data: JSON.stringify({ package : args.rowData })
                    });
                    ajax.send().then(function (data) {
                        appendElement(data, args.form); //Render the edit form with selected record
                        args.form.elements.namedItem('Id').focus();
                        ej.popups.hideSpinner(args.dialog.element);
                    }).catch(function (xhr) {
                        console.log(xhr);
                        ej.popups.hideSpinner(args.dialog.element);
                    });
                }
            }
        }

1 Reply
DR Dhivya Rajendran Syncfusion Team February 24, 2020 07:04 AM UTC

Hi Tümer, 
 
Greetings from Syncfusion. 
 
Query: How to pass selected row to controller ? 
 
We have validated your query and you want to pass the edited rowData to the controller side in actionBegin event. Here, we have passed the rowData of the edited record, please refer the below code snippets and sample for your reference. 
 
[code snippets] 
 
<ejs-grid id="Grid" dataSource="@ViewBag.DataSource" allowPaging="true" actionBegin="actionBegin" actionFailure="actionFailure" toolbar="@(new List<string>() {"Add", "Edit", "Update", "Delete" })" actionComplete="actionComplete"> 
    <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true" mode="Dialog" template='#dialogtemplate'></e-grid-editSettings> 
    <e-grid-columns> 
       . . . 
</ejs-grid> 
 
<script id='dialogtemplate' type="text/x-template"> 
    <div id="dialogTemp"> 
    </div> 
</script> 
 
<script type="text/javascript"> 
 
    . . . 
 
    function actionComplete(args) { 
         if (args.requestType === 'beginEdit' || args.requestType === 'add') { 
                let spinner = ej.popups.createSpinner({ target: args.dialog.element }); 
                ej.popups.showSpinner(args.dialog.element); 
                if (args.requestType === 'beginEdit') { 
                    var ajax = new ej.base.Ajax({ 
                        url: "@Url.Action("Editpartial", "Home")", //render the partial view 
                        type: "POST", 
                        contentType: "application/json", 
                        data: JSON.stringify({ value: args.rowData }) 
                    }); 
                    ajax.send().then(function (data) { 
                        appendElement(data, args.form); //Render the edit form with selected record 
                        args.form.elements.namedItem('CustomerID').focus(); 
                        ej.popups.hideSpinner(args.dialog.element); 
                    }).catch(function (xhr) { 
                        console.log(xhr); 
                        ej.popups.hideSpinner(args.dialog.element); 
                    }); 
                } 
                if (args.requestType === 'add') { 
                    . . . 
                } 
            } 
    } 
 
    function appendElement(elementString, form) { 
        . . . 
    } 
</script> 
[Controller]
public IActionResult EditPartial([FromBody] CRUDModel<Orders> value)    //ensure to add [FromBody] and CRUDModel class 
        { 
            ViewBag.datasource = order; 
            return PartialView("_DialogEditPartial", value.Value); 
        } 
 
        public IActionResult AddPartial([FromBody] CRUDModel<Orders> value) 
        { 
            ViewBag.datasource = order; 
            return PartialView("_DialogAddPartial"); 
        } 
 
[screenshot] 
 
 
 
 
Please get back to us if you need further assistance. 
 
Regards, 
R.Dhivya 


Loader.
Up arrow icon