[英]Ajax call not working with onclick
function open_appointment(id)
{
save_method = 'open_appointment';
$('#form_open_appointment')[0].reset(); // reset form on modals
$('.form-group').removeClass('has-error'); // clear error class
$('.help-block').empty(); // clear error string
//Ajax Load data from ajax
$.ajax({
url : "<?php echo site_url('ReceptionistController/ajax_edit_appointment')?>/" + id,
type: "GET",
dataType: "JSON",
success: function(data)
{
$.ajax({
url : "<?php echo site_url('ReceptionistController/ajax_edit_patient')?>/" +data.ap_patient,
type: "GET",
dataType: "JSON",
success: function(data)
{
$('[name="pt_id"]').val(data.pt_id);
$('[name="pt_name"]').val(data.pt_name);
$('[name="pt_dob"]').val(data.pt_dob);
$('[name="pt_sex"]').val(data.pt_sex);
$('[name="pt_contact"]').val(data.pt_contact);
$('[name="pt_email"]').val(data.pt_email);
$('[name="pt_address"]').val(data.pt_address);
id=parseInt(id);
var next_id=id+1;
var previous_id=id-1;
//button to call back the function with next id
$('#next_patient').click(function() {
alert("next"+next_id);
open_appointment(next_id);
});
//button to call back the function with previous id
$('#previous_patient').click(function() {
alert("next"+next_id);
open_appointment(previous_id);
});
},
error: function (jqXHR, textStatus, errorThrown)
{
alert('Failed');
}
});
$('#modal_open_appointment').modal('show'); // show bootstrap modal when complete loaded
$('.modal-title').text('Open Appointment'); // Set title to Bootstrap modal title
},
error: function (jqXHR, textStatus, errorThrown)
{
alert('Error get data from ajax');
}
});
}
單擊下一個按鈕時,該函數會重新加載下一個ID(例如ID 1),但問題是第二次單擊下一個按鈕時,函數將加載兩次(當前ID為ID,下一個ID為ID 1和2),並且對於第三次單擊,它將加載三次(加載ID說ID 1 ID 2和ID 3)。 我希望它只是每次點擊的最后一個ID
嘗試
var next_id=1;
var previous_id=1;
function open_appointment(id)
{
save_method = 'open_appointment';
$('#form_open_appointment')[0].reset(); // reset form on modals
$('.form-group').removeClass('has-error'); // clear error class
$('.help-block').empty(); // clear error string
//Ajax Load data from ajax
$.ajax({
url : "<?php echo site_url('ReceptionistController/ajax_edit_appointment')?>/" + id,
type: "GET",
dataType: "JSON",
success: function(data)
{
$.ajax({
url : "<?php echo site_url('ReceptionistController/ajax_edit_patient')?>/" +data.ap_patient,
type: "GET",
dataType: "JSON",
success: function(data)
{
$('[name="pt_id"]').val(data.pt_id);
$('[name="pt_name"]').val(data.pt_name);
$('[name="pt_dob"]').val(data.pt_dob);
$('[name="pt_sex"]').val(data.pt_sex);
$('[name="pt_contact"]').val(data.pt_contact);
$('[name="pt_email"]').val(data.pt_email);
$('[name="pt_address"]').val(data.pt_address);
id=parseInt(id);
next_id=id+1;
previous_id=id-1;
},
error: function (jqXHR, textStatus, errorThrown)
{
alert('Failed');
}
});
$('#modal_open_appointment').modal('show'); // show bootstrap modal when complete loaded
$('.modal-title').text('Open Appointment'); // Set title to Bootstrap modal title
},
error: function (jqXHR, textStatus, errorThrown)
{
alert('Error get data from ajax');
}
});
}
$(document).on('click','#next_patient',function() {
alert("next="+next_id);
open_appointment(next_id);
});
//button to call back the function with previous id
$(document).on('click','#previous_patient',function() {
alert("previous="+previous_id);
open_appointment(previous_id);
});
我認為您應該在將click事件綁定到按鈕之前調用.unbind()。
$('#next_patient').unbind().bind('click', function() {
alert("next"+next_id);
...
})
function open_appointment(id) { save_method = 'open_appointment'; $('#form_open_appointment')[0].reset(); // reset form on modals $('.form-group').removeClass('has-error'); // clear error class $('.help-block').empty(); // clear error string //Ajax Load data from ajax $.ajax({ url : "<?php echo site_url('ReceptionistController/ajax_edit_appointment')?>/" + id, type: "GET", dataType: "JSON", success: function(data) { $.ajax({ url : "<?php echo site_url('ReceptionistController/ajax_edit_patient')?>/" +data.ap_patient, type: "GET", dataType: "JSON", success: function(data) { $('[name="pt_id"]').val(data.pt_id); $('[name="pt_name"]').val(data.pt_name); $('[name="pt_dob"]').val(data.pt_dob); $('[name="pt_sex"]').val(data.pt_sex); $('[name="pt_contact"]').val(data.pt_contact); $('[name="pt_email"]').val(data.pt_email); $('[name="pt_address"]').val(data.pt_address); id=parseInt(id); var next_id=id+1; var previous_id=id-1; // **************************************** // move out 2 event out function // set value next_id & prev_id to html tag $('#next_patient').attr('data-next',next_id); $('#previous_patient').attr('data-prev',previous_id); //***************************************** }, error: function (jqXHR, textStatus, errorThrown) { alert('Failed'); } }); // show bootstrap modal when complete loaded $('#modal_open_appointment').modal('show'); // Set title to Bootstrap modal title $('.modal-title').text('Open Appointment'); }, error: function (jqXHR, textStatus, errorThrown) { alert('Error get data from ajax'); } }); } //button to call back the function with next id $('#next_patient').click(function() { //recevice value & convert to number *** var next_id = Number($(this).attr('data-next')); open_appointment(next_id); }); //button to call back the function with previous id $('#previous_patient').click(function() { //recevice value & convert to number *** var prev_id = Number($(this).attr('data-prev')); open_appointment(prev_id); });
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.