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 2 of 2
  1. #1
    New to the CF scene
    Join Date
    May 2012
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Dropdown (return current value)

    Hi, i need some help with this if is possible.

    I make this dropdown:
    Code:
    <dl class="dropdown">
    <dt><a><span>Select a Field</span></a></dt>
    <dd>
    <ul id="menu-tags-menu" class="menu">
    <li id="menu-item-159" class="menu-item current-menu-item"><a href="http://myweb.com.ar/portfolio/">All Fields</a></li>
    <li id="menu-item-54" class="menu-item"><a href="http://myweb.com.ar/tag/branding/">Branding</a></li>
    <li id="menu-item-55" class="menu-item"><a href="http://myweb.com.ar/tag/print-design/">Print Design</a></li>
    <li id="menu-item-57" class="menu-item"><a href="http://myweb.com.ar/tag/web-design/">Web Design</a></li>
    <li id="menu-item-56" class="menu-item"><a href="http://myweb.com.ar/tag/ui-design/">UI Design</a></li>
    <li id="menu-item-52" class="menu-item"><a href="http://myweb.com.ar/tag/motion-graphics/">Motion Graphics</a></li>
    <li id="menu-item-53" class="menu-item"><a href="http://myweb.com.ar/tag/illustration/">Illustration</a></li>
    </ul>
    </dd>
    </dl>
    Working with jquery and this code:
    Code:
    $(document).ready(function() {
    	$(".dropdown dt a").click(function() {
    		$(".dropdown dd ul").toggle();
    	});
    	$(".dropdown dd ul li a").click(function() {
    		var text = $(this).html();
    		$(".dropdown dt a span").html(text);
    		$(".dropdown dd ul").hide();
    		$("#result").html("Selected value is: " + getSelectedValue("sample"));
    	});
    	function getSelectedValue(id) {
    		return $("#" + id).find("dt a span.value").html();
    	}
    	$(document).bind('click', function(e) {
    		var $clicked = $(e.target);
    		if (! $clicked.parents().hasClass("dropdown"))
    		$(".dropdown dd ul").hide();
    	});
    });
    This works very well.. but i need the dt a span show me the value of the current li (<li class="current-menu-item">), so instead "Select a Field" must say "All Fields" (current value in this example), and when i go to "Motion Graphics" (for example), when page is load must say "Motion Graphics".

    Can i do this adding a variable to take the value of current li and droping when document.ready?

    Thanks

  • #2
    New to the CF scene
    Join Date
    May 2012
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Here you can see how it works:
    http://www.patricioherrera.com.ar/portfolio

    Any ideas?


  •  

    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
    •