Thu Oct 2020 1 year ago

Vue JS Checked Radio Button Value pada Onchange Event

Saya akan menunjukkan cara mendapatkan value tombol radio yang dipilih menggunakan event onchange di vue js. saya akan memberikan contoh sederhana untuk mendapatkan diperiksa value tombol radio vue js.

kita bisa dengan mudah mendapatkan value teks yang dipilih dari tombol radio di vue js. di bawah ini saya berikan contoh lengkap untuk mendapatkan teks dan value tombol radio yang dipilih di vuejs.

Dalam contoh ini, kami akan mengambil tombol radio sederhana dengan beberapa opsi seperti laravel, php, codeigniter, dll saat Anda memilihnya. kita akan mendapatkan teks tombol radio yang dipilih dan value menggunakan pada value event onchange vue js.

Contoh:

<!DOCTYPE html>
<html>
<head>
    <title>Vue JS Get Checked Radio Button Value on Onchange Event - Medikre.com</title>
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
</head>
<body>
    
<div id="app">
  
  <label><input type="radio" name="category_id" @change="onChange($event)" class="form-control" value="1"> Laravel</label>
  <label><input type="radio" name="category_id" @change="onChange($event)" class="form-control" value="2"> Codeigniter</label>
  <label><input type="radio" name="category_id" @change="onChange($event)" class="form-control" value="3"> Vue JS</label>
    
</div>
    
<script type="text/javascript">
    
    var app = new Vue({
      el: '#app',
      methods: {
          onChange(event) {
              var optionText = event.target.value;
              console.log(optionText);
          }
      }
    })
    
</script>
     
</body>
</html>

Saya harap ini dapat membantu Anda ...

checked radio button in vue js vue js