Включение/отключение Textbox в JQuery

Question

Я хочу, чтобы включить текстовое поле, когда первый переключатель проверяется & если второе, то я хочу, чтобы отключить текстовое поле вот мой код, который не работает, пожалуйста, помогите ..

<label class="radio-inline"> 
    <input type="radio" value="Y" name="IsLive" class="grey"> 
    YES 
</label> 
<label class="radio-inline"> 
    <input type="radio" value="N" name="IsLive" class="grey"> 
    NO 
</label> 

<label class="col-sm-2 control-label"> 
    Live Date 
</label> 
<div class="col-sm-3"> 
    <input type="text" id="LiveDate" name="LiveDate" class="form-control date-picker"> 
</div> 

$('input:radio[name="IsLive"]').change(function() { 
    if ($(this).is(':checked') && $(this).val() == 'Y') { 
     // append goes here 
     $("#LiveDate").show(); 
    } else { 
     $("#LiveDate").prop("disabled", true); 
    } 
}); 

Answer 1

Вы можете достичь этого, просто установив свойство disabled на основании того, является ли значение выбранной радиостанции Y. Попробуйте это:

$('input:radio[name="IsLive"]').change(function() { 
    $("#LiveDate").prop("disabled", this.value != 'Y'); 
}); 

Working example

Обратите внимание, что я удалил условие :checked, потому что это избыточно для радио-кнопки, чтобы поднять новую change события необходимо проверить элемент.

Answer 2

Попробуйте это:

$('input:radio[name="IsLive"]').change(function() { 
 
    var bool = $(this).val() !== 'Y'; 
 
    //$("#LiveDate").show(); 
 
    $("#LiveDate").prop("disabled", bool); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label class="radio-inline"> 
 
    <input type="radio" value="Y" name="IsLive" class="grey">YES 
 
</label> 
 
<label class="radio-inline"> 
 
    <input type="radio" value="N" name="IsLive" class="grey">NO 
 
</label> 
 

 
<label class="col-sm-2 control-label"> 
 
    Live Date 
 
</label> 
 
<div class="col-sm-3"> 
 
    <input type="text" id="LiveDate" name="LiveDate" class="form-control date-picker"> 
 
</div>

Answer 3

Изменить код JQuery:

$("input#LiveDate").prop('disabled', true); 
 
$('input:radio[name="IsLive"]').change(function() { 
 
    if ($(this).is(':checked') && $(this).val() == 'Y') { 
 
    // append goes here 
 
    $("input#LiveDate").prop('disabled', false); 
 
    } else { 
 
    $("input#LiveDate").prop('disabled', true); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label class="radio-inline"> 
 
    <input type="radio" value="Y" name="IsLive" class="grey"> YES 
 
</label> 
 
<label class="radio-inline"> 
 
    <input type="radio" value="N" name="IsLive" class="grey"> NO 
 
</label> 
 

 
<label class="col-sm-2 control-label"> 
 
    Live Date 
 
</label> 
 
<div class="col-sm-3"> 
 
    <input type="text" id="LiveDate" name="LiveDate" class="form-control date-picker"> 
 
</div>