This is a migrated thread and some comments may be shown as answers.

[Solved] Integrate Grid with Splitter (search and preview)

0 Answers 50 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Mark
Top achievements
Rank 1
Mark asked on 31 Mar 2011, 03:36 AM
Hi,

I am working on a project requiring integration between several Telerik ASP.NET MVC conponents, namely the Grid and the Splitter controls.

For this project, we have a search form, results grid and result preview and are looking to integrate these 3 areas together.
 
We are trying to utilise the splitter control to split the screen into a left search panel (collapsible), and on the right side have a search results grid, and below the grid have a preview/edit form of the item selected in the grid.

Then we need the search form on the left pane to provide the search criteria to the results grid on the top right pane, and finally when a row/item is selected in the grid we need to display a preview in bottom right pane.

Here is what I've got so far:

@{Html.Telerik().Splitter().Name("Splitter1")
      .HtmlAttributes(new { style = "height: 800px;" })
      .Orientation(SplitterOrientation.Horizontal).Panes(hPanes =>
      {
          hPanes.Add()
              .Size("200px")
              .Collapsible(true)
              .LoadContentFrom("Search_Form", "Home");
       
        hPanes.Add()
            .Size("800px")
            .Collapsible(true)
            .Content(Html.Telerik().Splitter().Name("Splitter2")
                .HtmlAttributes(new { style = "height: 100%; width: 100%; border: 0; overflow: hidden;" })
                .Orientation(SplitterOrientation.Vertical)
                .Panes(vPanes => {
                    vPanes.Add()
                        .Collapsible(true)
                        .LoadContentFrom("Results_Grid", "Home");
                    vPanes.Add()
                        .Collapsible(true)
                        .LoadContentFrom("Results_Preview", "Home");
                }).ToString());
      })
      .Render();
}  

What/how is the best way of integrating these components together?
   
Also as a secondary question - Does loading the various pane contents dynamically pose a problem? e.g. do I instead need to put the content from these partial views into the page/view containing the splitters?

Any help would be appreciated!

Cheers,
Mark 
Tags
General Discussions
Asked by
Mark
Top achievements
Rank 1
Share this question
or