opadabae

Auto Reqiured Based On Radio Button

Nov 11th, 2023
1,104
0
Never
1
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
PHP 0.72 KB | None | 0 0
  1. Bagaimana caranya agar ketika pilih option 1 text boxnya menjadi reqired dan jika option 2 requirednya off,
  2.  
  3. Sudah nyoba kya gini tpi keduanya tetap aktif required.
  4. <script type="text/javascript" src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
  5. <form method="post" action="">
  6. <input type="radio" name="option" value="option1" onclick="toggleTextBox(this)"> Option 1
  7. <input type="radio" name="option" value="option2" > Option 2
  8.  
  9. <input type="text" placeholder="Setting auto required berdasarkan radio 1" id="myTextBox">
  10.  
  11. </form>
  12. <script type="text/javascript">
  13.     function toggleTextBox(radioButton) {
  14.   var textBox = document.getElementById("myTextBox");
  15.   textBox.required = radioButton.checked;
  16. }
  17. </script>
Advertisement
Comments
  • opadabae
    2 years
    # text 1.34 KB | 0 0
    1. Sudah berhasil dengan cara seperti di bawah ini, terima kasih guys.
    2.  
    3.  
    4. <script type="text/javascript" src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    5. <form method="post" action="" onSubmit="return validateForm(this)">
    6. <input type="radio" onclick="setJumlahBayar()" name="option" value="Cash" > Cash
    7. <input type="radio" onclick="setJumlahBayar()" name="option" value="Transfer" > Transfer
    8.  
    9. <input type="text" name="bayar" id="bayar">
    10. <input type="submit" name="save" id="save" value="save">
    11. </form>
    12. <script language="javascript">
    13. function validateForm() {
    14. var bayar = document.querySelector('input[name="bayar"]');
    15. var jenisBayar = document.querySelector('input[name="option"]:checked');
    16.  
    17. if (bayar.value === '' && jenisBayar.value === 'Cash') {
    18. alert("Anda belum mengisikan Jumlah bayar");
    19. bayar.focus();
    20. return false;
    21. }
    22.  
    23. return true;
    24. }
    25.  
    26. document.querySelector('form').addEventListener('submit', function() {
    27. return validateForm();
    28. });
    29.  
    30.  
    31. function setJumlahBayar() {
    32. var jenisBayar = document.querySelector('input[name="option"]:checked');
    33. var data = {
    34. "Cash":'' ,
    35. "Transfer": '0'
    36.  
    37. };
    38.  
    39. document.querySelector('input[name="bayar"]').value = data[jenisBayar.value];
    40. }
    41.  
    42. document.querySelector('input[name="option"]').addEventListener('change', setJumlahBayar);
    43. </script>
    44.  
Add Comment
Please, Sign In to add comment