Change URL for first and second clicks

I searched the internet and stackoverflow to run the second click function, and here is what I found:

$('.elementclass').toggle(
function(){
   //on odd
    },
function(){
   //on even
}); 

It's fine. Now, according to this, I am trying to change the URL of my document, but something is not working. Here is my code:

$('.orderby').toggle(
function(){
      document.location.href+='?orderby='+$(this).val()+'ASC';
},
function(){
      document.location.href+='?orderby='+$(this).val()+'DESC';
});

where there $(this).val()will be something like a name or a date ...

I want to do the following: the first time the button is clicked, the URL changes to http: //blablabla/page.php? Orderby = nameASC , and then the second click, the URL changes to http: //blablabla/page.php? Orderby = nameDESC .

So what happened to my code?

, , ( ) , whit $_GET , . document.URL whit + =? orderby = nameASC + =? orderby = nameASC document.URL update whit + =? orderby = nameDESC.

+3
3

, script. , URL-.

$(document).ready(function() {
  $('.orderby').click(
    function(){
     var srch = location.search;
     if (srch) srch = srch.substring(1); // lose the ?
     var val = $(this).val();

     if (srch.indexOf(val+"ASC")!=-1)
       srch = srch.replace(val+"ASC",val+"DESC");
     else if (srch.indexOf(val+"DESC")!=-1)
       srch = srch.replace(val+"DESC",val+"ASC");
       else if (!srch || srch.indexOf("orderby")!=-1) {
         // if srch was empty or contained another value than this'
         srch ='orderby='+$(this).val()+'ASC'; 
       }
     var loc = (location.search)?location.href.split("?")[0]:location.href;
     window.location = loc + "?"+srch;
  });
});

PS: document.location.href . document.URL window.location.href

PPS: MilkyWayJoe - - , iframe ajaxed, - , JS


UPDATE2

AJAX, -

$(document).ready(function() {
  if (location.hash.indexOf(....) {
    // find the element which is mentioned in the orderby and click it
    var $elem = ....
    $elem.click(); // or trigger
  }

  $('.orderby').toggle(
    function(){
      $("#someLabel").html("DESC");
      var orderBy = $(this).val()+'ASC';
      location.hash = orderBy; // now URL will be ...#nameASC
      $("#content").load('soneserverprocess?orderby='+orderBy);
  },
  function(){
      $("#someLabel").html("ASC");
      var orderBy = $(this).val()+'DESC';
      location.hash = orderBy; // now URL will be ...#nameDESC
      $("#content").load('someserverprocess?orderby='+orderBy);
  });
});

,

http://www.tripwiremagazine.com/2012/02/jquery-filter-sort-plugins.html

$(document).ready(function() {
  if (location.hash.indexOf(....) {
    // find the element which is mentioned in the orderby and click it
    var $elem = ....
    $elem.click(); // or trigger
  }

  $('.orderby').toggle(
    function(){
      $("#someLabel").html("DESC");
      var orderBy = $(this).val()+'ASC';
      location.hash = orderBy; // now URL will be ...#nameASC
      $("#content").sort(....); // depending on plugin
    },
    function(){
      $("#someLabel").html("ASC");
      var orderBy = $(this).val()+'DESC';
      location.hash = orderBy; // now URL will be ...#nameDESC
      $("#content").sort(....); // depending on plugin
  });
});
+4

( ) Javascript reset. , toggle , .

- :

$('.orderby').click(function() {
    if(/ASC$/.test(window.location.href) {
        // switch to DESC
    } else {
        // switch to ASC
    }
}
+1

According to your code, the page gets reloaded, loaded each time it is clicked and, accordingly, in the library. Only the first handler in the switch function will be executed in this case all the time. Therefore, he will always be ASC.

You probably need a simple click handler, and inside the handler, the search window.location.searchhas ASCeitherDES .

0
source

All Articles