Текст диалоговых кнопок интерфейса Jquery не работает

Question

Я создаю модальное диалоговое окно JQuery UI и сохраняю результат в переменной $ dialog.Кнопки меняются в зависимости от того, какая операция выбрана, поэтому я настраиваю кнопки с помощью вызова функции следующим образом:

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

При этом отображаются две кнопки с текстом «0» и «1» вместо «ОК и «Отмена».Кроме того, функции щелчка, кажется, не работают.

Я неоднократно проходил эту процедуру, и синтаксис выглядит правильным.Что я делаю не так?

Answer 1

Справка по jQuery UI для этого говорит, что используемый вами метод предназначен для уже инициализированного модального режима - http://jqueryui.com/demos/dialog/#option-buttons Это так?

Если нет, попробуйте это, а затем поэкспериментируйте, как оно отличается от вашего решения:

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

Answer 2

Вы можете попробовать синтаксис следующим образом:

$dialog.dialog( "option", "buttons", {
       "Ok": function() { close_project(); },
       "Cancel": function() { $(this).dialog("close"); }
    }
);

Answer 3

Это тоже работает:

buttons: {
        'Do some action': function () {
            //a button called 'Do some action' is created
        },
        Close: function () {
            //a button called 'Close' is created
            $(this).dialog('close');
        }
    },
    open: function () {
        //event fires when dialog opens
    },
    close: function () {
        //event fires when dialog closes
    }

Answer 4

Кажется, что сеттер не работает.Вместо этого я выполнил полную инициализацию диалога со всеми заданными одновременно параметрами:

<script type="text/javascript">
    $("#DiscardDialog").dialog(
    {
        autoOpen: false,
        title: "Discard",
        buttons:
        {
            "Yes": function()
            {
                window.location = "@Url.Action("Discard", new { ID = this.Model.ID })";
            },
            "No": function()
            {
                $(this).dialog("close");
            }
        }
    });
</script>

Answer 5

У меня была та же проблема с меткой кнопки «0 1». Мне «нужен» синтаксис массива для кнопок вместо синтаксиса объекта, потому что я хотел установить идентификатор кнопки (мой код был похож на rdamborsky с установленными идентификаторами и все еще не работал). Я посмотрел на этот вопрос:

Значки диалоговых кнопок jQuery UI

И изменил попытку кода в вопросе. Для вашего конкретного примера:

$dialog.dialog({ buttons: {
        "Ok": function() { close_project(); },
        "Cancel": function() { $(this).dialog("close"); }
    },
    open: function() {
        $('.ui-dialog-buttonpane').find('button:contains("Cancel")').attr("id", "cancel_button");
        $('.ui-dialog-buttonpane').find('button:contains("Ok")').attr("id", "ok_button");
}});

Кстати, я замечаю ($ this), когда я думаю, что вы имеете в виду $ (this) в своем коде. Это может испортить один клик. Другой щелчок может иметь проблему (но только если это каким-то образом в запросе ajax): если вы используете IE 7 или 8, внесите небольшое изменение, чтобы обойти проблему с областью видимости IE (ajax). Перед вашим кодом $ dialog.dialog выполните "window.close_project = close_project;" и затем вызвать "window.close_project ();" в функции щелчка.

К вашему сведению, если вам не нужно менять идентификатор, класс или что-то еще, отбросьте «open» и просто используйте синтаксис объекта для кнопок. Или просто воспользуйтесь ответом Амурры.

Answer 6

Это сработало для меня

$("#dialog-form").dialog
(
{
    autoOpen: false,
        height: 300,
    width: 350,
    resizable: false,
    autoOpen: false,
    modal: true,
    buttons: {
       'Guardar' : function()
        {
            $("#dialog-form").dialog( "close" );
            $(this).html("Guardar");
         },
        Cancel: function()
         {
            $(this).html("Cancelar");
            $("#dialog-form").dialog( "close" );
        }
    }
});

Answer 7

опция «текст» - это логический флаг, указывающий, должен ли отображаться текст из тега.Возможно, вам следует попробовать изменить .html () кнопки, например

$("#Button1").html("Ok");