Tự động hoàn thành JQuery: Gửi biểu mẫu trên lựa chọn?

Question

Sử dụng Tự động điền JQuery trên biểu mẫu HTML truyền thống.

Thử gửi biểu mẫu (cách cũ) khi lựa chọn được thực hiện.

Nhưng hộp nhập liệu được điền và sau đó tôi phải bấm "trả lại" lần thứ 2 hoặc nhấp vào nút gửi.

Tôi đã thử một vài ví dụ SO, nhưng tôi không thể khiến chúng hoạt động.

Bạn tự động gửi biểu mẫu khi lựa chọn được thực hiện như thế nào?

Answer 1

CẬP NHẬT: Cuối cùng tôi đã tìm ra điều này, mã bên dưới sẽ thực hiện thủ thuật. Vì một số lý do, gọi lại change không hoạt động nhưng số gọi lại close & select. Sử dụng select tốt hơn, vì close cũng sẽ được gọi nếu trường mất tiêu điểm.

$(function() { 
    $("#searchField").autocomplete({ 
     source: "values.json", 
     select: function(event, ui) { 
      $("#searchForm").submit(); } 
    }); 
}); 

KHÁC UPDATE: Ok, cũng có một vấn đề với select gọi lại, mà là theo mặc định (trong đoạn code trên) nếu bạn đi qua autocomplete thả xuống với bàn phím và chọn với nhập khóa, đầu vào được thay đổi trước khi biểu mẫu được gửi. Tuy nhiên, nếu bạn chọn nó bằng chuột, biểu mẫu được gửi ngay trước khi đầu vào được thay đổi, do đó giá trị được gửi chỉ là những gì người dùng đã nhập (không phải những gì cô đã chọn từ menu thả xuống tự động hoàn tất). Các woraround điều đó dường như làm việc là:

$("#searchField").autocomplete({ 
    source: "values.json", 
    minLength: 2, 
    select: function(event, ui) { 
     $("#searchField").val(ui.item.label); 
     $("#searchForm").submit(); } 
}); 

Answer 2

$("#searchField").result(function(event, data, formatted) { 
    $(this).closest("form").submit(); 
}); 

các searchField đã được dân cư với các lĩnh vực được lựa chọn, vì vậy không cần thiết phải làm điều đó trong chức năng này một lần nữa.

tài liệu chính thức: http://docs.jquery.com/Plugins/Autocomplete/result#handler

Answer 3

Tôi không thể bình luận về câu trả lời bằng @handsofaten vì vậy tôi sẽ thêm vào câu trả lời của mình ở đây. Việc sử dụng giá trị thay vì nhãn như trong một số trường hợp, trường hợp của tôi, nhãn không phải là những gì người dùng muốn tìm kiếm cơ sở dữ liệu.

$("#searchField").autocomplete({ 
source: "values.json", 
minLength: 2, 
select: function(event, ui) { 
    $("#searchField").val(ui.item.value); 
    $("#searchForm").submit(); } 
}); 

Answer 4

select: function(event, ui) { 

      if(ui.item){ 

      $(event.target).val(ui.item.value); 

    } 

      $(event.target.form).submit(); 

        }); 

Answer 5

Bạn nộp bạn chọn đệ bằng cách gọi vào nút Submit ID trong lĩnh vực này, ngay cả khi đang ở trang khác nữa.

document.getElementById('submit').click();