如何在ASP.NET MVC和JQuery中添加额外的部分视图(取决于DropDownList选择)?

首先在下拉列表中添加一个CSS类选择器,现在我们称它为“myDropDown”。

使用类似的方法:

<script language=”javascript” type=”text/javascript” >

      function addtoDiv()
        {
        $(document).ready(function() {

        var myval=$(”#mydropdown”).val(); // get value of dropdown


        if ( myval == "somevalue") // check myval value
        {
            $("#ExtraInfo").html("add html code inside div here"); // add code based on         value
        }

        }}
  </script>

@Tony的方法是正确的,但您可能希望执行Ajax调用,而不是将renderpartial html直接放入“.html”(“在这里的div中添加html代码”)。这样用户就不会下载一堆他/她甚至看不到的HTML。

就像这样:

if ( myval == "someValue")
{
    $("#ExtraInfo").load("/dynamic-stuff/1")
}
else if ( myval == "someOtherValue")
{
    $("#ExtraInfo").load("/dynamic-stuff/2")
}

这还假定您设置了一个路由来处理类似“/dynamic stuff/2”的URL,并使用正确的部分视图进行响应。

是否需要动态添加字段?通过执行以下操作,可以使用jquery添加字段:

$(“”).attr(“id”,“test”).addClass(“formLabel”).appendto(“parentElement”); $(“”).attr(“id”,“testinput”).attr(“type”,“text”).appendto(“parentElement”);)

通过这种方式,您可以通过编程方式创建字段。

另外,您可以创建jquery局部视图。创建一个返回此部分视图实例的操作方法,并使用

$.get("/<controller>/<actiontoreturnpartialview>", function(data) {
   $("#ExtraInfo").html(data); 
});

这样做更容易,因为这样您就可以依赖服务器端逻辑来呈现UI,尽管我倾向于使用客户端方法。

或者,您可以创建自己的HTML助手来完成这一切,但这将是一项很大的工作。

Hth.