Reputation: 276
Let say i got input text and dropdown option. As default the dropdown is disabled and input is enabled. So employee id input is playing a role as validate the value that have been key in. Actually the employee id input is where user scan their employeed id where the lenght is equal to 6 and the drowpdown will be enabled. Another method to bypass the scanning the employee id, certain employee will key in specific Keywords at the input for example "KYXY", and by insert the keyword they able to key in the input employee id manually and once employee id input manually length==6 and the dropdown will enabled.. For me this abit tricky.
<input type="text" id="myContent" class="form-control" value="" placeholder="Staff ID">
<select class="form-control" id="dropdownss" disabled="" value="Disabled value">
<option>Select Shift</option>
<option>A</option>
<option>B</option>
<option>C</option>
</select>
So here is my jquery
$('document').ready(function() {
$('#myContent').keyup('input',function(){
var a = "KYXY";
var myNumber = this.value;
if(myNumber == a)
{
$('#dropdownss').prop( "disabled", false );
$('#myContent').val('');
var userlog="1";
if($(this).val().length == 6)
{
if(userlog == "1")
{
//alert("Yay");
$('#myContent').val('');
$('#myContent').focus();
$('#dropdownss').prop( "disabled", false );
}
else
{
$('#dropdownss').prop( "disabled", true );
}
}
}
else if(myNumber !== a)
{
alert("scan only");
$('#myContent').val('');
$('#myContent').focus();
}
});
});
Upvotes: 0
Views: 317
Reputation: 18393
Probably something like this:
$('document').ready(function() {
$('#myContent').on('input', function() {
var a = "KYXY";
var input = $(this);
var num = input.val();
if (num.length === 6 && !/\D/.test(num)) {
$('#dropdownss').prop("disabled", false);
input.prop('manual', false).val('');
}
else if (input.prop('manual') || ~a.indexOf(num)) {
if (a !== input.val()) return;
input.prop('manual', true).val('');
} else {
alert("scan only");
$('#dropdownss').prop("disabled", true);
$('#myContent').val('');
$('#myContent').focus();
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="myContent" class="form-control" value="" placeholder="Staff ID">
<select class="form-control" id="dropdownss" disabled="" value="Disabled value">
<option>Select Shift</option>
<option>A</option>
<option>B</option>
<option>C</option>
</select>
Upvotes: 1
Reputation: 23
I had to rewrite a big part of your jQuery code. But this should work.
$('document').ready(function() {
var myContent = $('#myContent');
var dropdown = $('#dropdownss');
myContent.on('keyup', function() {
var a = "KYXY";
var myNumber = $(this).val();
if (myNumber == a) {
dropdown.removeAttr("disabled");
myContent.val('');
var userlog = "1";
if ($(this).val().length == 6) {
if (userlog == "1") {
// Alert("Yay");
myContent.val('');
myContent.focus();
dropdown.removeAttr('disabled');
} else {
dropdown.attr('disabled', 'disabled');
}
}
} else if (myNumber.length >= 6 && myNumber != a) {
alert("Scan only");
myContent.val('');
myContent.focus();
}
});
});
Upvotes: 0