2012-03-01 36 views
7

Thêm vào vấn đề của tôi tại đây - jQuery on submit validation, with modal dialog at the end?jQuery - biểu mẫu sẽ không gửi bằng cách sử dụng jQuery

Có vẻ như biểu mẫu đơn giản sẽ không gửi bằng jQuery. Đây là mã của tôi ở cấp độ rất đơn giản:

<script type="text/javascript"> 

    $(document).ready(function(){ 
     $(document).click(function() { 
      $('#inputform').submit(); 
     }); 

     $("#inputform").submit(function() { 
      alert('test'); 
      return true; 
     }); 
    }); 
</script> 

<form method="POST" action="<?php echo CURRENT_PAGE ?>" id="inputform"> 

<button type="submit" name="submit" id="submit">Submit form</button> 

</form> 

Nhấp vào cơ thể sẽ hiển thị cảnh báo 'thử nghiệm' nhưng không gửi biểu mẫu. Ngoài ra, khi đóng hộp cảnh báo, hộp thoại sẽ không xuất hiện lại khi bạn nhấp lại.

Chỉ cần nhấp vào nút gửi chính nó sẽ hiển thị cảnh báo sau đó gửi biểu mẫu như mong đợi.

Xin lỗi cho câu hỏi thực sự ngu ngốc, nhưng tôi đang thua lỗ ở đây. TY!

+0

xóa '$ (" # inputform "). Submit (function() {return true;});' – mgraph

+0

@ tj - xin lỗi! Tôi đã thử thêm nó vào nhưng nó vẫn rối tung với định dạng trên. @ mgraph - cảm ơn bạn, nhưng tôi có rất nhiều xác nhận trong đó –

Trả lời

22

Vấn đề là bạn đã cung cấp cho nút gửi của mình tên "gửi". Thay đổi nó thành bất kỳ thứ gì khác và nó sẽ hoạt động. (Cũng thay đổi id, tốt nhất để giữ chúng như nhau, không kém phần quan vì some browser issues.)

Tại sao: yếu tố Form có một tài sản gọi là submit đó là chức năng bạn có thể gọi đến trình. (jQuery sử dụng điều này dưới các nắp khi bạn gọi submit trên cá thể jQuery.) Nhưng các phần tử Form cũng nhận các thuộc tính cho từng trường trong biểu mẫu, sử dụng tên trường và vì vậy nếu bạn có một trường có tên là "submit" , nó ghi đè chức năng submit, có nghĩa là bạn không thể gửi biểu mẫu theo chương trình.

Ví dụ làm việc: Live copy | Live source

<script type="text/javascript"> 

    $(document).ready(function(){ 
     $(document).click(function() { 
      $('#inputform').submit(); 
     }); 

     $("#inputform").submit(function() { 
      alert('test'); 
      return true; 
     }); 
    }); 
</script> 

<form method="GET" action="http://jsbin.com/uwuzon" id="inputform"> 
<input type="text" name="foo" value="bar"> 
<button type="submit" name="someOtherName" id="someOtherName">Submit form</button> 
</form> 

(Sự thay đổi đáng kể là phần name="someOtherName" id="someOtherName" Những thay đổi khác [thay đổi hành động và phương pháp của hình thức] chỉ là để nó hoạt động trên JSbin..)

Side lưu ý: Bạn không cần phải return true; trong số submit trình xử lý sự kiện của bạn để cho phép gửi biểu mẫu. Bạn chỉ cần không phảireturn false;. :-)

+0

Điều này đang hoạt động hoàn hảo ngay bây giờ, cảm ơn bạn rất nhiều! Tôi không bao giờ biết có tên và id gửi sẽ gây ra rất nhiều vấn đề: $ –

+0

@xndx: :-) Thỏa thuận tốt, vui mừng đã giúp! –

+1

Vâng, tôi đã dành gần một giờ để sửa lỗi/tính năng này ... –

Các vấn đề liên quan