RowDragDrop + Add New Record

[Brad]

Hi - I've been able to setup RadGrids which use either the row dragging functionality to reorder rows OR the batch edit command to allow for batch editing / inserting of data. However, I'm trying to combine the two in one grid now and I'm having an issue if I try to move a record which I've created.

<telerik:RadGrid ID="rg" runat="server" OnNeedDataSource="rg_NeedDataSource" OnRowDrop="rg_RowDrop"
    OnBatchEditCommand="rg_BatchEditCommand" Width="550px">
    <ClientSettings AllowRowsDragDrop="true">
        <Selecting AllowRowSelect="true" />
    </ClientSettings>
    <MasterTableView AutoGenerateColumns="False" DataKeyNames="ID" EditMode="Batch" CommandItemDisplay="Top">
        <BatchEditingSettings EditType="Row" />
        <Columns>
            <telerik:GridBoundColumn DataField="Name" HeaderText="Name" HeaderStyle-Width="100px" />
            <telerik:GridBoundColumn DataField="Value" HeaderText="Value" HeaderStyle-Width="50px" />
        </Columns>
    </MasterTableView>
</telerik:RadGrid>

 

protected void rg_NeedDataSource(object sender, EventArgs e)
{
    DataTable dt = new DataTable();
    dt.Columns.Add("ID");
    dt.Columns.Add("Name");
    dt.Columns.Add("Value");

    dt.Rows.Add(1, "Name 1", "Value 1");
    dt.Rows.Add(2, "Name 2", "Value 2");

    rg.DataSource = dt;
}

protected void rg_RowDrop(object sender, GridDragDropEventArgs e)
{
    // Update datasource
}

protected void rg_BatchEditCommand(object sender, GridBatchEditingEventArgs e)
{
    // Update datasource
}

 

The error occurs if the user creates a new row and then attempts to drag that row - I've attached a screenshot that shows the error as well as the steps necessary to produce it. The user can still drag existing rows without any issues, although this causes the new row to disappear and it does not appear to be accessible in the server-side RowDrop event (which is understandable, although still undesirable). My ideal solution would be a way to allow the user to add and edit rows, as well as being able to drag the rows to reorder them, all on the client-side without any server-side postbacks, before hitting a save button (either internal to the RadGrid or outside of it) which causes a single postback and allows all of the information necessary for each row (the data values as well as its row index) to be available on the server-side. If that is not possible, I could live with a single postback after each row is added or moved, but I'm not sure how to make the RadGrid cause a postback after an item is added.

Thanks.

[Konstantin Dikov]

Hello Brad,

Thank you for contacting us.

I understand your requirement, but RadGrid does not provide reordering functionality on its own, but only exposes the events for manually changing the order. Furthermore, the rendering after the manual reordering is performed on server-side and also, due to the fact the the new rows that you are adding on client-side are not saved, no such index will exist on server-side while the drop event fires. 

With all that in mind, integrating both functionalities at the same time is not possible and the only thing that I could suggest is to take a look at our Kendo UI Grid, which after some customization allows such integration:

• http://dojo.telerik.com/AsUDo

If any other questions arise, please feel free to contact us again.


Regards,
Konstantin Dikov
Telerik