Friday, October 14, 2011

Dynamic partial views by dropdown selected value in mvc


you can load needed partial when dropdown chages :
in view :
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <script src="../../Scripts/jquery-1.3.2.js" type="text/javascript"></script>
    <script type="text/javascript">
        function loadPartial() {
            var name = $("#selectPartial").val();
            alert(name);
            $("#partial").load('/Partial/LoadPartial/?name='+name);
        }
    </script>
    <title>Index</title>
</head>
<body>
<select id="selectPartial" onchange="loadPartial()">
    <option value="0">--select a partial view to load--</option>
    <option value="partial1">partial 1</option>
    <option value="partial2">partal 2</option>
    <option value="partial3">partial 3</option>
</select>
    <div id="partial">
    <div id="sd">
    </div>
    </div>
</body>
</html>



in controller
public class PartialController : Controller
    {
       
        public ActionResult Index()
        {
            return View();
        }
        public ActionResult LoadPartial(string name)
        {
            return PartialView(name);
        }

    }