1

What I am trying to do is when $('input:radio[name="NeverWornRespbefore"]') is selected, I want to remove the required attribute from the radio group $('input:radio[name="eyeIrritation"]').

My question: How come the .removeAttr('required') or any other of the commented sections in the code won't remove the required tag? How do i get this to work?

Thank you.

<script>
//If user presses number 8 these radios don't have to be required
jQuery(document).ready(function () {

    $('input:radio[name="NeverWornRespbefore"]').change(function () {
        if ($(this).val() == 'Yes Never Worn one before') {

            console.log("triggered");
            //$('input:radio[name="eyeIrritation"]').removeAttr('required');​​​​​
            //$('.eyeIrritation').each().attr("required", "false");
            $('.eyeIrritation').removeAttr('required');
            console.log($('input#eyeIrritation'));
        }
    });

});

HERE is my cshtml:

<tr>
                    <td><label class="col-xs-12 col-sm-6 col-md-8 control-label" for="employeeName">8. If you've used a respirator, have you ever had any of the following problems? </label><be><label class="col-xs-12 col-sm-6 col-md-8 control-label" for="employeeName">(If you've never used a respirator, check the following checkbox @Html.RadioButtonFor(m => m.NeverWornRespbefore, "Yes Never Worn one before", new { Value = "Yes Never Worn one before" }) and go to question 9)</label></td>
                    <td>Yes</td>
                    <td>No</td>
                </tr>
                <tr>
                    <td><label class="col-xs-12 col-sm-6 col-md-8 control-label" for="employeeName">a. eye irritation:</label></td>
                    <td>@Html.RadioButtonFor(m => m.eyeIrritation, "Yes", new {  Value = "YES" , required = "true"})</td>
                    <td>@Html.RadioButtonFor(m => m.eyeIrritation, "No", new { Value = "NO"  , required = "true"})</td>
                </tr>

HERE IS MY COMPLETED CODE With ANSWER found from COMMENTS

<script>
//If user presses number 8 these radios don't have to be required
jQuery(document).ready(function () {

    $('input:radio[name="NeverWornRespbefore"]').change(function () {
        if ($(this).val() == 'Yes Never Worn one before') {

            console.log("Number never worn resp triggered");

            $('input[name="eyeIrritation"]').removeAttr('required');
        }
    });

});

I had the wrong selector for the radio group.

akasoggybunz
  • 344
  • 7
  • 21
  • `$('input:radio[name="eyeIrritation"]')` or `$('.eyeIrritation')` - could you share your HTML please? – Dhruv Saxena Jan 31 '17 at 17:36
  • 4
    Possible duplicate of [How to set HTML5 required attribute in Javascript?](http://stackoverflow.com/questions/18770369/how-to-set-html5-required-attribute-in-javascript) – Pineda Jan 31 '17 at 17:36
  • This should answer your question: http://stackoverflow.com/a/18774169/2902660 – Pineda Jan 31 '17 at 17:37
  • 1
    Try `$('input[name="eyeIrritation"]').removeAttr('required');` – Developer Jan 31 '17 at 17:43
  • @Developer, thank you that worked. I guess i had the Selector wrong. – akasoggybunz Jan 31 '17 at 18:01
  • You code for `@Html.RadioButtonFor()` simply makes no sense. First the 2nd parameter sets the `value` attribute so its generating `value="Yes"` and `value="No"` respectively, so `new { Value = "YES" }` is pointless. And why in the world are you adding `new { required = "true" }`? –  Jan 31 '17 at 22:50

2 Answers2

4

Your selector is wrong. Try $('input[name="eyeIrritation"]').removeAttr('required');

Developer
  • 6,240
  • 3
  • 18
  • 24
1

How about

.prop('required', false);
beta-developper
  • 1,689
  • 1
  • 13
  • 24