I have a lottery search form which concatenate six input fields into a single value and returns the results based on the position. My form works correctly for numbers 1-9, but it is unable to display results when I search for 0.
How can I amend my search search to display 0?
$(function() {
$("#target input").keyup(function() {
if ($(this).val().length == 1) {
$(this).nextAll('input').first().focus();
} else if ($(this).val().length > 1) {
var new_val = $(this).val().substring(1, 2);
$(this).val(new_val);
}
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<form id="target">
<input type="number" id="keyword_1" maxlength="1" min="0" max="9" style="width: 35px !important; etter-spacing: 1.5px;">
<input type="number" id="keyword_2" maxlength="1" min="0" max="9" name="keyword_2" style="width: 35px !important; etter-spacing: 1.5px;">
<input type="number" id="keyword_3" maxlength="1" min="0" max="9" name="keyword_3" style="width: 35px !important; etter-spacing: 1.5px;">
<input type="number" id="keyword_4" maxlength="1" min="0" max="9" name="keyword_4" style="width: 35px !important; etter-spacing: 1.5px;">
<input type="number" id="keyword_5" maxlength="1" min="0" max="9" name="keyword_5" style="width: 35px !important; etter-spacing: 1.5px;">
<input type="number" id="keyword_6" maxlength="1" min="0" max="9" name="keyword_6" style="width: 35px !important; etter-spacing: 1.5px;">
<button class="btn btn-info" id="search-ticket" type="submit">Search</button>
</form> $( "#target" ).submit(function( event ) {
event.preventDefault();
$.post('<?php echo admin_url('admin-ajax.php'); ?>',{'action':'get_numbers', 'n_1':$('#keyword_1').val(), 'n_2':$('#keyword_2').val(), 'n_3':$('#keyword_3').val(), 'n_4':$('#keyword_4').val(), 'n_5':$('#keyword_5').val(), 'n_6':$('#keyword_6').val()},
function(response){
$('#datafetch').html(response.data.tickets_data);
init();
});
});
});