The Grayzone

Dynamic jQuery UI Dialog buttons

The project that I’m currently working on is an ASP.NET MVC app, with the majority of calls to server side methods being made via jQuery AJAX, returning PartialViews that are then shown in jQuery UI Dialogs.

I’ve created a few generic methods for helping with common functionality used by many Dialogs.

As part of this I had to come up with a way of passing in a string containing the text that you need to display in the buttons and I found my answer by using Javascript object literal notation.

var label1 = 'save';
var label2 = 'cancel';

var theButtons = {}; 
theButtons[label1] = function() { /*whatever*/ };
theButtons[label2] = function() { /*whatever*/ };

$("#dialog").dialog({
  autoOpen: true,
  buttons: theButtons
});

Share this: