jquery-ui buttons as array - example of setting label?

Question

See Edit below initial question for a revised version of the original problem

Using a jquery-ui dialog I want to be able to specify the label on the button dynamically.

To do this I'm specifying an array of buttons like this :

var arrbuttons = {};
arrbuttons.cancel = function() { alert('test1');};
arrbuttons.update = function() { alert('test2');};
    $(function() {
      $( "#dialog" ).dialog({buttons: arrbuttons});
    });

I got that from this stackoverflow answer and it works fine as far as it goes.

What I would like to know now is how I can setup the array so the label of each button is specified for each element of 'arrbuttons'.

The jquery-ui documentation shows how to do this with an inline array like this :

$( ".selector" ).dialog({ buttons: [
    {
        text: "Ok",
        click: function() { $(this).dialog("close"); }
    }
] });

But there's no example in the jquery doco which corresponds to the answer I'm basing my attempt on.

Anyone know ?

OK I've now worked on this a little more. By doing the following I can specify the text of the buttons. The trouble is the function part no longer works (ie the buttons are labelled 'wow!' and 'kapow!' but when you click on them nothing happens.

var arrbuttons = {};
arrbuttons.cancel = {click: "function() { alert('test1');}", text:"wow!"};
arrbuttons.update = {click: "function() { alert('test2');}", text:"kapow!"};
$(function() {
    $( "#dialog" ).dialog({buttons: arrbuttons});
});

Any ideas of how to do this ?

@NimChimpsky : Yes ! That makes it work. Thanks very much. Do you want to make your comment into an answer so I can accept it ? — shearichard
– shearichard, Commented Sep 29, 2011 at 10:36

NimChimpsky · Accepted Answer · 2011-09-29 11:00:03Z

2

remove the double quotes around function statement

answered Sep 29, 2011 at 11:00

NimChimpsky

47.5k61 gold badges202 silver badges319 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

DMac the Destroyer · Accepted Answer · 2011-09-28 15:56:16Z

2

your "array" of buttons is actually a javascript object.

If you changed the latest code snippet you posted to this, it should work alright:

var arrbuttons = [];
arrbuttons.push({click: "function() { alert('test1');}", text:"wow!"});
arrbuttons.push({click: "function() { alert('test2');}", text:"kapow!"});
$(function() {
    $( "#dialog" ).dialog({buttons: arrbuttons});
});

Here, you see that arrbuttons is actually an array of javascript objects that jQuery will recognize as having both a click and a text property, which is what the api is expecting when passing in an array. I think you've mixed up your method signatures and that made jQuery angry.

answered Sep 28, 2011 at 15:56

DMac the Destroyer

5,3407 gold badges39 silver badges60 bronze badges

1 Comment

shearichard Over a year ago

Thanks for your answer I think you were on the right track, for which my thanks, but in the end it seemed to have come down to the quotes around the function statement as mentioned by NimChimpsky above. Thanks anyway.

Collectives™ on Stack Overflow

jquery-ui buttons as array - example of setting label?

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related