How to Change the Url using JavaScript

Question

We are using three divs in our application.

Header
Middle portion
Footer

Url of the application : http://localhost:8080/APPNAME/index.jsp

Header contains three buttons. If we click on the buttons we will change the middle portion div content using the following code:

$('div#middleportion').load('login.jsp');
$('div#middleportion').load('register.jsp');
$('div#middleportion').load('home.jsp');

Successfully we are loading content. My problem is if we click on login button we are able to display login content in middle portion div, but I need to change the URL as follows:

http://localhost:8080/APPNAME/login.jsp

How to achieve this?

Please help me.Help would be appreciated.

You application is hosted on your local machine, we will not able to see it. — kazinix
– kazinix, Commented Oct 28, 2011 at 6:07
@domanokz.. no for explanation i attached the address but i need to change the address using javascript how to achieve? — Kiran
– Kiran, Commented Oct 28, 2011 at 6:08
@sdolgy.. The code you have refered is reloading the whole page but i need to change the url when the div content is changed? — Kiran
– Kiran, Commented Oct 28, 2011 at 6:13

Awais Qarni · Accepted Answer · 2011-10-28 07:16:15Z

1

jquery address plugin

EDIT:

I actually had to do the same thing that you're lookin for (from what i understand).

for pages that I wanted to be loaded dynamically (just the div) I created a version without the layout. for example, for login.jsp I had ajax/login.jsp (which had only the actual div).

since I normally work with mvc and layouts, it was easy to separate the div from the layout on the server side.

In the plugin I made sure that the url's that are being replaced are only the ones with the class ajax and I added this class to all of the links that i wanted to change the div only.

edited Oct 28, 2011 at 7:16

Awais Qarni

18k25 gold badges80 silver badges145 bronze badges

answered Oct 28, 2011 at 6:07

galchen

5,3003 gold badges32 silver badges44 bronze badges

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

6 Comments

Kiran Over a year ago

Thanks a lot for quick reply.. But this plugin is reloading the page content.i need to reload only div content and i need to change the url.

Kiran Over a year ago

Thank you very much but here in our application we are using any ajax call so that we need to load jsp pages from client side.The plugin will load from server side.

galchen Over a year ago

you want a script that loads only the div from login.jsp from the client side?

Kiran Over a year ago

Actually am able to load login.jsp in div but i need to change the url without reloading the page.

galchen Over a year ago

ah then you can use window.history.pushState to store the history (use back/forward). window.history.pushState(data, "title", "/newpath");

|

Collectives™ on Stack Overflow

How to Change the Url using JavaScript

1 Answer 1

6 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related