Can anyone help me how to make how to make a onchange event in input work after I searched in textbox.
My problem is: it's not working I tried the keydown
, blur
and the jquery but still it doesn't work on me I need your help guys.
html code:
<input onkeydown="updateTextboxes()" class="search_textbox" autocomplete="off" type="text" name="search" id="query" />
I tried using the jquery $('#query').change(updateTextboxes);
but it doesn't work :(
script code:
<script>
$(document).ready(function() {
var $funiq_id = $('#funiq_id'),
$t_region = $('#t_region'),
$t_town = $('#t_town'),
$t_uniq_id = $('#t_uniq_id'),
$t_position = $('#t_position'),
$t_salary_grade = $('#t_salary_grade'),
$t_salary = $('#t_salary');
function updateTextboxes() {
$.ajax({
url: "search.php",
type: "GET",
data: {term: $('#query').val()},
dataType: "JSON",
success: function(result) {
var ii = 1;
for (var i = 0; i < result.length; i++) {
$funiq_id.html(result[i].value).show();
$t_region.val(result[i].region).show().trigger('input');
$t_town.val(result[i].town).show().trigger('input');
$t_uniq_id.val(result[i].uniq_id).show().trigger('input');
$t_position.val(result[i].position).show().trigger('input');
$t_salary_grade.val(result[i].salary_grade).show().trigger('input');
$t_salary.val(result[i].salary).show().trigger('input');
$('#id' + ii + '').val(result[i].atid).show().trigger('input');
$('#aic' + ii + '').val(result[i].atic).show().trigger('input');
$('#name' + ii + '').val(result[i].atname).show().trigger('input');
$('#other_qual' + ii + '').val(result[i].other_sum).show().trigger('input');
$('#interview' + ii + '').val(result[i].interview_sum).show().trigger('input');
$('#optA' + ii + '').val(result[i].edu_attain2_sum).show().trigger('input');
$('#optB' + ii + '').val(result[i].experience2_sum).show().trigger('input');
$('#optC' + ii + '').val(result[i].trainings2_sum).show().trigger('input');
$('#optD' + ii + '').val(result[i].eligibility2_sum).show().trigger('input');
$('#total' + ii + '').val(result[i].final_total_sum).show().trigger('input');
$(':input').removeAttr('placeholder');
ii++;
}
}
});
};
$('.search_form_input').val('');
$('.search_textbox').val('');
$(".empty_batchcode").html("");
$('#execute').prop('disabled', true);
});
</script>
in your $(document).ready(function() {
try this:
var updateTextboxes = function () {[...]}
$('#query').change(updateTextboxes);
Your code:
<input onkeydown="updateTextboxes()" class="search_textbox" autocomplete="off" type="text" name="search" id="query" />
doesn't work because the function updateTextboxes
isn't in the main scope
You are getting a updateTextboxes() not defined error. Remove onkeydown="updateTextboxes()"
from your html code and add this to your jquery function:
$('.search_textbox').on('keydown', function(){
updateTextboxes()
})
here is the fiddle: http://jsfiddle.net/Su9Uv/
$('#query').on('change', updateTextboxes);
$('#query').on('input', updateTextboxes);
Listening for the "input" event will trigger any time the input is modified (Even on paste).
Note: The "Input" event should only be used if legacy browser support is not an issue.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.