2012-04-24 11 views
1

У меня есть форма, которая должна быть проверена перед отправкой, POST во всплывающее окно, после чего форма должна быть сброшена позже.Target ajaxSubmit во всплывающем окне

Я знаю, что атрибуты формы работают, но это не позволяет мне ничего делать после отправки.

Я знаю, что я могу использовать $('form').ajaxSubmit(), чтобы указать функцию after-submit, но, похоже, я не открываю новое окно.

Как я могу сделать все это сразу?

Это моя форма:

<form id="myForm" target="newWindow" autocomplete="on" action="/myUrl" method="post"> 

Это мой JavaScript:

$('#myForm').submit(function(e) { 
    e.preventDefault(); 
    if ($('#myForm').valid()) { 
     var options = { 
      target: '', 
      beforeSubmit: function() { 
       this.target = "newWindow"; 
       window.open("", "newWindow", "width=500,height=450"); 
      }, 
      success: function() { 
       hideForm(); 
       $('#myForm').resetForm(); 
      } 
     }; 

     $(this).ajaxSubmit(options); 
    } 
    return false; 
} 

ответ

2

Вот решение, я в конечном итоге происходит с этим было гораздо более элегантно.

<form id="myForm" target="newWindow" autocomplete="on" action="/myUrl" method="post"> 

И тогда JS:

$('#myForm').submit(function(e) { 
    if ($(this).valid()) { 
     var f = this; 
     window.open("",$(this).attr("target"),"width=500,height=500"); 
     setTimeout(function() { // delay resetting the form until after submit 
      hideForm(); 
      f.reset(); 
     }, 0); 
     return true; 
    } 
    else { 
     e.preventDefault(); // only prevent default if the form is not valid 
    } 
    return false; 
}); 

Таким образом, новое окно будет отображаться только если форма является действительным.

1

Вы получили правильную идею, используя атрибут target в вашем виде тега. Это автоматически отправит форму в окно с именем «newWindow». (Для того, чтобы всегда представить в новом окне используйте target="_blank".)

Беда в том, вы предотвращение форму от их представления в этом новом окне, а затем с помощью JavaScript, чтобы выполнить команду Аякса представить. Если вы удалите этот дополнительный код, вы получите то, что вы хотите:

$('#myForm').submit(function(e) { 
    if ($(this).valid()) { 
     var f = this; 
     setTimeout(function() { // delay resetting the form until after submit 
      hideForm(); 
      f.reset(); 
     }, 0); 
    } 
    else { 
     e.preventDefault(); // only prevent default if the form is not valid 
    } 
}); 

Работа демо:http://jsfiddle.net/2x6wL/

+0

Это сработало, спасибо! – Kay

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