У меня есть три input
элемента. Если я нажму на два тега ввода, то третий тег автоматически отключится. Однако, когда я нажимаю кнопку в первый раз, она работает так, как я хотела, но когда я нажимаю второй раз, она не работает. Он отключает оставшиеся input
, даже если я нажал на один тег input
. Какие-нибудь решения?
// controling button
$('#secondbutton').unbind('click');
$('#secondbutton').click(function() {
$('#secondminvalue').prop("disabled", false);
$('#secondpriceinput').prop("disabled", false);
$('#secondpublication').prop("disabled", false);
});
//1st input
$('#secondminvalue').click(function() {
$('#secondpriceinput').click(function() {
$('#secondpublication').prop("disabled", true);
});
$('#secondpublication').click(function() {
$('#secondpriceinput').prop("disabled", true);
});
});
//2nd input
$('#secondpriceinput').click(function() {
$('#secondminvalue').click(function() {
$('#secondpublication').prop("disabled", true);
});
$('#secondpublication').click(function() {
$('#secondminvalue').prop("disabled", true);
});
});
//3rd input
$('#secondpublication').click(function() {
$('#secondminvalue').click(function() {
$('#secondpriceinput').prop("disabled", true);
});
$('#secondpriceinput').click(function() {
$('#secondminvalue').prop("disabled", true);
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="modal-body">
<div class="intraction-box">
<div class="container">
<div class="row">
<div class="col-lg-10 col-xs-10 text-center">
<div class="box">
<div class="box-text">
<label for="secondminvalue" id="secondminlabel" class="cols-sm-2 control-label">MIN NO OF BOOKS</label>
<div class="input-group">
<input type="text" class="form-control" name="catagory_id" id="secondminvalue" placeholder="Enter min no of books" />
</div>
<label for="secondpriceinput" id="secondlabel" class="cols-sm-2 control-label">SELECT MIN PRICE</label>
<div class="input-group">
<input type="text" class="form-control" name="catagory_id" id="secondpriceinput" placeholder="Enter min no of price" />
</div>
<label for="secondpublication" id="secondpublicationlabel" class="cols-sm-2 control-label">YEAR OF PUBLICATION</label>
<div class="input-group">
<input type="text" class="form-control" name="catagory_id" id="secondpublication" placeholder="Enter Year Of Publication" />
</div>
</div>
<div class="box-btn">
<button type="button" class="btn btn-info">SEARCH</button>
</div>
</div>
</div>
</div>
</div>
</div>