Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Jun 2012
    Posts
    34
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Tree submenu, need two independent bold-on-click feature

    Hey there,

    In my tree menu seen at http://www.wrcc.dri.edu/monitor/WWDT/index.php, is there a way to make the Variable sub menu and Region sub menu independent of eachother in terms of being bold when clicked... So for example, If I click PDSI I want that to become bold and then if I click Arizona I want that to become bold as well. I would like variable and region to both be bold when the user clicks on it. This makes it easier for the user to know what he/she clicked by just looking at the tree menu. Right now, only the active or recently clicked variable/region become bold.

    You can view my source code and see that right now I have:

    Code:
    <script type="text/javascript">
    $(function(){
    $('#variable').find('a').each(function(){
    if (this.href==location.href){
    $(this).addClass('Active');
    }else{
    $(this).removeClass('Active');
    }
    });
    });
    </script>
    
    <script type="text/javascript">
    $(function(){
    $('#region').find('a').each(function(){
    if (this.href==location.href){
    $(this).addClass('Active');
    }else{
    $(this).removeClass('Active');
    }
    });
    });
    </script>
    Thanks for all and any help

  • #2
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    well, since the href changes on every click and the 2 menus only get bolded if the href's match, then using what you have, it's not going to work properly, because the href in one menu isnt going to match the other, so you may need to rethink your overall approach to the problem.

    you could parse the current href for the folder= or region= variables, and use that specific info to apply the desired coloring, but with the way you have your backend setup, when they click on a region, it's a new page, when they click on the variable menu, thats a new page and url.

    so you might want to rethink the backend a bit?. The url in browser only shows folder= or region=, but the php side is obviously showing the correct info based on those selections

  • #3
    New Coder
    Join Date
    Jun 2012
    Posts
    34
    Thanks
    0
    Thanked 0 Times in 0 Posts
    you could parse the current href for the folder= or region= variables, and use that specific info to apply the desired coloring
    How would I code this up in JavaScript though? Thanks for the input! What would I add/change to the code:

    Code:
    </script>
    <script type="text/javascript">
    $(function(){
    $('#variable').find('a').each(function(){
    if (this.href==location.href){
    $(this).addClass('Active');
    }else{
    $(this).removeClass('Active');
    }
    });
    });
    </script>

  • #4
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    from http://www.kevinleary.net/get-url-pa...script-jquery/

    Code:
    // Parse URL Queries Method
    (function($){
    	$.getQuery = function( query ) {
    		query = query.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
    		var expr = "[\\?&]"+query+"=([^&#]*)";
    		var regex = new RegExp( expr );
    		var results = regex.exec( window.location.href );
    		if( results !== null ) {
    			return results[1];
    			return decodeURIComponent(results[1].replace(/\+/g, " "));
    		} else {
    			return false;
    		}
    	};
    })(jQuery);
     
    // Document load
    $(function(){
    	var test_query = $.getQuery('test');
    	alert(test_query); // For the URL http://www.kevinleary.net/?test=yes, the value would be "yes"
    });
    you'd do that sort of that thing to parse the values in the url and instead of matching directly against the href you use something like var $region= $.getquery("region"); and compare against the variable $region instead.

    if you get the php reworked so the url includes both selections in the url, you'll be straight.

    Id like to point out since your doing a page refresh every time anyways, you could do all of this in php and it'd probably be more efficient, but of course it's about whatever works for your needs.
    Last edited by DanInMa; 07-17-2012 at 01:53 AM. Reason: trying to get in the habit of naming jquery object with the $

  • #5
    New Coder
    Join Date
    Jun 2012
    Posts
    34
    Thanks
    0
    Thanked 0 Times in 0 Posts
    hetlakoopm4, images are broken.

  • #6
    New Coder
    Join Date
    Jun 2012
    Posts
    34
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Bump.......... any help? I still cant get this to work...

  • #7
    New Coder
    Join Date
    Jun 2012
    Posts
    34
    Thanks
    0
    Thanked 0 Times in 0 Posts
    noi, how can i do this in the php ??


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •