How to clear the value of input id "price" and disable it when clicking on radio button id "meta_price_type_0" ,"meta_price_type_1",meta_price_type_2
<input id="price" type="text" name="price" value="200" >
<input type="radio" name="meta[4]" id="meta_price_type_0" value="Has Price Above0">
<input type="radio" name="meta[4]" id="meta_price_type_1" value="Has Price Above1">
<input type="radio" name="meta[4]" id="meta_price_type_2" value="Has Price Above2">
Try this :
$("#meta_price_type_0, #meta_price_type_1, #meta_price_type_3").click(function(){
$("#price").val("");
$("#price").attr("disabled", true);
OR (use either)
$("#price").prop("disabled", true);
});
input
.attr("disabled", true) will work on js less than 1.6
$("#price").attr("disabled", "disabled");, but it turns out that $("#price").attr("disabled", true); works aswellyou can do that on this way:
$('#meta_price_type_0, #meta_price_type_1, #meta_price_type_2').click(function(){
$('#price').val('').attr('disabled', 'true');
});
Or you can put a class in each input radio, this will allow you to work with a more understanding jquery and you can use other elements to do the same...
<input type="radio" name="meta[4]" value="Has Price Above0" class="clear-the-price">
<input type="radio" name="meta[4]" value="Has Price Above1" class="clear-the-price">
<input type="radio" name="meta[4]" value="Has Price Above2" class="clear-the-price">
And your jquery selector will be like:
$('input.clear-the-price').click(function(){
$('#price').val('').attr('disabled', 'true');
});
Here is a jsfiddle where you can se this script in action: http://jsfiddle.net/w9a8u4f2/
$( "input[type='radio'][name*='meta']" ).on( "click", function ( ) {
$( "#price" ).val( "" );
$( "#price" ).prop( "disabled", true );
});
$('input[type="radio"]').on('click',function(){
$("#price").val("").prop('disabled',true);
});
If you have other inputs with type="radio" you might wanna use the following code.
$('input[id*="meta_price_type_"]').on('click',function(){
$("#price").val("").prop('disabled',true);
});
id="price" is of type="text"
$("#meta_price_type_0").click(function(){ $('#price').val(''); });