Jquery untuk mengubah tindakan bentuk

118

Saya memiliki dua tombol dalam satu formulir dan dua halaman berbeda harus dipanggil saat diklik. ketika tombol1 diklik maka halaman1 harus dimuat dan ketika tombol2 diklik maka halaman2 harus dimuat. saya tahu bagaimana melakukan ini di javascript tetapi saya tidak tahu bagaimana melakukan ini di jquery. Adakah yang bisa membantu saya?

nikhil
sumber

Jawaban:

181

Coba ini:

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


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

jQuery hanyalah JavaScript, jangan berpikir terlalu berbeda tentangnya! Seperti yang akan Anda lakukan di JS 'normal', Anda menambahkan event listener ke tombol dan mengubah atribut aksi formulir. Di jQuery ini terlihat seperti:

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

Kode ini sama untuk tombol kedua, Anda hanya perlu mengubah id tombol Anda dan URI tempat formulir harus dikirim.

Edwin V.
sumber
20

Gunakan jQuery.attr()di handler klik Anda:

$("#myform").attr('action', 'page1.php');
Jesse Bunch
sumber
14

Demi variasi:

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

Silakan, lihat jawaban ini: https://stackoverflow.com/a/3863869/2096619

Mengutip Tamlyn :

jQuery (1.4.2) menjadi bingung jika Anda memiliki elemen bentuk bernama "aksi". Anda bisa menyiasatinya dengan menggunakan metode atribut DOM atau cukup hindari memiliki elemen formulir bernama "tindakan".

<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>
Fernando Vieira
sumber
8
$('#button1').click(function(){
$('#myform').prop('action', 'page1.php');
});
João Mello
sumber
0

Untuk mengubah nilai aksi formulir secara dinamis, Anda dapat mencoba kode di bawah ini:

kode di bawah ini adalah jika Anda membuka beberapa kotak dailog dan di dalam kotak dailog itu Anda memiliki formulir dan Anda ingin mengubah aksinya. Saya menggunakan kotak dailog Bootstrap dan pada pembukaan kotak dailog itu saya memberikan nilai tindakan ke formulir.

$('#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);
});

Jika Anda mencoba untuk mengubah tindakan formulir pada halaman biasa, gunakan kode di bawah ini

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