양식 작업을 변경하는 Jquery

양식에 두 개의 단추가 있고 클릭 할 때 두 개의 다른 페이지를 호출해야합니다. button1을 클릭하면 page1을로드해야하고 button2를 클릭하면 page2를로드해야합니다. 나는 자바 스크립트에서 이것을하는 방법을 알고 있지만 jquery에서 이것을하는 방법에 대한 단서가 없습니다.

이 시도:

$('#button1').click(function(){
   $('#formId').attr('action', 'page1');
});


$('#button2').click(function(){
   $('#formId').attr('action', 'page2');
});

jQuery는 자바 스크립트 일 뿐이므로 크게 다르게 생각하지 마세요! '일반'JS에서와 마찬가지로 버튼에 이벤트 리스너를 추가하고 양식의 작업 속성을 변경합니다. jQuery에서 이것은 다음과 같습니다.

$('#button1').click(function(){
   $('#your_form').attr('action', 'http://uri-for-button1.com');
});

이 코드는 두 번째 버튼의 경우와 동일하며 버튼의 ID와 양식을 제출해야하는 URI 만 변경하면됩니다.

jQuery.attr()클릭 핸들러에서 사용 :

$("#myform").attr('action', 'page1.php');

다양성을 위해 :

var actions = {input1: "action1.php", input2: "action2.php"};
$("#input1, #input2").click(function() {
    $(this).closest("form").attr("action", actions[this.id]);
});

이 답변을 참조하십시오. https://stackoverflow.com/a/3863869/2096619

Tamlyn 인용 :

jQuery (1.4.2)는 "action"이라는 양식 요소가있는 경우 혼동됩니다. DOM 속성 메소드를 사용하여이 문제를 해결하거나 "action"이라는 양식 요소를 피할 수 있습니다.

<form action="foo">
  <button name="action" value="bar">Go</button>
</form>

<script type="text/javascript">
  $('form').attr('action', 'baz'); //this fails silently
  $('form').get(0).setAttribute('action', 'baz'); //this works
</script>

$('#button1').click(function(){
$('#myform').prop('action', 'page1.php');
});

양식의 동작 값을 동적으로 변경하려면 아래 코드를 시도해 볼 수 있습니다.

아래 코드는 dailog 상자를 열고 해당 dailog 상자 안에 양식이 있고 작업을 변경하려는 경우입니다. 나는 Bootstrap dailog box를 사용했고 그 dailog box를 열 때 폼에 액션 값을 할당하고 있습니다.

$('#your-dailog-id').on('show.bs.modal', function (event) {
    var link = $(event.relatedTarget);// Link that triggered the modal
    var cURL= link.data('url');// Extract info from data-* attributes
    $("#delUserform").attr("action", cURL);
});

일반 페이지에서 양식 작업을 변경하려는 경우 아래 코드를 사용하십시오.

$("#yourElementId").change(function() { 
  var action = <generate_action>;
  $("#formId").attr("action", action);
});