Partial views inside the view

(ASP.NET MVC)


Hi,
In this article i render the partial views inside the view using partial statement.

View:-
@{
    ViewBag.Title = "Index";
}

<h2>@ViewBag.message</h2>

@model ASP.NETMVCFORUMS.Models.TheaterModel

 
    @Html.Partial("Tickets", Model)

    @Html.Partial("MovieDetails",Model)
<br />
<br />

    <input type="button" id="btn_Theater" value="Theatre Details" />
   <script type="text/javascript">
    $(function () {

        $('#btn_Theater').click(function () {

            //alert($("#Tickets_NoOfTickets").val());
         
          var  $form = $(this).parents('form:first');

            $.ajax({
                url: '/PartialViews/TheaterDetails',
                type: 'post',
                contentType: 'application/json',
                data: JSON.stringify({ 'strNoofTickets': $("#Tickets_NoOfTickets").val(), 'MovieTitle': $("#Movie_Title").val() }),
                //data: { strNoofTickets: $("#Tickets_NoOfTickets").val() },
                success: function (result) {
                    alert('done');
                }
            });

            return false;
        });
    });
</script>
  
Tickets Partial View:-
@model ASP.NETMVCFORUMS.Models.TheaterModel


 <br />
<b>No Of Tickets To Book</b>  @Html.TextBoxFor(m => m.Tickets.NoOfTickets)
@Html.HiddenFor(m => m.Tickets.NoOfTickets)
<div>@Html.ValidationMessageFor(m => m.Tickets.NoOfTickets)</div>
<br />
<br />
<input type="button" value="Book Tickets" id="btn_booktickets" />


<script type="text/javascript">
    $(function () {

        $('#btn_booktickets').click(function () {

            //alert($("#Tickets_NoOfTickets").val());
         
          var  $form = $(this).parents('form:first');

            $.ajax({
                url: '/PartialViews/Nooftickets',
                type: 'post',
                contentType: 'application/json',
                data: JSON.stringify({ 'strNoofTickets': $("#Tickets_NoOfTickets").val() }),
                //data: { strNoofTickets: $("#Tickets_NoOfTickets").val() },
                success: function (result) {
                    alert('done');
                }
            });

            return false;
        });
    });
</script>

MovieDetails Partial View:-
@model ASP.NETMVCFORUMS.Models.TheaterModel


<br /><b>The movie name is</b> @Html.DisplayFor(m => m.Movie.Title)
@Html.HiddenFor(m => m.Movie.Title)
<br /><b>Price</b> @Html.TextBoxFor(m => m.Movie.Price)
@Html.HiddenFor(m => m.Movie.Price)
<br />
<br />
<input type="button" value="Movie Details" id="btn_moviedetails" />

<script type="text/javascript">
    $(function () {

        $('#btn_moviedetails').click(function () {

           
         
            $.ajax({
                url: '/PartialViews/MovieDetails',
                type: 'post',
                contentType: 'application/json',
                data: JSON.stringify({ 'MovieTitle': $("#Movie_Title").val() }),
                success: function (result) {
                    alert('done');
                }
            });

            return false;
        });
    });
</script>

Controller Action Methods:-

        [HttpPost]
        public ActionResult Index(TheaterModel theater)
        {
            if (ModelState.IsValid)
            {
                @ViewBag.message = "Thank you for purchasing the ticket";
                return View();
            }
            else
            {
                return View(theater);
            }
        }

        [HttpPost]
        public void Nooftickets(string strNoofTickets)
        {
            string str = strNoofTickets;
        }

        [HttpPost]
        public void MovieDetails(string MovieTitle)
        {
            string str = MovieTitle;
        }

        [HttpPost]
        public void TheaterDetails(string strNoofTickets,string MovieTitle)
        {
            string str1 = strNoofTickets;
            string str2 = MovieTitle;
        }

Image

Ratings


Average Rating: 0.00 by 0 users
Giri Prasad
7/2/2013
7/2/2013
Download PDF

Comments