0

I'm creating an MVC app in C# that accesses data in a sql database.

I have a table that gives a parent child relationship.

ID  Name  ParentID
1   A     NULL
2   B     1
3   C     2
4   D     1
5   E     4
6   F     NULL

The user is able to add more items to the table in other places in my app. I need to create a cascading dropdown starting at the root value(s) and populating further dropdowns with the next level of children. In addition next to each dropdown, I need to generate a button so that no matter how far into the dropdown tree the user goes, they can click on a button by any of the dropdowns and see information based on the selection of that particular dropdown.

Most of this is fairly simple to implement. My difficulty is how to dynamically generate an unknown number of dropdowns. I can create several and keep them hidden until needed, but there could always be more than I prepared for.

Rather than creating several dropdowns in my view and then hiding them, how do I dynamically create new dropdowns as needed?

NerdyFool
  • 531
  • 1
  • 7
  • 14
  • In the change event of the first dropdown, call a method that returns a partial view of the new dropdown and add it to the DOM. Repeat the process for that dropdown (if there are no child elements, dont return anything). –  Oct 09 '14 at 00:34
  • I thought of that, however, I'm not very familiar with partial views. Do you know of a good resource that could point me in the right direction for this kind of problem? – NerdyFool Oct 09 '14 at 00:39
  • I'm sure if you google it you will find plenty of examples, but I think you UI approach is wrong (and you will have problems if your posting back anything). Why not just render a hierachial treeview with each item being a link to the items details (either redirect to another page or use AJAX to display the details on the current page). –  Oct 09 '14 at 00:47
  • These links [here](http://stackoverflow.com/questions/1570127/render-partial-view-using-jquery-in-asp-net-mvc) and [here](http://chsakell.com/2013/09/25/master-detail-dropdown-lists-and-partial-views-with-jquery-ajax-in-mvc/) might help you get started –  Oct 09 '14 at 01:13
  • I'm curious to know what data you have to begin with. Are you passing the entire result set of this table to your view? – 76484 Oct 09 '14 at 01:30
  • This table is basically just a list of names of other tables that are related as parent/child. When a table is chosen through the dropdowns, the corresponding button will then display the chosen table. – NerdyFool Oct 09 '14 at 16:01
  • @StephenMuecke I've gone through the links you sent. Thanks. I'm curious though, if I set each of these dropdowns to a partial view, can that partial view have another partial view inside that is itself? Kind of a recursive thing. If so, how would each of the dropdowns and buttons be uniquely identified so that I could access them? – NerdyFool Oct 09 '14 at 16:25
  • I would not try and nest the partials. In the change event, pass the `parentID` to a method that gets the child items and return a partial view that contains a dropdown for those items. But as I indicated above I think your UI approach is wrong and I can see lots of issues. –  Oct 10 '14 at 02:29
  • Dynamically create new dropdowns as needed is good choice. I'm curious to know max number of levels of the hierarchy. – Koti Panga Oct 16 '14 at 05:46
  • @VenkataPanga The current maximum number of levels is 3. However, the user can add more tables to the list making theoretically an infinite number of levels. I was hoping for a dynamic system so that I wouldn't need to put a hard cap on this limit. – NerdyFool Oct 16 '14 at 16:12

0 Answers0