Last menu option is always selected

[stephaniebane]

First off, great plugin!

Only problem I'm having: No matter which page I select from the dropdown, my last menu option (Contact) is always appearing as the active link. Any ideas on how to fix?

[dagomez]

I am having this problem as well. The only way around it was to add a header option

[pauloelias]

To solve this make sure you specify the the "active" option:

$(".js #Navigation-Primary ul").tinyNav({
      active: 'current'
});

Doing so solves the problem if your "selected" class on selected links is something other than "selected".

[robme]

I am having this problem in spite of choosing the active class as above. It works fine if one of the items has the active class, but when none of them do (because you aren't on one of the pages) it always selects the last menu item.

What would make sense is to set none of them to be selected in such a situation (and as such, the first item would be shown). It is strange that the last menu item is selected even though you aren't on that page. This happens e.g. when it's a submenu, and you are on the parent page. I guess I will have to use the header option to prevent this from happening.

[chrisbeaman]

Make sure you have the class of "selected" applied to your "li" tag, not your "a" tag.

[andwee]

I've got the same problem. Here is my solution: I first check if there is any selected item and decide then if I can activate an action or, otherwise, add an extra option to the top of the select. Therefor you have to replace these lines (Starting Line 53):

$select
  .find(':eq(' + $(l_namespace_i + ' li')
  .index($(l_namespace_i + ' li.' + settings.active)) + ')')
  .attr('selected', true);

With:

var $selected = $(l_namespace_i + ' li')
  .index($(l_namespace_i + ' li.' + settings.active));

if($selected > 0) {
  $select
    .find(':eq(' + $selected + ')')
    .attr('selected', true);
} else {
  $select.prepend(
    $('<option/>').text('Select page...')
  );
}

[madewithweb95]

This fixed it for us

$(document).ready(function() {
    $("#tinynav1 option").each(function () {
        if ($(this).val() == location.href) $(this).attr('selected','selected');
    });
});

[punlf]

@andwee I modified your solution a little bit.

var $selected = $(l_namespace_i + ' li')
  .index($(l_namespace_i + ' li.' + settings.active));

if($selected >= 0) {
  $select
    .find(':eq(' + $selected + ')')
    .attr('selected', true);
} else {
  $select.prepend(
    $('<option/>')
    .text('Select page...')
    .attr('selected', true)
  );
}