How to render partial view in some specific div without using ajax in asp.net mvc 3?

Question

How to render partial view in some specific div without using ajax in asp.net mvc 3???

For example I have a model:

public class TestViewModel
{
    public string FullText
    {
        get
        {
            retrun "Full text";
        }
    }
    public string ShortText
    {
        get
        {
            return "Short text";
        }
    }
}

Main view:

@model TestViewModel
   ...      
    <div id="RenderHere">

    </div>
    @Html.ActionLink("Show short text");
    @Html.ActionLink("Show full text");
   ...

And tow partial views:

ShortTextParial

@model TestViewModel
@Html.LabelFor(m => m.ShortText);
@Model.ShortText;

and FullTextPartial

@model TestViewModel
@Html.LabelFor(m => m.FullText);
@Model.FullText;

How can I render, for example, ShortTextPartial in "RenderHere" div after presing "Show short text" actionlink WITHOUT using ajax??? I have already found such solutions, but they don't fit me.

P.S. I don't want to use Ajax because if Java script is disabled on client side the page will not work correctly.

You could cache the contents of the partial in client side memory and then display it on click. The razor engine is only available at compile time, not at runtime. So, ajax is the *only* way to interact with the server during runtime without refreshing the page. — Travis J, May 27 '12 at 23:51
You're fighting against the grain, why would you NOT want to use Ajax? You can use `@Ajax.BeginForm` instead of `@Html.BeginForm` and set the `div` to update as a parameter. Easy peasy done. — CD Smith, May 27 '12 at 23:53
I don't want to use Ajax because if Java script is disabled on client side the page will not work correctly. — Dmytro, May 28 '12 at 00:42
You could add a query string parameter to control which text you want displayed. This means you'd be reloading the **entire** page just for that little bit of text... — dotjoe, Jun 15 '12 at 21:26

Tohid · Accepted Answer · 2016-02-17T15:27:35.457

First of all I have to say I don't think your design is the best. Please notice that most of the logics, comparisons, and conditions should take place in your Models and Business Logic tier, rather than in Views and Controllers.

Anyway, If you don't want to use AJAX, you should either use URL parameters or Session States to pass data between pages. Having said that, I developed it by URL parameters.

(My development environment is VS2010 SP1, ASP.NET 4, MVC 3)

First we need to change TextViewModel like this:

public class TextViewModel
{
    public string FullText { get { return "Full text"; } }
    public string ShortText { get { return "Short text"; } }

    public string ViewMode { get; private set; }

    public TextViewModel(string viewMode)
    {
        if (!string.IsNullOrWhiteSpace(viewMode))
            this.ViewMode = viewMode.Trim().ToLower();
    }
}

Now a little tweak on Controller:

public class HomeController : Controller
{
    public ActionResult Index(string id)
    {
        Models.TextViewModel model = new Models.TextViewModel(id);
        return View(model);
    }
}

and finally our view:

@model MvcApplication1.Models.TextViewModel
@{
    ViewBag.Title = "Index";
}
<h2>
    Index</h2>
<div id="RenderHere">
    @if (Model.ViewMode == "short")
    {
        @Html.Partial("ShortTextParial", Model)
    }
    @if (Model.ViewMode == "full")
    {
        @Html.Partial("FullTextPartial", Model)
    }
</div>
@Html.ActionLink("Show short text", "Index", new { id = "short" })
@Html.ActionLink("Show full text", "Index", new { id = "full" })

The application works well in my computer. I've uploaded the code here if you need it: http://goo.gl/9v2Ny

Again I want to say you can come up with a better design which doesn't need any @if in the View or even in the Controller.

score 0 · Answer 2 · answered May 28 '12 at 00:21

If you really don't want to use ajax to show the more data, You can load both contents in seperate divs and hide the full view, When User clicks on the "Show More" link, Just show it.

Do you really want to do so ? Keep in mind that Not all the users will be clicking on your "Show more" link. Still you will be loading the content for the user and hiding it. Why you need to do so and increase the page size ? I would go with the ajax solution to bring the data "On Demand", if at all possible.

How to render partial view in some specific div without using ajax in asp.net mvc 3?

2 Answers2

Linked