Solved

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

Posted on 2009-04-08
4
1,294 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
  • 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

Gigs: Get Your Project Delivered by an Expert

Select from freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely and get projects done right.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
SQL Filter Question 8 82
javascript question 6 49
Auto Submit on dropdown box 3 74
Adding a Javascript click event to an HTML element given a class dynamically 5 34
Introduction Got endorsements from your clients?  Great!  There is almost nothing better than word-of-mouth advertising.  But how can you do that on the internet?  Sure you can make a page for endorsement quotations and list them all, but who is …
The Confluence of Individual Knowledge and the Collective Intelligence At this writing (summer 2013) the term API (http://dictionary.reference.com/browse/API?s=t) has made its way into the popular lexicon of the English language.  A few years ago, …
Two types of users will appreciate AOMEI Backupper Pro: 1 - Those with PCIe drives (and haven't found cloning software that works on them). 2 - Those who want a fast clone of their boot drive (no re-boots needed) and it can clone your drive wh…
Although Jacob Bernoulli (1654-1705) has been credited as the creator of "Binomial Distribution Table", Gottfried Leibniz (1646-1716) did his dissertation on the subject in 1666; Leibniz you may recall is the co-inventor of "Calculus" and beat Isaac…

816 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

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now