드롭 다운 목록 양식 ... 버튼없이 작업을 트리거하는 방법은 무엇입니까?

Question

<form id="form1" name="form1" method="post" action="foo.php"> 

    sort by: 
    <select> 
    <option name="date">sort by date</option> 
    <option name="name">sort by name</option> 
    <option name="price">sort by price</option> 
    </select> 

</form> 

내가 원하는 것은 옵션을 선택하면 양식의 동작이 자동으로 실행된다는 것입니다. 그래서 짧게 말해서 은 $ _POST를 통해 foo.php로 보내질 것입니다. 나는 액션을 실행시키기 위해 입력 버튼을 원하지 않는다.

이 작업을 수행하려면 자바 스크립트가 필요합니까? 이렇게하려면 코드를 보여 주시겠습니까? 자바 스크립트가 필요한 경우

Answer 1

자바 스크립트가 필요합니다.

<select onChange="document.forms['form1'].submit();"> 

당신은 change 이벤트에 이벤트 핸들러를 첨부하고 양식을 제출이 :

당신이 unobtrusive javascript를 사용해야하지만은 기본 코드가 같이 보입니다.

Answer 2

이것은 자바 스크립트가 필요하지만 jQuery를 사용하고 싶다면 정말 쉽습니다. jQuery로는 다음과 같습니다

$('#form1 select').on('change', function() { 
    $('#form1').submit(); 
}); 

자바 스크립트에서 당신은 select 요소의 OnChange 이벤트를 바인딩합니다. 이를 수행하는 한 가지 방법은 다음과 같습니다.

<select onChange="document.form1.submit()"> 

Answer 3

가장 간단한 방법은 select 요소를 사용하여 javascript를 똑바로 사용하는 것입니다. 이벤트는 onChange입니다.

<select onchange="javascript:document.form1.submit();"> 

jQuery 기반 양식을 사용할 수도 있습니다. http://jquery.com/에서 jQuery javascript를 다운로드하여 HTML에 포함하십시오.

<select id="sort"> 

을 그리고, 내부는 : 그 후, 사용

그는 아무튼

$(document).ready(function(){ 
      $("#sort").change(function() { 
        $(this).parent().submit(); 
      }); 
});