Syntax for controller methods for row drag & drop

[R Brian Lindahl]

I'm converting a grid from mvc5 to core, and it uses row drag & drop. I know I'll need to set allow-row-drag-and-drop="true", and somehow hook up the row drop handler, but I can't find any docs for the controller-side syntax. Do you have an example?

[Saravanan Arunachalam]

Hi Brian, 

We have analyzed your query and we suggest you to hook the row drop handler by using “rowDropSettings->rowDropMapper” which is funtioning similar to the MVC Grid’s Row drag and drop feature. Please refer to the below code example. 

<ej-grid id="FlatGrid" datasource="ViewBag.datasource" allow-paging="true" allow-row-drag-and-drop="true">@*enable drag and drop feature*@ 

         

        @*row-drop-mappper : used to mapping server side action when rows are droped(routing path)*@ 

        @*drop-target-id : mentioned the id of destination grid*@ 

       <e-row-drop-settings row-drop-mappper="RowDropHandler" drop-target-id="#DestGrid"></e-row-drop-settings> 

        . . . 

    </ej-grid> 

    <ej-grid id="DestGrid" datasource="ViewBag.datasource2" allow-paging="true" allow-row-drag-and-drop="true"> 

        <e-row-drop-settings row-drop-mappper="RowDropHandler" drop-target-id="#FlatGrid"></e-row-drop-settings> 

     . . .         

    </ej-grid> 

 

[Controller] 

 

public ActionResult RowDropHandler(List<EditableOrder> added, List<EditableOrder> deleted) 

        { 

            //To do here 

        } 

 

We are currently preparing the documentation for Asp.net core platform and it will refresh online on or before Volume 1, 2017 release which is expected to rolled out at the mid of February 2017. 

 Regards, 

Saravanan A. 

[R Brian Lindahl]

I just tried this, with the new .20 service pack. I get an error message

"The <e-row-drop-settings> tag is not allowed by parent <ej-grid> tag helper. Only child tags with name(s) 'e-columns, ej-grid, e-datamanager, e-page-settings, e-context-menu-settings, e-toolbar-settings, e-edit-settings, e-filter-settings, e-scroll-settings, e-search-settings, e-selection-settings, e-sort-settings, e-stacked-header-rows, e-summary-rows, e-text-wrap-settings' are allowed. "

I did notice that there's a "row-drop-settings" attribute showing in intellisense on the <ej-grid> itself.

This one's going to be a show-stopper - if I can't get this resolved, I'll have to go back to MVC.

[Saravanan Arunachalam]

Hi Brian, 

We regret for the inconvenience. 

The reported issue “RowDropSettings api is not in Core tag helper” has been reproduced at our end. So, we have considered this as the defect and a support incident has been created under your account to track the status of this requirement. Please log on to our support website to check for further updates.  

https://www.syncfusion.com/account/login?ReturnUrl=/support/directtrac/incidents  

And also we have resolved the issue using a workaround. In the workaround, we have achieved your requirement using “load” event of Grid and we have set the “rowDropSettings” property in the Grid model. Please refer to the following code example. 

<ej-grid id="FlatGrid" datasource="ViewBag.datasource" allow-paging="true" allow-row-drag-and-drop="true" load="onLoad"> 

   . . . 

</ej-grid> 

<ej-grid id="FlatGrid" datasource="ViewBag.datasource" allow-paging="true" load="onLoad" allow-row-drag-and-drop="true"> 

   . . .     

</ej-grid> 

[JS] 

<script type="text/javascript"> 

    function onLoad() { 

        var id = this._id == "FlatGrid" ? "#DestGrid" : "#FlatGrid" 

        this.model.rowDropSettings = { dropTargetID: id, rowDropMappper: "RowDropHandler" } 

    }       

</script> 

 

Regards, 

Saravanan A.