CODEWITHSUNDEEP
javascriptjqueryhtml
Ahmed Tarek
Ahmed Tarek

Reputation: 43

How to disable radio input with certain values when choosing radio input with the same value

how can disable radio button with name "least1" if i checked radio with name "most1" with same value 

 <form action="{{route('questionnaire.action')}}" name="QuestionnaireForm" method="post" id="questionnaireEnglishForm">
    <input type="radio" name="most1" value="Trusting & believing in others">

    <input type="radio" name="least1" value="Trusting & believing in others">

    <input type="radio" name="most1" value="Satisfied, easy to please">

    <input type="radio" name="least1" value="Satisfied, easy to please">

    <input type="radio" name="most1" value="Clear">

    <input type="radio" name="least1" value="Clear">

    <input type="radio" name="most1" value="Calm & Peaceful">

    <input type="radio" name="least1" value="Calm & Peaceful">

    </form>

Upvotes: 4

Views: 46

Answers (1)

Mohamed-Yousef
Mohamed-Yousef

Reputation: 24001

In Jquery

[1] You can use change event for most1

[2] Use.filter() to filter least1 by value

[3] Use .prop('disabled' , true/false) to on/off the disabled property

[4] You may need .prop('checked' , false) to uncheck the least1 if it was checked

$('input[name="most1"]').on('change' , function(){
  var GetValue = $(this).val();
  $('[name="least1"]').prop('disabled' , false).filter(function(){
    return $(this).val() == GetValue;
  }).prop('disabled' , true).prop('checked' , false);
});

var i = 12;
console.log('[name="least' + i + '"]');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="{{route('questionnaire.action')}}" name="QuestionnaireForm" method="post" id="questionnaireEnglishForm">
  <input type="radio" name="most1" value="Trusting & believing in others">

  <input type="radio" name="least1" value="Trusting & believing in others">

  <input type="radio" name="most1" value="Satisfied, easy to please">

  <input type="radio" name="least1" value="Satisfied, easy to please">

  <input type="radio" name="most1" value="Clear">

  <input type="radio" name="least1" value="Clear">

  <input type="radio" name="most1" value="Calm & Peaceful">

  <input type="radio" name="least1" value="Calm & Peaceful">

</form>

To concatenate the string in javascript $('[name="least' + i + '"]') .. You can see the snippet above

Upvotes: 2

Related Questions