Chrome and Firefox not passing querystring value with jquery load()

Question

While working with some jQuery ajax, I've run into this problem with Chrome and Firefox not passing a querystring value with jquery load()

Here is the markup:

<a href="#" class="abort-invitation" id='abort-invitation-103'>abort</a>

The jquery script:

$('a.abort-invitation').live(
  {
     click: function (e) {
     var $link = $(this);
     var querystringValue = $link.html();
     var randomnumber = new Date().getTime();
     var urlPath = '<%:Url.Action("AbortInvitation", "Evaluation") %>' + '?
                  inviteState=' + querystringValue + '&ran=' + randomnumber; 
     var $modal = GetModal();
     $modal.load(urlPath);
    // more javascript ...

The MVC method being called on load():

public PartialViewResult AbortInvitation()
{
  ViewData["inviteState"] = Request.QueryString["inviteState"];
  var randomValue = Request.QueryString["ran"];
  return PartialView("~/views/evaluation/controls/AbortOrReactivate.ascx");
}

While debugging in Visual Studio ViewData["inviteState"] will give me a value when load is fired from IE(8), and in Chrome(16.0) and FireFox(8) I will get "" as the passed in value. Does anyone have a clue or a solution for why one browser works as expected, and the other two fail at passing the querystring value?

(Note: most of the vars are just my attempt at trying to isolate the problem and break things down one at a time. The random number is attached in case there is some caching going on. We only really care about the var 'querystringValue' itself.)

Does the querystringValue variable have a value if you debug in chrome? — James Montagne
– James Montagne, Commented Jan 7, 2012 at 6:08
I actually tried watching the request post through firebug and saw that the values for the querystrings were empty, yet if I pop a javascript alert box with the ulrPath variable I can see that the string has been created successfully. — Chris
– Chris, Commented Jan 7, 2012 at 16:19

Darin Dimitrov · Accepted Answer · 2012-01-07 08:59:42Z

1

Try properly url encoding your request parameters:

var urlPath = '<%: Url.Action("AbortInvitation", "Evaluation") %>';
var $modal = GetModal();
$modal.load(urlPath, {
    inviteState: querystringValue,
    ran: randomnumber
});

Also jQuery has a built-in mechanism for disabling the cache, so this ran variable seems not necessary:

var urlPath = '<%: Url.Action("AbortInvitation", "Evaluation") %>';
$.ajax({
    url: urlPath,
    type: 'GET',
    cache: false,
    data: { inviteState: querystringValue },
    success: function(result) {
        var $modal = GetModal();
        $modal.html(result);
    } 
});

answered Jan 7, 2012 at 8:59

Darin Dimitrov

1.0m277 gold badges3.3k silver badges3k bronze badges

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

3 Comments

Chris Over a year ago

I agree about the ran variable. I don't think it has anything to do with the actual posting of the querystring. I will try the proper encoding of the querystring values like you have given and see if the values are getting passed at that time. Thanks!

Darin Dimitrov Over a year ago

@Chris, no, probably it doesn't. You just have to ensure that you are properly url encoding your request parameters.

Chris Over a year ago

While I attempted to get the url encoding working, I actually decided that the entire chunk of code wasn't as clear as it could have been. I decided to go a different direction and did the logic on the client side which avoids the need of passing a querystring value to the server. Thanks for the help though.

Collectives™ on Stack Overflow

Chrome and Firefox not passing querystring value with jquery load()

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related