jQuery UI Custom Dialog Buttons

Question

I am working in jQuery UI and am trying to figure out a way for a way to pass in custom data fields through the buttons options array. I would like to pass in fields like the example below. data-example & data-example2. Is this possible to do through the buttons param??

<button type="button" data-example="XXXX" data-example2="YYYY" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false" ><span class="ui-button-text">xxx</span></button>

here is my create dialog code -

options = {
                autoOpen: true,
                buttons : [
                    {text:"example1"},
                    {text:"example2"}
                ]
            }
jQuery("<div class='dialog' title='xxx'><p>xxx</p></div>")
            .dialog(options);

http://api.jqueryui.com/dialog/#option-buttons

Answer 1

This example should help.

$(function() {
   $( "#dialog" ).dialog({ buttons: [ { id:"test","data-test":"data test", text: "Ok", click:    function() {alert($('#test').data('test')); $( this ).dialog( "close" ); } } ] });
});

http://jsfiddle.net/9g6jM/