IEnumerable <int>数据集从控制器传递到VIEW,并根据viewpage上的值显示或隐藏div部分

时间:2015-10-21 10:56:56

标签: javascript c# asp.net-mvc asp.net-mvc-3 razor

我有跟随控制器

        [HttpGet]
        [ValidateInput(false)]     
        public ActionResult Create_Template(IEnumerable<ProductsPropertiesVM> model)
        {
            // new you have access to all the ID's of the selected items, for example
            IEnumerable<int> selectedIDs = model.Where(x => x.IsChecked).Select(x => x.Property_ID);

            return View(selectedIDs);
        }

我希望绑定IEnumerable<int> selectedIDs个数据值来查看

一旦我在调试模式下运行它,通常那些selectedID就像这样

enter image description here

所以我想首先将那些IEnumerable数据集传递给视图,然后根据viewpage上的值显示或隐藏div部分

如果我能够将数据绑定到视图,我已经安排显示或隐藏下面的div部分(感谢您的建议)

 @{
        ViewBag.Title = "Create Templat";
    }
    <!DOCTYPE html>
    <html>
    <head>
        <title>Create a Templat</title>
    </head>
    <body>

        <div id="header"> .... </div>

        <div id="nav"> .... </div>

        <div id="section"> .... </div>

        <div id="footer"> .... </div>


    </body>
    </html>

    @section Scripts {
        @Scripts.Render("~/bundles/jqueryval")
        @Scripts.Render("~/bundles/jqueryui")

    <script type="text/javascript">


            $(document).ready(function () {

                //using for loop read the array values index 0  to end:

                for(i=0;i<array.length();i++){

                if(array has value 1) $("#header").show()
                else $(#header").hide();

                if(array has value 2) $("#nav").show()
                else $("#nav").hide();

                if(array has value 3) $("#section").show()
                else $("#section").hide();

                .........

                }
});   

    </script> 
    }

所以我正在寻找做这件事的好方法

1 个答案:

答案 0 :(得分:1)

在您的视图中,您可以将模型定义为IEnumerable<int>,并将其用于模板,如下所示:

@model IEnumerable<int>
@{
    ViewBag.Title = "Create Templat";
}
<!DOCTYPE html>
<html>
<head>
    <title>Create a Templat</title>
</head>
<body>

    @if (Model.Contains(1))
    {
        <div id="header"> 1.... </div>
    }
    @if (Model.Contains(2))
    {
        <div id="nav"> 2.... </div>
    }
    @*and so on ...*@
    <div id="section"> .... </div>

    <div id="footer"> .... </div>

</body>
</html>

无需在客户端做任何事情。