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?

Jawaban:


181

Coba ini:

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


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

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.


20

Gunakan jQuery.attr()di handler klik Anda:

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

14

Demi variasi:

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

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>

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

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);
});
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.