Solved

Change URL value when a dropdown index in AJAX update panel selected index changes

Posted on 2009-04-08
4
1,318 Views
Last Modified: 2012-05-06
I want to change the URL in the address bar of the browser when a dropdown index in AJAX update panel selected index changes

I have a page which by default is http://www.example.com/default.aspx

A drop down in an update panel has a series of values.

You can also open it by entering  http://www.example.com/default.aspx?value=2 in the address bar. It will select the value '2' in the dropdown and display the right results in the update panel.

When a user selects a value from the dropdown (let's say they pick value 2), I would like the url to become http://www.example.com/default.aspx?value=2
0
Comment
Question by:Matt_Du
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
4 Comments
 
LVL 8

Expert Comment

by:the_crazed
ID: 24105835
the trouble with altering the address bar (using can do this in JavaScript with document.location.href=...) is that is will trigger a page refresh

A solution I came up is to use the hash instsead - altering this does not trigger a page refresh

so your url would be
 http://www.example.com/default.aspx#value=2

you can get this info on the client using document.location.hash (result: value=2) then parse it to get your value, then get the data for this record using AJAX


when you want to change it, simply set document.location.hash again
0
 

Author Comment

by:Matt_Du
ID: 24109455
Using clientside hashes sounds good but I'm a little confused on how to:

"you can get this info on the client using document.location.hash (result: value=2) then parse it to get your value, then get the data for this record using AJAX"


How can I interject my own JS during an ASP UpdatePanel update?
I have a gridview with data tied to a dropdown. Both are in an update panel. Should I map my own JS to get the value of the hash when the selectedindex of the drop down changes, and then more importantly, how do I make sure the server knows what it is and that I can reference it in my codebehind file to pull up the right data?

Thanks!
0
 
LVL 8

Accepted Solution

by:
the_crazed earned 500 total points
ID: 24136338
this is the trouble with .net! too much of the mechanics are hidden, so its not simple to do anything a bit customised.

do you know the id of your dropdown? or is it generated?

if you know the id, then you can do something like:
Sys.Application.add_load(ApplicationLoadHandler);
function ApplicationLoadHandler() {
     //attach your own js to run after the update, and set the hash
     Sys.WebForms.PageRequestManager.getInstance().add_endRequest(AfterAjaxRequest);
 
     //and add your own js to get the hash when the page first loads
     //say your dd id is "myDropDown"
     var dd = document.getElementById("myDropDown");
     dd.value=requestFromHash("value");
}
 
//called after AJAX request
function AfterAjaxRequest(sender, args)
{
     var dd = document.getElementById("myDropDown");
     document.location.hash = "value=" + dd.value;
}
 
//fn to get value from hash
function requestFromHash(strKey){
    var hash = document.location.hash;
    if(hash){
        //remove the # at the start
        hash = hash.substring(1)
        var arr = hash.split("&");
        for(var i=0; i< arr.length;i++){
            if(arr[i].split("=")[0].toLowerCase()==strKey.toLowerCase())
                return arr[i].split("=")[1];
            
        }
    }
}

Open in new window

0
 

Author Closing Comment

by:Matt_Du
ID: 31568222
Awesome explanation, thank you so much!
0

Featured Post

Online Training Solution

Drastically shorten your training time with WalkMe's advanced online training solution that Guides your trainees to action. Forget about retraining and skyrocket knowledge retention rates.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The most up-to-date version of this article is on my Blog https://iconoun.com/blog/
This demonstration started out as a follow up to some recently posted questions on the subject of logging in: http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28634665.html and http://www.experts-exchange.com/Programming/…
Michael from AdRem Software explains how to view the most utilized and worst performing nodes in your network, by accessing the Top Charts view in NetCrunch network monitor (https://www.adremsoft.com/). Top Charts is a view in which you can set seve…
Monitoring a network: how to monitor network services and why? Michael Kulchisky, MCSE, MCSA, MCP, VTSP, VSP, CCSP outlines the philosophy behind service monitoring and why a handshake validation is critical in network monitoring. Software utilized …

717 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question