URL Change without loading whole page in mvc3 - asp.net-mvc-3

I am working on classified ads project in asp.net mvc3. I am facing problem in filter search page I want to change the URL without loading the whole page like Facebook or Linkedin before change:
http://localhost:4847/Category/Clothing/
after change when user remove category:
http://localhost:4847/Category/
And when user select category it should be change to append category as I show on top.
I am using ajax for filter search

You can make use of the Html5 History API
Anyway this is an Html5 feature and not all browsers may support it. In this case I would suggest directly using a plugin that degrades to hash changes if not supported, like History.js

This is fundamentally the same question as how to fix the browser history back-forward buttons. Checkout What is the best back button jQuery plugin?, it really could help you alot!

Related

How to make the Wordpress admin-bar work with AJAX loading

I'm working on a website that uses html5's push- and popstate in combination with ajax-calls to create a website that dynamically loads in Wordpress posts and pages, without causing a page refresh.
I've got that working fine, but I would love it if the black Wordpress toolbar/adminbar that shows at the top of the site when you're logged in as an admin, also reflected the change of content. Is there any way at all to make this happen? So that when I go from a post to page, for example, the "edit" link in the admin bar updates.
I don't think it's as easy as I hope it is, and if it can't be worked out I think I'll just disable the adminbar on the front-end. But it could be that I'm missing something.
Thanks in advance!
I'm working on this myself. I'm gonna build an ajax action and jquery function to do this. I will post here when it's done. For NOW i've instructed my users to just refresh to get the edit link. if you're using HTML5 history then you're on the permalink you want anyways. refresh and let the server regenerate the bar. not perfect but not terrible.
another option is to put edit post links in your template.

How to make userprofile viewing-editing in django similar to the facebook way?

I'm making a site in django which has profiles for users and companies with text fields, photos, choices, etc., and I want them to look the same while viewing or editing them (in case of the owner of the profile). Basically the user must click somewhere and all the information becomes editable, without having to go into other "profile editing" page.
The only way of doing this that I can think of is by making to different pages, one for only "viewing" the data, and other for editing it, and try to make them look the same anyhow..
I wonder, if there is an elegant and simple way of integrating this two functionalities in django?
Thanks.
You're talking about manipulating the DOM without page loads. You're going to use AJAX to retrieve your form. I would recommend using Tastypie to create REST endpoints. Then you'll need to do AJAX calls to get your form. I would recommend using jQuery.
If you would prefer something simplier. You could always user a hidden form field and then manipulate the DOM with jQuery.

Ajax generated content, crawling and black listing

My website uses ajax.
I've got a user list page which list users in an ajax table (with paging and more information stuff...).
The url of this page is :
/user-list
User list is created by ajax. When the user click on one user, he is redirected to a page which url is : /member/memberName
So we can see here that ajax is used to generate content and not to manage navigation (with the # character).
I want to detect bot to index all pages.
So, in ajax I want to display an ajax table with paging and cool ajax effetcs (more info...) and when I detect a bot I want to display all users (without paging) with a link to the member page like this :
JohnBob...
Do you think I can be black listed with this technique ? If you think so, could you please provide an alternative solution by keeping these clean urls and without redeveloping the user-list (without ajax) ?
Google support a specification to make AJAX crawlable:
http://code.google.com/web/ajaxcrawling/docs/specification.html
I did an experiment and it works:
http://seo-website-designer.com/SEO-Ajax-Google-Solution
As this is a Google specification, you won't get penalised (unless you abuse it).
Saying that, only Google support it at the moment (AFAIK).
Also, I believe following the concept of Progressive Enhancement is a better approach. That is, create a working html website then make the JavaScript enhance it
Maybe use the urls with an onclick to trigger your AJAX scripting? Like
Some URL
I don't think Google would punish you for this, you primarily use JScript, but you do provide a fall back for their bot, so your site doesn't get any less accessible.
EDIT
Ok, I misunderstood. Then my guess would be you basically have two options:
1. Write a different part of your site where bots end up, or,
2. Rewrite your current site to for example always give a 'full' page, with an option to only get, say, the content div. Then you can get only the content with JavaScript, but bots will always get a nice page.

Back button with ajax and iframe

Here is a situation. We have a search feature which uses ajax so that search results can be updated when user changes one of the search filters. The search results page also has 3 ad units that are using iframes. We are using iframes so that when usees use pagination to go different pages or update search results using search filters, the ads can be refreshed.
Now the problem is if user uses pagination to go to different pages and then try to use browser back button, it does not work properly because when you change iframe source, browser add this in history
I would apprecaite any help on how to solve this issue.
You may want to consider loading ads dynamically (i.e. AJAX), instead of using iframes. So, you would simply use a <div> to display the ad (loaded with AJAX) instead of an <iframe>.
Mayby try location.replace("http://yourPage...") to replace the browsers last history entry after iFrame load?

External HTML page, inside AJAX Iframe?

Hi Masters Of Web Development.
I have a not that simple question this time. I have got a simple external HTML page, that I want to include in my site. The HTML page contains a submit form or something like that, and I wish to send this data from the form, without to reload the whole page. So I decided to put HTML page inside iframe. But, some people said that this is older technology, google doesn't like iframes, etc. So I want to use something like AJAX or JQuery to load that external HTML page, and to send submit form without reloading the whole page with it. :)
Any suggestions on how to make this?
Thanks in advance :)
Do you really need Google to index that iframe form? If that's the only iframe you have throughout the site, it aint going to be a problem in terms of google indexing.
About using the Iframe, if you are not comfortable learning and building ajax-type form, you'll still be fine (like what Frankie commented). Just make sure the form works, usable and compatible with popular browsers.
You want to use the jQuery Forms Plugin. Its very straightforward and easy to turn any normal HTML form into an AJAX form.

Resources