Triggering click from radio toggle cookie not working

Question

Based on the advice found in this Stack Overflow q/a I'm attempting to trigger a click via a cookie. The cookie's being set on a radio button selection. One of the two divs being toggled need to be set to hidden.

The problem: The initial if statement isn't triggering a click.

if($.cookie('light-or-dark')) {
    $($.cookie('light-or-dark') + '-radio').attr('checked', true).trigger('click');
    } else {
    $('#theme-schemes-dark').hide();
  };

// the toggle on radio button change function
$('[name=light-dark-radio]').change(function(){
    $('#theme-schemes-light').toggle('medium');
    $('#theme-schemes-dark').toggle('medium');

    // set cookie on toggle state
    $.cookie('light-or-dark', '#theme-schemes-' + this.value, {expires:365, path: '/'})
  })

The HTML:

<div class="selection-wrap">
  <label>
    <input type="radio" name="light-dark-radio" id="theme-schemes-light-radio" value="light" checked>
    Light
  </label>
  <label>
    <input type="radio" name="light-dark-radio" id="theme-schemes-dark-radio" value="dark">
    Dark
  </label>
</div>

<!-- first div -->
<div class="selection-wrap" id="theme-schemes-light">
  <a class="theme-scheme-btn color-box bg-blue" id="defaultThemeScheme" href="#">Light 1</a>
  <a class="theme-scheme-btn color-box bg-yellow" href="#">Light 2</a>
</div>

<!-- second div - hidden by default -->          
<div class="selection-wrap" id="theme-schemes-dark" style="display: none">
  <a class="theme-scheme-btn color-box dark-color-blue" href="#">Dark 1</a>
  <a class="theme-scheme-btn color-box dark-color-yellow" href="#" >Dark 2</a>
</div>

A FIDDLE to better illustrate

Much obliged for insight.

Is this object founded '$($.cookie('light-or-dark') + '-radio')', what console.log($($.cookie('light-or-dark') + '-radio')) display ? — Łukasz Szewczak, Mar 31 '14 at 13:36
hmm... it returns as undefined. When running the same command as an alert i get `[object Object]` — Isaac Gregson, Mar 31 '14 at 13:42
Could You paste your html code with this radio button and the two divs.. — Łukasz Szewczak, Mar 31 '14 at 13:49
added html code and created a fiddle. Take away the initial cookie jQuery in the fiddle to see it working. Add it back in to see it broken. — Isaac Gregson, Mar 31 '14 at 14:00

score 0 · Answer 1 · answered Mar 31 '14 at 14:23

I dont seem to have the same problem. ( http://jsfiddle.net/jaLQZ/3/ )

  $($.cookie('light-or-dark') + '-radio').click(function(){
    alert( 'click' + this.value );
  });

  if($.cookie('light-or-dark')) {
    $($.cookie('light-or-dark') + '-radio').attr('checked', true).trigger('click');
    } else {
    $('#theme-schemes-dark').hide();
  };

  $('[name=light-dark-radio]').change(function(){
    $('#theme-schemes-light').toggle('medium');
    $('#theme-schemes-dark').toggle('medium');
    // set cookie on toggle state
    $.cookie('light-or-dark', '#theme-schemes-' + this.value, {expires:365, path: '/'});
  })

Maybe you are using a browser that doesnt support the cookie plugin?

no, i'm using the latest Chrome and Cookies are certainly working. The problem's that when switching pages the toggled div reverts to the default (light), even if dark is selected before clicking to another page. So it seems that for some reason the radio isn't being clicked via the initial `if` statement. — Isaac Gregson, Mar 31 '14 at 14:33

score 0 · Accepted Answer · answered Mar 31 '14 at 14:37

Try this, I change code for restore div's

  if($.cookie('light-or-dark')) {

$($.cookie('light-or-dark') + '-radio').attr('checked', true);
   $('#theme-schemes-light').hide();
   $('#theme-schemes-dark').hide();
   $($.cookie('light-or-dark')).show();
} else {
$('#theme-schemes-dark').hide();
};

$('[name=light-dark-radio]').change(function(){
$('#theme-schemes-light').toggle('medium');
$('#theme-schemes-dark').toggle('medium');
// set cookie on toggle state
$.cookie('light-or-dark', '#theme-schemes-' + this.value, {expires:365, path: '/'});
})

Worked! I suppose trying to get a click action on the radio just wasn't a good route for this one. Many thanks. — Isaac Gregson, Mar 31 '14 at 14:46

Triggering click from radio toggle cookie not working

2 Answers2