Creating a fully ajax based website with ASP.NET MVC

Question

What I'm planning is creating a website that is based fully ajax requests. But there are some questions in my mind,

1- Should I use a javascript routing engine, library ext.? Do I really need it? Because the website I'm working on is very large and will surely grow up.

2- I will just load every page content via ajax, but I won't use JSON, I'm planning to use PartialViews is that OK?

3-

  <script type="text/javascript">
       $("a.ajax").click(function() {
           $(".placeholder").load(this.href);
           return false;
       });

   </script>
   <a class="ajax" href="/Home/Products/2">Products</a>
   <div class="placeholder"></div>

This is the simple code of my process, the problem is here history, when user wants get back, it will fail. How can I achieve this problem?

Darin Dimitrov · Accepted Answer · 2014-01-25 08:42:22Z

3

1- Should I use a javascript routing engine, library ext.? Do I really need it? Because the website I'm working on is very large and will surely grow up.

If you have lots of logic on the client you might consider using some MVVM javascript framework. KnockoutJS and AngularJS are some popular choices.

2- I will just load every page content via ajax, but I won't use JSON, I'm planning to use PartialViews is that OK?

You could use the HTML5 History API which would allow you to add entries to the browser history everytime you make an AJAX request.

Here's an example:

$("a.ajax").click(function() {
    var href = this.href;
    var title = $(this).text();
    $(".placeholder").load(href, function() {
        // Add an entry in the browser history
        history.pushState(null, title, href);
    });
    return false;
});

answered Jan 25, 2014 at 8:42

Darin Dimitrov

1.0m276 gold badges3.3k silver badges3k bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Okan Kocyigit Over a year ago

Ok, nice point. But I handle a.ajax click handler and I'm loading content via click. So what will happen if user wants to get back. How will handle it and load history page content?

Darin Dimitrov Over a year ago

Simply subscribe to the onpopstate event which will be triggered when the browser loads an entry from the history and then reconstruct the page using the necessary AJAX calls to your server.

Alexander Karpinskiy · Accepted Answer · 2014-01-25 07:39:21Z

0

Try to look on angularjs. AngularJs + asp.net web api will be the good approach

answered Jan 25, 2014 at 7:39

Alexander Karpinskiy

415 bronze badges

Comments

elia07 · Accepted Answer · 2014-01-25 08:13:12Z

0

answer q1 : it is better to use some mvvm frameworks like angular.js but also you can handle everything yourself , ofcourse if you want to handle such things you must code much more ! answer q2: it is ok ,simply call an action method via ajax call and in action method render a partialview and in your success function update anywhere you want , I am using this method too :)

answered Jan 25, 2014 at 8:13

elia07

3222 silver badges7 bronze badges

Collectives™ on Stack Overflow

Creating a fully ajax based website with ASP.NET MVC

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related