Значительное множественное всплывающее странное поведение

У меня есть меню, в котором есть несколько ссылок на всплывающие окна с формами. Это выглядит следующим образом:Значительное множественное всплывающее странное поведение

<ul> 
    <li><a href="/hr/applications/edit/15">Редактировать анкету</a></li> 
    <li><a href="/Hr/PlaceUserInJobPopup?applicationId=15" class="magnific-form" type="inline">Трудоустроить</a></li> 
    <li><a href="/Hr/RefuseUserApplicationPopup?applicationId=15" class="magnific-form">Отказать</a></li> 
    <li><a href="/Hr/RenunciateUserApplicationPopup?applicationId=15" class="magnific-form">Отказался сам</a></li> 
</ul>

Мой скрипт для всплывающих окон выглядит следующим образом:

$(document).ready(function() { 
    $('.magnific-form').magnificPopup({ 
     type: 'ajax', 
     closeOnContentClick: false, 
     closeBtnInside: true, 

     callbacks: { 
      settings: null, 
      parseAjax: function (mfpResponse) { 
       console.log('Ajax content loaded:', mfpResponse); 
      }, 
      ajaxContentAdded: function() { 
       console.log(this.content); 
      } 
     } 
    }); 
)};

И формы с ненавязчивой проверки внутри (все они выглядят одинаково, Nothin специальные):

<div class="popUp-content"> 
<form method="post" id="magnific-form" action="/Hr/RefuseUserApplicationPopup">  <div class="section-header"> 
      <div class="title"> 
       <h3 class="semibold black"> 
        Отказать кандидату Высоцкая-Яблонович Анна Прохоровна 
        в должности Кассир 
       </h3> 
      </div> 
     </div> 
     <div class="form-block"> 
      <img src="http://localhost:56804/content/images/thumbs/0000033_140.jpeg" title="Высоцкая-Яблонович Анна Прохоровна" alt="Высоцкая-Яблонович Анна Прохоровна" class="over-hidden round border-green-14"> 
      <div class="form-block-field"> 
       <label title="" for="Comment">Причина</label> 
       <textarea rows="2" name="Comment" id="Comment" data-val-required="Введите комментарий" data-val="true" cols="20"></textarea> 
       <span data-valmsg-replace="true" data-valmsg-for="Comment" class="field-validation-valid"></span> 
      </div> 
     </div> 
     <input type="submit" value="Отказать" class="btn marg-top-20" name="save"> 
</form> 
</div>

И здесь представлены формы onsubmit-обработчика:

$(document).delegate('form', 'submit', function (event) { 
    var $form = $(this); 
    var id = $form.attr('id'); 
    var _data = $form.serialize(); 
    var _type = $form.attr('method'); 
    var _url = $form.attr('action'); 

    if (id == 'magnific-form') { 
     event.preventDefault(); 

     $.ajax({ 
      data: _data, 
      type: _type, 
      url: _url, 
      success: function (response) { 
       refreshPopUpContent(response); 
      } 
     }); 
    } 

}); 

function refreshPopUpContent(response) { 
    var magnificPopup = $.magnificPopup.instance; 
    magnificPopup.items[0].type = "inline"; 
    magnificPopup.items[0].src = response; 
    magnificPopup.updateItemHTML(); 

}

Таким образом, нажатие кнопки отправки должно вернуть форму и ошибки проверки через AJAX, если ModelState.IsValid == false. Да, но он работает только с первой ссылкой popUp в меню. Второй и все остальные получат GET-метод от контроллера сразу после POST, и нет никакой проверки.

источник

2014-07-25 Roman

Наконец, я изменил метод refreshPopUpContent на:

function refreshPopUpContent(response) { 
    var container = $('.popUp-content'); 
    container.html(response); 
}

Это заменит содержимое всплывающего окна с видом от контроллера и сообщения проверок видимы.

источник

2014-07-28 10:55:47 Roman

Значительное множественное всплывающее странное поведение

ответ

Смежные вопросы