Row select, expand row inline

[Christian]

Here´s what my goal is, when i hoover/select a row (client-side) i want the row to expand,  load and show detailed information
-i dont want the expand or + sign to be shown
-it has to collect information from the webservice on each call so i cant load all data to the mastertableview.

please see this site when you hoover a product name or select row, this is pretty much exactly what i want to accomplish.
http://www.prisjakt.nu/kategori.php?k=107
http://www.prisjakt.nu/produkt.php?e=2087097

1. Could an ajax call expand a nested grids template view under respective row to this specification?

2. could i use a ajax tooltip holding a usercontrol? if so, how do i make it show up under the selected row?

3. would i be better of using JSON and a selfmade JavaScript to alter the rows inline html and add a span/tablerow under the selected row?

Reason for leaning towards JSON is that ajax might cause to much traffic and due to very tricky sql calculations the results can take a few seconds, with JSON a partial result can be shown until its complete.

On the other hand, if there is a neat and easy way of doing this to a telerik standard using Ajax i might go this route as JSON and JavaScript could cause some browser incompability we all like to avoid taking our time.

Really appreciate any thoughts and guidelines on this

[Marin]

Hi,

 RadGrid has a rich client-side API which you can use to expand or collapse an item depending on your requirements. You can use the expandItem method of the MasterTableView as shown here.
RadGrid also has different hierarchy load modes. Most of them will perform a postback when a row is expanding. If the grid is ajaxified using RadAjaxManager it will perform an ajax request instead of regular postback. Have in mind that ajax request will still be slower and will take more server-side processing time than the pure client-side approach with JSON binding.
The grid also has a Client Hierarchy load mode, in this case all the data for the detail templates is loaded on initial load of the page (which can take more time than usual) - then the expand / collapse will happen entirely on the client-side without any ajax request or postback.
You can check out the different load modes of the grid on this online demo.
Note that by default the grid does not support client-side binding (or binding to a web-service from the client) with hierarchical structure.
RadToolTip is capable of loading user control via ajax request as shown in this demo but the positioning and the overall user experience with the tooltip maybe different from the nested view template of the grid.
The recommended ways that you can try are: first to design an ordinary hierarchy for the grid (with the default load mode which is ServerOnDemand), then ajaxify the control using a RadAjaxManager and then call the expandItem method on row hover from the client-side. Then you can see if the overall performance and user experience is acceptable in this case. Another option might be to set the HierarchLoadMode="Client" and see how it works in this case.
Modifying the rows HTML to show a table under the hovered row is highly customized approach and may require a lot of javascript code to accomplish, but you can give it a try if the above suggestions do not work in your case.

Regards,
Marin
Telerik

[Christian]

Thank you Marin, after some thought it looks like we will end up making a hierarchy expand client-side to make use of that template, this also enables us to use server side controls (in the template) if necessary in the future, and use JSON for our requirements inside that template so that we can use best of both worlds as JSON wouldent like inserting serverside controls.

Appreciate you clarifying that the standard hierarchy mode should work in our scenario.