2010-10-26 31 views
10

Tôi làm cách nào để tạo thẻ trong IE7 gửi biểu mẫu, đồng thời thực hiện tất cả xác thực biểu mẫu được thiết lập trên biểu mẫu?IE7 - <button> không gửi biểu mẫu

nếu tôi chỉ thực hiện document.forms[0].submit(); nó gửi, nhưng bỏ qua xác thực biểu mẫu.

Sửa: Mọi người đều thích nói cho tôi để sử dụng thẻ đầu vào ... Điều đó sẽ tiến hành với hình thức nhưng công việc sẽ không ở hoàn cảnh của tôi đó là lý do tôi hỏi về thẻ nút ...

<form action="my/script" onsubmit="return ValidateFunc();"> 
<button> <img src="image/do_this_with_input_tag.png"> Some Text </button> 
</form> 
+0

Bạn đang sử dụng '

+0

Không, Không gửi. – Justin808

+0

@Nick Craver: Nếu bộ nhớ của tôi phục vụ cho tôi chính xác đó là loại mặc định trong IE, nhưng không phải là các trình duyệt khác. – some

Trả lời

1

Tôi đã sử dụng jquery để gửi nút. Nếu tôi sử dụng javascript thẳng nếu bỏ qua các thiết lập xác nhận. Việc gửi biểu mẫu của Jquery chạy xác thực trước khi gửi.

Sau khi nghiên cứu thêm, thẻ, ngay cả với loại = "gửi" không thể gửi biểu mẫu trong phiên bản cũ hơn của IE.

+3

Tôi đã thử nghiệm loại = "gửi" trên ie7, dường như gửi mẫu đơn cho tôi. – Geekfish

1

Tôi đoán rằng Xác thực chỉ nhận ra sự kiện "gửi" từ nút "gửi".

Bạn nên sử dụng đầu vào "gửi" thay vì đầu vào "nút". Sau đó, cơ chế xác nhận sẽ có thể chặn sự kiện gửi. bạn có thể gọi form.submit trong hàm validation.submit.

Dưới đây là các mã:

<form id="theForm"> 
    ... 
    <input type="submit" value="submitMe"/> 
</form> 

trong Javascript:

$('#theForm').validate({ 
    ... 
    submitHandler: function() { 
     // do some trick here 
     ... 
     // submit the form 
     $('#theForm').submit(); 
    } 
}); 
9

Đầu tiên có một nút có gửi loại như

<input type="submit" value="submit" /> 

Ở thẻ mẫu của bạn, bao gồm các onsubmit() sự kiện dưới dạng

<form 
    action="/path/to/server/side/script" 
    name="testform" 
    onsubmit="return validate()" 
    > 

Chức năng validate() phải trả lại true nếu xác thực biểu mẫu đi qua hoặc false nếu xác thực không thành công. ví dụ:

function validate(){ 
    if(...){//valid 
     return true;  
    }else{//not valid 
     return false; 
    }  
} 

EDIT: Luôn xác định loại nút. Nếu không được chỉ định, trong IE nó mặc định là "nút" trong khi trong Chrome và Firefox nó mặc định là "gửi".

<form action="my/script" onsubmit="return ValidateFunc();"> 
<button type="submit"> <img src="image/do_this_with_input_tag.png"> Some Text </button> 
</form> 

Và trong tương lai, hãy bao gồm thêm chi tiết trong câu hỏi của bạn nếu bạn muốn câu trả lời thích hợp.

+0

Đây chính xác là cách mọi thứ hoạt động, với thẻ INPUT, không quá nhiều với thẻ BUTTON. – Justin808

+0

Tôi đã chỉnh sửa câu trả lời, kiểm tra nó ra –

+0

Tôi sẽ thử thuộc tính type = "submit" một lần nữa khi tôi quay lại văn phòng. – Justin808

0

Tôi đang sử dụng (dummy/không nhìn thấy được) lĩnh vực đầu vào bên trong hình thức vị trí tuyệt đối với css này:

<input class="dummy" type="submit" /> 

.dummy { 
    position:absolute; 
    bottom:0px; 
    right:0px; 
    padding:0px; 
    margin:0px; 
    border:0px; 
    font-size:0px; 
    line-height:0px; 
} 

Chỉ cần tránh sử dụng display: none hoặc visibility: hidden hoặc width: 0px vv Sử dụng chỉ này css tôi đã cung cấp.

2

Tôi đã giải quyết điều này đơn giản bằng cách thêm type="submit" vào nút.

<button>Submit</button> không được gửi trong IE7.

<button type="submit">Submit</button> gửi trong IE7.

0

tôi đã cùng một vấn đề với IE11 với một nút gửi bên trong một hình thức khác:

<form id="form1"> 
    ... 
</form> 
<form id="form2"> 
    ... 
    <button type="submit" form="form1">OLA KE ASE</button> 
    ... 
</form> 

Bạn có thể giải quyết nó usign javascript, tôi đã làm nó với jQuery trên một cách chung chung.

$(document).ready(function() { 
    $('button[type=submit]').on('click', function() { 
     if ($(this).attr('form') != '') { 
      document.getElementById($(this).attr('form')).submit(); 
     } 
    }); 
});