Избегайте множественных (40) диалоговых окон подтверждения jquery - использовать повторно?

Question

Я работаю над исправлением устаревшего веб-приложения с помощью jQuery.

У меня есть форма с 40 кнопками, каждая из которых имеет определенный тип подтверждения, использующий подтверждение javascript. Я хочу переключить их, чтобы использовать модальное диалоговое окно jquery.

Я запрограммировал несколько из них, как показано ниже, и они работают нормально. Проблема в том, что в форме их 40. Поэтому не нужно программировать 40 отдельных модальных блоков. Единственное, что действительно меняется, - это JavaScript, который вызывается при нажатии кнопки Да

Есть предложения?

Код, вызываемый на кнопке:

$("#confirm1dialogTitle").html("Approve?");
$("#confirm1dialogText").html("Do you want to approve this request?");
$('#confirm1dialog').dialog('open');

Встроенный JavaScript:

<script type="text/javascript">
$(function() {
    $("#confirm1dialog").dialog({
        bgiframe: true,
        autoOpen: false,
        width: 350,
        height: 350,
        modal: true,
        buttons: {
            'Yes': function() {
                window.document.forms[0].FDDStatus.value = "Approved";
                window.document.forms[0].DivisionApproval.value = "Yes";
                window.document.forms[0].setApprovalFields();
            },
            'No': function() {
                $(this).dialog('close');
            }
        }
    });
});
</script>

Встроенный HTML:

<div id="confirm1dialog" title="<span id='Title'>Title</span>">
   <div id="users-contain" class="ui-widget">
      <form>
         <span id="confirm1Text"></span>
      </form>
   </div>
</div>

Answer 1

Вы можете поместить javascript, который изменяется в объект функции, а затем использовать его снова.

Давайте предположим, что вы вы выглядите так:

<form><input id='btn1' /><input id='btn2' /></form>

тогда вы делаете вспомогательную функцию:

var confirmHelper = function(id, yesCallback) {
  $(id).click(function() {
    $(function() {
      // the code from you example
      $("#confirm1dialog").dialog({
        bgiframe: true,
        autoOpen: false,
        width: 350,
        height: 350,
        modal: true,
        buttons: { 'Yes': yesCallback, 'No': function() { } }
      }
    }
  }
}

тогда вы применяете его к своим кнопкам:

confirmHelper('btn1' function() {
  // your callback from before
  window.document.forms[0].FDDStatus.value = "Approved";
  window.document.forms[0].DivisionApproval.value="Yes";                                   
  window.document.forms[0].setApprovalFields();
});

confirmHelper('btn2' function() {
  // your other javascript code
});

как и для 40 кнопок:)

Answer 2

Вы можете написать 40 функций в javascript (те, которые должны выполняться при нажатии кнопки «да») и использовать только один модальный блок.

Я не знаю, как выглядит ваша функция click (), но легко добавить туда переменную, используя, например, атрибут rel для ссылки, которую вы нажимаете, класс и т. Д. В зависимости от переменной Вы можете выполнить требуемую функцию.