jquerycookiesjqueryi-ui-buttonset

Setting jquery cookies for buttonset


I'm trying to setup jquery cookies but I'm not able to get it to work. here's the code i'm using...

<div id="tabs-5">
 <form>
  <fieldset id="units" name="units">
   <legend>Units</legend>
    <center>
     <div id="radio">
      <label title="Select units of measurement to work with, Inches or Millimeters"></label>
      <label for="inches">Inches</label>
      <input type="radio" id="inches" name="unit" value="inches" onclick='valInches();' />
      <label for="mm">Millimeters</label>
      <input type="radio" id="mm" name="unit" value="mm" onclick='valMm();' />
     </div>
    </center>
  </fieldset> <!--end "units"-->
 </form>
</div> <!-- end tabs-5-->

$(function() {
 var selected = $.cookie('radio'); // Retrieve cookie value
  $('input[name="unit"][value="' + selected + '"]').attr('checked', true); //Check matching button
  $('input[name="unit"]').click(function() {
   $.cookie('radio', $(this).val(), {expires: 365}); // Save cookie
  });
});

Solution

  • I found what the problem was... the code I have works fine but the problem was the buttons weren't getting 'clicked'.

    So I added this to refresh the button 'click' and now everything works fine.

    $('input[value="' + units + '"]').prop('checked', true).button('refresh');
    

    EDIT: Setting the buttonset class to class=radioButtons this code does what I need for any buttonset...

    $(function(){                                                                               
        var radioButtonSet=$('.setCookies').find('.radioButtons');
        radioButtonSet.buttonset();
        var radio=$('.radioButtons').find(':radio');
    
        radio.each(function(){
            var selected=$.cookie(this.name);
            $('#'+selected).prop('checked', true).button('refresh');
    
            $(this).change(function() {
                $.cookie(this.name, $(this).val(), {expires: 365});
            });
        });
    });