Shermaine Chaingan Shermaine Chaingan - 4 months ago 22
jQuery Question

Disable textbox when two textbox is equal

How can i disable textbox when selected (textbox name) and quantity (textbox name) is equal. i used this codes its working but when selected (textbox name) is equal to 3 the txtCombo (textbox name) is not disabled but when equal to 4 it became disabled how should i work on this ? thank you in advance.



// disable button if equal
// $('#button').click(function(){
$('#button').click(function() {
var firstValue = $("#quantitytotransfer").val();
var secondValue = $("#selected").val();
if ((firstValue == secondValue)) {
$("#txtCombo").prop("disabled", true);
}
});

function addCombo() {

var textb = document.getElementById("txtCombo");
var combo = document.getElementById("combo");
var option = document.createElement("option");
option.text = textb.value.trim();
option.value = textb.value.trim();
option.selected = true;

if ($('#combo option[value="' + textb.value.trim() + '"]').text() == textb.value.trim()) {
alert("Duplicate found or you entered empty value");
return false;
}
try {
combo.add(option, null); //Standard
} catch (error) {
combo.add(option); // IE only
}
textb.value = "";
}



$("#txtCombo").on("keydown", function(e) {
return e.which !== 32;
});




$(document).ready(function() {

$('#button').click(function() {

var data = [];
$.each($("#combo option:selected"), function() {
data.push($(this).attr("value"));

});
$('#imei').val(data.join(","));;
var count = $("#combo :selected").length;
$('#selected').val(count);


});

});


$(document).ready(function() {

$('#button').click(function() {

var data = [];
$.each($("#combo option:selected"), function() {
data.push($(this).attr("value"));

});
$('#imei').val(data.join(","));;
var count = $("#combo :selected").length;
$('#selected').val(count);


});

});


$("#combo").on('change', function() {

var count = $("#combo :selected").length;
$('#selected').val(count);


});
var text = $("#text").val();

var previousOption;
$('select[name=combo] option').each(function() {
if (this.text == previousOption) $(this).remove();
previousOption = this.text;
});



// separated by comma to textbox
$(document).ready(function() {

$("#combo").change(function() {
var data = [];
$.each($("#combo option:selected"), function() {
data.push($(this).attr("value"));
});
$('#imei').val(data.join(","));;

});

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<BODY style="font-family: sans-serif">

<fieldset>
<legend>Combo box</legend>
Add to Combo:
<input type="text" name="txtCombo" id="txtCombo" />Selected:
<input type="text" name="selected" id="selected" />IMEI Selected:
<input type="text" name="imei" id="imei" />Quantity:
<input type="text" name="quantity" value="3" id="quantitytotransfer" />
<br>

<input type="button" id="button" value="Add" onclick="addCombo()">
<br/>Combobox:
<select name="combo" multiple id="combo"></select>
</fieldset>
</BODY>




Answer

You can achieve this easily :

function checkIfEqual(){
    if($("#selected").val() === $("#quantitytotransfer").val())
        $("#txtCombo").prop("disabled", true);
    else
        $("#txtCombo").prop("disabled", false);
}

$("#button").click(function(){
    $("#selected").val($("#combo option:selected").length);
    checkIfEqual();
});

demo here