Общий код jQuery - PullRequest
Новая
       10

Общий код jQuery

3 голосов
/ 13 ноября 2010


Я использую модальные диалоговые окна jQuery в моем приложении для обработки обычных операций CRUD.В некоторых случаях у меня даже есть два открытых модальных диалоговых окна.

Затем я создал две универсальные функции во внешнем файле javascript для обработки соответственно отображения и отправки форм CRUD.

Для отображения модальных диалогов я вызываю следующую функцию 

function _loadDialog(level, action, id, title, onCloseHandler) {
    var panel = panels[level];
    $(panel).dialog("option", "title", title);
    var url = action;
    if (id != "") url = url + "/" + id;
    $.ajax({
        type: "get",
        dataType: "html",
        url: url,
        data: {},
        success: function(response) {
            $(panel).html('').html(response).dialog('open');
        }
    });
    $(panel).unbind("dialogclose").bind("dialogclose", function(event, ui) {
        if (onCloseHandler != null) {
            onCloseHandler();
        }
    });
}

Эта функция, помимо прочего, получает параметр level, который инструктирует функцию, как складывать диалог и где размещатьвизуализированная частичная разметка, возвращаемая после вызова ajax.Эта функция работает нормально.

Внутри частичного представления, возвращаемого вызовом ajax, есть ввод и в конце следующий код 

<div style="text-align:right;">
    <input type="submit" id="btnSave" value="Salva" />
</div>

, а для части jQuery, например, 

$("#contactForm").submit(function(event) {
    _submitForm(1, event, "#contactForm", "post", "html", '<%= Url.Content("~/Contact/Save") %>');
});

Как видите, функция submit имеет следующую подпись 

function _submitForm(level, event, formName, atype, adataType, aurl) {
}

и обрабатывает

  • отправку формы для правильного действия контроллера
  • обратная связь с пользователем (например, «действие выполнено успешно»)
  • операция закрытия диалога

Параметр уровня необходим для обращения ко всем функциям, включая закрытие диалога,для правильной используемой панели DIV.

Я хотел бы иметь возможность отображать одно и то же диалоговое окно иногда в виде диалога, а иногда и в качестве вспомогательного диалога.
Чтобы иметь возможность сделать это, я имею в виду «логически говоря«поскольку я не так силен в javascript и jQuery, мне нужны следующие изменения:

  • Измените функцию _loadDialog, чтобы сохранить параметр level внутри самой разметки диалога
  • Modify функции _submitForm и настройте ее, используя правильный параметр level, который был ранее сохранен из функции _loadDialog.

Как этого добиться?

Ответы [ 2 ]

1 голос
/ 13 ноября 2010

Я немного озадачен тем, что где и когда, но кажется, что вы хотите связать немного информации с конкретным элементом.

Для этого вы можете использовать jQuery's .data()метод.Он будет связывать любые данные, которые вы хотите с конкретным элементом.

Не уверен, как именно они должны использоваться в вашей ситуации, но вот общий пример: 

$('#someSelector').data('level', 3);

Теперь элемент сИдентификатор someSelector будет иметь число 3, сопоставленное с его атрибутом 'level' в связанных данных.

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

$('#someSelector').data('level'); // returns 3

При уничтоженииэлемент, с которым связаны данные (это только один пример таких данных), вы должны обязательно использовать .remove() или .empty() или один из других методов, которые автоматически или вручную удаляют данные.

1 голос
/ 13 ноября 2010

Похоже, все, что вам нужно, это передать параметр level, который вы уже получили, в функцию _submitForm при вызове. 

function _loadDialog(level, action, id, title, onCloseHandler) {
    var form = $('<form ...></form>');
    // ... Generates the form markup

    form.submit(function() {
        _submitForm(level, ...);
    });
}

Хотя я, очевидно, пропустил все детали, которые я не знаю о вашей реализации, ключевой момент заключается в том, что все, что level будет передано в _loadDialog, позже будет передано в _submitForm при его вызове.

В JavaScript не имеет значения, что _submitForm не вызывается одновременно с вызовом _loadDialog. Через то, что называется «замыканием» (о чем любят говорить программисты JavaScript), переменная level безопасно сохраняется в вашей анонимной функции обратного вызова для form.submit() и будет по-прежнему доступна с тем же значением, когда эта функция в конечном итоге вызывается.

...