buttonset with cakephp style radio

Shows that jQuery UI has issues with the hidden field outside the buttonset div. Possibly because of the name on the hidden field.

by reubenhelms

HTML

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/themes/base/jquery-ui.css">
<form>
<div class="myradio">
<input type="radio" name="data[Model][field]" id="ModelField_" value="_" checked="checked">    
<input type="radio" name="data[Model][field]" id="ModelFieldOption1" value="option1"><label for="ModelFieldOption1">Option 1</label>
<input type="radio" name="data[Model][field]" id="ModelFieldOption2" value="option2"><label for="ModelFieldOption2">Option 2</label>
<input type="radio" name="data[Model][field]" id="ModelFieldOption3" value="option3"><label for="ModelFieldOption3">Option 3</label>
</div>

<button id="submit">Submit</button>
</form>
<h2>Expected</h2>
<div id="expected"></div>
<h2>Results</h2>
<div id="results"></div>

JavaScript

jQuery().ready(function(){
    jQuery(".myradio").buttonset();
    jQuery("#submit").click(function(){
        jQuery('#expected').html(jQuery('form').serializeArray());

    });
});