Geek asks and answers

MVC dropdowns are related depending on the value of another dropdown

I am trying to write an MVC webpage with two dropdowns. The content of the second list depends on what is selected in the first.

There seems to be no definitive way to do this using the built-in MVC functions, so I will have to minimize it myself. However, I don’t know how to best get all the functionality I need ... which "will be the same as web forms" :)

I created dropdowns in the same way as this

However, I’m not sure how to do this so that if there is a “selected” element in the first list when it is first linked, it will go through the automatic linking of the second list when the page loads.

Edit: To be clear, I have the option to bind a filtered list to a second drop-down list. However, if my model contains a selection for the first drop-down list, the selection is set correctly, but the second drop-down list is not populated.

(Should I claim that I am new to MVC, and Javascript is like some kind of foreign language for me?)

Edit2: I thought about it a little more. Obviously, I am greatly influenced by the development time of web forms, and I am not quite “getting” MVC yet. I think that I actually have some things that I have to catch in my model (i.e. if I already have information to set two drop-down lists, then I have to somehow catch this in the controller and create predefined drop-down lists. create a method like "ondatabound" and call the call (which was my original intention) ... Now I need to figure out how to do this :)

+3
source share
3 answers

This is one of the best implementations I've found. The issue was also discussed here .

+2
source

:

  • ajax ddl ddl
  • 2- ddl ddl
  • ddl,

<script type="text/javascript">

    $(function(){
        $("form #ddl_1").change(function(){
            $.get({ // get request
                   url: "@Url.Action("MyController", "GetList"})" + "/" + $(this).val,
                   success: function(data){ // updating
                       $("form #ddl_2").html(data);
                   }
        })
    });

</script>

"GetList" "id", ( ) ( ) ddl2, :

<option value="1">First</option>
<option selected value="2">Second</option>
<option value="3">Third</option>
+1

See this blog post for cascading dropdowns in asp.net mvc with downloadable source code.

0
source

More articles:


All Articles