
given below
<telerik:GridTemplateColumn HeaderText ="Description" Visible="false" Display="false">
<ItemTemplate>
<asp:Label ID="lblDisplayOrder" runat="server"></asp:Label>
</ItemTemplate>
</telerik:GridTemplateColumn>
11 Answers, 1 is accepted
I am afraid this behavior is not supported out-of-the-box. Normally, when you reorder RadGrid rows, the control posts back in order to send information about the changes to the server, where you can manipulate the control's datasource. So arranging rows without communicating this to the datasource (no matter what is its type) doesn't make much sense.
One thing that you can do is use client-side binding, cancel the OnRowDropping client event handler (to prevent postback), manually make changes to the datasource on the client and rebind the RadGrid MasterTableView on the client (otherwise the rows will not be reordered).
http://demos.telerik.com/aspnet-ajax/grid/examples/client/livedata/defaultcs.aspx
http://demos.telerik.com/aspnet-ajax/grid/examples/client/databinding/defaultcs.aspx
Kind regards,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

Although the feature is not supported directly and it is a big mis out of control, but I think it would not be a very big deal to implement it using client side object model (telerik has a rick CSOB).
Can you quickly give some good example of this, I have to integrate it in my project.
The given example is good but it takes data from WebService all the time, what I want is just to take the data from existing datasource and change the datasource(table) order and rebind, I think that will solve the our problem as well as help many other people to integrate this great feature , I have been searching for this solution since last 1 week.
It would be great if you can create an example of this.
Regards,
Mohammad Imran Rizvi
I am afraid we do not have an example of the desired functionality. Please follow the guidelines in my previous message and try to implement it. If you stumble upon any particular difficulty, let us know.
All the best,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

Thanks for replying,
I have started working on the same, my plan is to write some code that will remove the existing row (draggedItems) , and insert it at dropped location (args._targetItemIndexHierarchical) .
I am able to get the RadGrid object and Index of Row at client side , but I haven't found any property using which
1) I can get the particular Row(Item) object which I am dragging
2) Insert Row at given Index.
I am using onRowDropping client side event to handle the drag and drop
Can you please let me know how we can
1) Get the particular Row(Item) object which I am dragging.
2) Insert it at particular index in RadGrid's MasterTableView's First DetailTableView.
3) How to rebind again at client side (or it is not required?)
Thanks
Imran Rizvi.
Here are some guidelines on your questions:
1) To get the client object(s) of specific row(s):
http://www.telerik.com/help/aspnet-ajax/onrowdragstarted.html
http://www.telerik.com/help/aspnet-ajax/onrowdropping.html
2) There is no use in inserting rows client-side somewhere in RadGrid. Instead, you should update the control's datasource (according to the information from the RowDropping event) and
3) Rebind the RadGrid by using the rebind() method of the MasterTableView object.
Please note that we do not support client-side binding with hierarchy.
Kind regards,
Dimo
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

But still the "OnRowDragStarted" on ClientEvents makes a server hit (causes postback). The ultimate aim is to drag and drop thereby reordering the rows within the radgrid without page refresh. Any way to avoid this postback and achieving the same functionality?
Regards,
Saranya

For Telelrik Rad Grid - Can’t see the drop and drag functionality. Ex. When dropping a column for grouping - cannot see the column while dragging. On the Telerik site – it shows the column header while dragging.
Code-
<telerik:RadGrid ID="grdLog" runat="server" AutoGenerateColumns="False" OnItemCommand="grdLog_ItemCommand" OnNeedDataSource="grdLog_NeedDataSource" ShowGroupPanel="True" AllowPaging="True" AllowSorting="true" Width="100%">
<ExportSettings HideStructureColumns="true" ExportOnlyData="true" OpenInNewWindow="true" IgnorePaging="true" />
<MasterTableView CommandItemDisplay="Top" AllowFilteringByColumn="true">
<PagerStyle AlwaysVisible="true"/>
<CommandItemTemplate>
<table>
<tr>
<td>
<asp:Button ID="btnRefresh" runat="server" CommandName="Rebind" CssClass="rgRefresh" ToolTip="Refresh content." />
</td>
<td>
<asp:Button ID="ExportToExcelButton" runat="server" CommandName="ExportToExcel" CssClass="rgExpXLS" ToolTip="Export to Excel." />
</td>
<td>
<asp:Button ID="ExportToWordButton" runat="server" CommandName="ExportToWord" CssClass="rgExpDOC" ToolTip="Export to Work." />
</td>
<td>
<asp:Button ID="ExportToPdfButton" runat="server" CommandName="ExportToPdf" CssClass="rgExpPDF" ToolTip="Export to PDF." />
</td>
<td>
<asp:Button ID="ExportToCsvButton" runat="server" CommandName="ExportToCsv" CssClass="rgExpCSV" ToolTip="Export To CSV." />
</td>
<td>
<asp:ImageButton ID="imgHideUnhide" runat="server" CommandName="HideUnhide" ImageUrl="~//images/SearchCrawler_16px.gif" OnClientClick="hideFilterItem()" ToolTip="Hide Or Unhide Filter." />
</td>
</tr>
</table>
</CommandItemTemplate>
<CommandItemSettings ShowExportToWordButton="true" ShowExportToExcelButton="true" ShowExportToPdfButton="true"
ShowExportToCsvButton="true" ShowAddNewRecordButton="false" ShowRefreshButton="false"/>
<Columns>
<telerik:GridBoundColumn DataField="Username" HeaderText="User Name" SortExpression="Username" ></telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="Name" HeaderText="File/Folder" SortExpression="Name" ></telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="F_Status" HeaderText="Status" SortExpression="F_Status" ></telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="LogDate" HeaderText="Log Date" SortExpression="LogDate" ></telerik:GridBoundColumn>
</Columns>
</MasterTableView>
<ClientSettings AllowDragToGroup="True" >
<Selecting AllowRowSelect="True"></Selecting>
</ClientSettings>
<GroupingSettings ShowUnGroupButton="true" />
</telerik:RadGrid>

One thing that you can do is use client-side binding, cancel the OnRowDropping client event handler (to prevent postback), manually make changes to the datasource on the client and rebind the RadGrid MasterTableView on the client (otherwise the rows will not be reordered).
http://demos.telerik.com/aspnet-ajax/grid/examples/client/livedata/defaultcs.aspx
http://demos.telerik.com/aspnet-ajax/grid/examples/client/databinding/defaultcs.aspx
Kind regards,
Dimo
the Telerik team"
This is a completely unacceptable response. I cannot believe that a grid so feature rich would not offer the option to prevent a postback on the client-side onRowDropped event. I read that a possible approach might be to cancel the operation in the onRowDropping event but when I set args.set_cancel(true), it prevents the entire drop operation from firing. I need a way to drag and drop rows that will allow me to handle the onRowDropped event on the client without posting back to the server. What if you wanted to recalculate figures on the client and defer saving the information until the user clicks the Save button? Any help is greatly appreciated.
The OnRowDropped event will internally fire a command that is first handled on the client and later a postback is triggered. That said you can subscribe to the client-side OnCommand event and cancel the postback:
function
onGridCommand(sender, args) {
if
(args.get_commandName() ===
"RowDropped"
) {
args.set_cancel(
true
);
}
}
Now temporarily swapping the rows is more tricky. RadGrid is a databound control and being such it will display the records from it's data source in the same order. To change the order you will have to apply the changes in the data source as well. If avoiding a postback is a requirement then the only possible solution is using client-side data-binding. Note that in this case you will have to manually make the appropriate changes to the data source and rebind the grid.
Regards,
Angel Petrov
Telerik

<script type="text/javascript">
//... Control key and mouse click toggles row selection.
$("#<%= GridView1.ClientID %> tbody").on('click', 'tr', function (e) {
if (e.ctrlKey || e.metaKey) {
$(this).toggleClass("selected");
} else {
$(this).addClass("selected").siblings().removeClass('selected');
}
}).sortable({
axis: 'y', //... Just row movement.
connectWith: "#<%= GridView1.ClientID %> tbody",
containment: 'parent', //... Drag only within parent.
cursor: 'move', //...Move cursor.
delay: 150, //... Needed to prevent accidental drag when trying to select.
items: 'tr:not(Spud)', //... Not spud rows.
revert: 0,
helper: function (e, item) {
var helper = $('<tr/>');
if (!item.hasClass('selected')) {
item.addClass('selected').siblings().removeClass('selected');
}
var elements = item.parent().children('.selected').clone();
item.data('multidrag', elements).siblings('.selected').remove();
return helper.append(elements);
},
stop: function (e, info) {
info.item.after(info.item.data('multidrag')).remove();
$('.selected').each(function () {
alert($(this).find('.Rig').val());
});
}
});
</script>

Hi EveryOne,
Can u Guys Pzz Help me with Rad Grid Row Drag and Drop so that i can reorder