Проверка jQuery скрывает или разрушает модальное диалоговое окно jquery при отправке - PullRequest
Новая
       15

Проверка jQuery скрывает или разрушает модальное диалоговое окно jquery при отправке

0 голосов
/ 20 января 2010

В основном, если нажать кнопку отправки, созданную модально, и вызвать jQuery ('# FormName'). Submit (), он запустит проверку и затем вызовет метод, назначенный в submitHandler. После этого он либо создает новый модальный div, либо скрывает форму, и я не понимаю, почему.

Я отладил его и заметил, что после вызова метода в submitHandler форма .is (': hidden') = true, и это также верно для модального div. Я уверен, что я делал это раньше, но не могу понять, что я сделал неправильно на этот раз. Странно, что на экране появляется модальный div, но он полностью лишен контента. (Даже после ввода произвольного текста вне формы. Это как будто совершенно новый модальный div)

Вот методы настройки: 

function setUpdateTaskDiv() {
  jQuery("#UpdateTaskForm").validate({
    errorLabelContainer: "#ErrorDiv",
    wrapper: "div",
    rules: {
      TaskSubject: {
        required: true
      }
    },
    messages: {
      TaskSubject: {
        required: 'Subject is required.'
      }
    },
    onfocusout: false,
    onkeyup: false,
    submitHandler: function(label) {
      updateTaskSubject(null);
    }
  }
);

 jQuery('#UpdateDiv').dialog({
    autoOpen: false,
    bgiframe: true,
    height: 400,
    width: 500,
    modal: true,
    beforeclose: function() {
    },
    buttons: {
    Submit: function() {
      jQuery('#UpdateTaskForm').submit();
    },
    Cancel: function() {
      ...
    }
  }
});

где: 

function updateTaskSubject(task) {
  //does nothing, it's just a shell right now
}

На самом деле сейчас ничего не делает. Вот HTML: 

<div id="UpdateDiv">
 <div id="ErrorDiv">
 </div>
 <form method="post" id="UpdateTaskForm" action="Calendar.html">
  <div>
    <div class="floatLeft">
      Date:
    </div>
    <div class="floatLeft">
    </div>
    <div class="clear">
    </div>
  </div>
  <div>
    <div class="floatLeft">
      Start Time:
    </div>
    <div class="floatLeft">
      <select id="TaskStartDate" name="TaskStartDate">
      </select>
    </div>
    <div class="clear">
    </div>
  </div>
  <div>
    <div class="floatLeft">
      End Time:
    </div>
    <div class="floatLeft">
      <select id="TaskEndDate" name="TaskEndDate">
      </select>
    </div>
    <div class="clear">
    </div>
  </div>
  <div>
    <div class="floatLeft">
      Subject:
    </div>
    <div class="floatLeft">
      <textarea id="TaskSubject" name="TaskSubject" cols="30" rows="10"></textarea>
    </div>
    <div class="clear">
    </div>
  </div>
  <div>
    <input type="hidden" id="TaskId" value="" />
  </div>
  <div class="clear"></div>
 </form>
</div>

Странное открытие

Оказывается, что во всех примерах, на которых я работал, все внимание было сосредоточено на самом модале. Например, с помощью валидатора, чтобы добавить сообщения в div ошибки. (Успех или нет). Без этого модальное диалоговое окно, очевидно, думает, что оно сделано с тем, что ему нужно, и просто скрывает все. Не знаю точно, почему, но чтобы остановить это поведение, нужно сосредоточить внимание на чем-то внутри самого div.

1 Ответ

0 голосов
/ 20 января 2010

у вас есть ваша форма в DIV, это то, что вы намеревались? (Я не вижу </div> после формы ...) 

<div id="UpdateDiv"> 
 <div id="ErrorDiv"> 
 </div>

возможно должно быть: 

<div id="UpdateDiv"> 
 <div id="ErrorDiv"></div>
 </div>
...