在通过热敏打印成功完成先前的AJAX请求后，如何执行AJAX请求

Question

我对AJAX请求有问题。如标题所述，我想在继上一个AJAX之后执行AJAX请求，以通过热敏打印机进行打印。

到目前为止，我有一些带有3个不同ID的按钮。每个ID都会执行AJAX请求以将更新查询到数据库中，并且更新成功。但是随后，我想执行另一个AJAX请求，以通过escpos-php通过热敏打印机（QPOS Q58M）进行打印。结果认为这是成功的，但没有完成打印。然后我尝试在没有AJAX的情况下执行打印脚本，并成功完成了。

这是HTML视图

<div class="row">
  <div class="col-lg-4 col-md-4 col-xs-12">
    <button class="btn btn-app btn-purple">
      <div >Certificate</div>
    </button>
    <button id="simpan_antrian1" class="btn btn-app btn-purple print">
      <i style="padding:55px 0;font-size:100px" class="ace-icon fa fa-user-plus"></i>
    </button>
    <button class="btn btn-app btn-purple">
      <div id="load_antrian1"></div>
    </button>
  </div>
  <div class="col-lg-4 col-md-4 col-xs-12">
    <button class="btn btn-app btn-purple">
      <div >Test</div>
    </button>
    <button id="simpan_antrian2" class="btn btn-app btn-purple print">
      <i style="padding:55px 0;font-size:100px" class="ace-icon fa fa-user-plus"></i> 
     </button>
     <button class="btn btn-app btn-purple">
       <div id="load_antrian2"></div>
     </button>
   </div>
   <div class="col-lg-4 col-md-4 col-xs-12">
     <button class="btn btn-app btn-purple">
       <div >Course</div>
     </button>
     <button id="simpan_antrian3" class="btn btn-app btn-purple print">
       <i style="padding:55px 0;font-size:100px" class="ace-icon fa fa-user-plus"></i>
     </button>
     <button class="btn btn-app btn-purple">
       <div id="load_antrian3"></div>
     </button>
   </div>
</div>

这是用于调用请求的脚本

<script type="text/javascript">
$(document).ready(function(){ 
    $('#load_antrian1').load('pages/beranda/getAntrian1.php');
    $('#load_antrian2').load('pages/beranda/getAntrian2.php');
    $('#load_antrian3').load('pages/beranda/getAntrian3.php');
    // antrian sertifikat
    $("#simpan_antrian1").on('click',function(){
        $.ajax({ 
            url   : "pages/beranda/proses1.php",
            type  : "POST",
            cache : false,
            success: function(
                if(msg=="Sukses"){ 
                    $('#load_antrian1').load('pages/beranda/getAntrian1.php').fadeIn("slow");
                    $('#load_antrian2').load('pages/beranda/getAntrian2.php').fadeIn("slow");
                    $('#load_antrian3').load('pages/beranda/getAntrian3.php').fadeIn("slow");
                    $.ajax({
                        url : "pages/beranda/print.php",
                        type: "POST",
                        cache: false,
                        //success: function(data, textStatus, jqXHR)
                        success: function()
                        {

                                alert('Please take your ticket');

                        }
                        error:function (){
                            alert("There is an error when printing")
                        }

                    });
                }
            }
        });
    });
    // antrian Test
    $("#simpan_antrian2").on('click',function(){
        $.ajax({
            url   : "pages/beranda/proses2.php",
            type  : "POST",
            cache : false,
            success: function(
                if(msg=="Sukses"){ 
                    $('#load_antrian1').load('pages/beranda/getAntrian1.php').fadeIn("slow");
                    $('#load_antrian2').load('pages/beranda/getAntrian2.php').fadeIn("slow");
                    $('#load_antrian3').load('pages/beranda/getAntrian3.php').fadeIn("slow");
                    $.ajax({
                        url : "pages/beranda/print.php",
                        type: "POST",
                        cache: false,
                        //success: function(data, textStatus, jqXHR)
                        success: function()
                        {

                                alert('Please take your ticket');

                        }
                        error:function (){
                            alert("There is an error when printing")
                        }

                    });
                }
            }
        });
    });
    // antrian Test
    $("#simpan_antrian3").on('click',function(){
        $.ajax({
            url   : "pages/beranda/proses3.php",
            type  : "POST",
            cache : false,
            success: function(
                if(msg=="Sukses"){ 
                    $('#load_antrian1').load('pages/beranda/getAntrian1.php').fadeIn("slow");
                    $('#load_antrian2').load('pages/beranda/getAntrian2.php').fadeIn("slow");
                    $('#load_antrian3').load('pages/beranda/getAntrian3.php').fadeIn("slow");
                    $.ajax({
                        url : "pages/beranda/print.php",
                        type: "POST",
                        cache: false,
                        //success: function(data, textStatus, jqXHR)
                        success: function()
                        {

                                alert('Please take your ticket');

                        }
                        error:function (){
                            alert("There is an error when printing")
                        }

                    });
                }
            }
        });
    });
}); 
</script>

  

更新

好吧，我尝试制作一个新的打印按钮，这样它就不会发出嵌套的AJAX请求，但不幸的是仍然无法解决问题…… 这是我最后的改变

HTML

<div class="row"> 
  <div class="col-lg-4 col-md-4 col-xs-12">
     <button class="btn btn-app btn-purple">
       <div >Certificate</div>
     </button>
     <button id="simpan_antrian1" class="btn btn-app btn-purple print">
       <i style="padding:55px 0;font-size:100px" class="ace-icon fa fa-user-plus"></i>
     </button>
     <button class="btn btn-app btn-purple">
       <div id="load_antrian1"></div>
     </button>
   </div>
   <div class="col-lg-4 col-md-4 col-xs-12">
     <button class="btn btn-app btn-purple">
       <div >Test</div>
     </button>
     <button id="simpan_antrian2" class="btn btn-app btn-purple print">
       <i style="padding:55px 0;font-size:100px" class="ace-icon fa fa-user-plus"></i> 
     </button>
     <button class="btn btn-app btn-purple">
       <div id="load_antrian2"></div>
     </button>
   </div>
   <div class="col-lg-4 col-md-4 col-xs-12">
     <button class="btn btn-app btn-purple">
       <div >Course</div>
     </button>
     <button id="simpan_antrian3" class="btn btn-app btn-purple print">
       <i style="padding:55px 0;font-size:100px" class="ace-icon fa fa-user-plus"></i>
     </button>
     <button class="btn btn-app btn-purple">
        <div id="load_antrian3"></div>
     </button>
   </div>
   <div class="col-lg-12 col-md-12 col-xs-12">
      <button class="btn btn-app btn-purple" id="print">
        <i style="font-size:2em" class="ace-icon fa fa-print"></i> Print your ticket
      </button>
    </div>
</div>

JavaScript

$(document).ready(function(){
        $('#load_antrian1').load('pages/beranda/getAntrian1.php');
        $('#load_antrian2').load('pages/beranda/getAntrian2.php');
        $('#load_antrian3').load('pages/beranda/getAntrian3.php');
        // antrian sertifikat
        $("#simpan_antrian1").on('click',function(){
            $.ajax({
                url   : "pages/beranda/proses1.php",
                type  : "POST",
                cache : false,
                success: function(msg){

                    if(msg=="Sukses"){
                        $('#load_antrian1').load('pages/beranda/getAntrian1.php').fadeIn("slow");
                        $('#load_antrian2').load('pages/beranda/getAntrian2.php').fadeIn("slow");
                        $('#load_antrian3').load('pages/beranda/getAntrian3.php').fadeIn("slow");
                    }

                }

            });
        });

        // antrian Test
        $("#simpan_antrian2").on('click',function(){
            $.ajax({
                url   : "pages/beranda/proses2.php",
                type  : "POST",
                cache : false,
                success: function(msg)
                {
                    if(msg=="Sukses"){
                        $('#load_antrian1').load('pages/beranda/getAntrian1.php').fadeIn("slow");
                        $('#load_antrian2').load('pages/beranda/getAntrian2.php').fadeIn("slow");
                        $('#load_antrian3').load('pages/beranda/getAntrian3.php').fadeIn("slow");

                    }
                }

            });
        });

        // antrian Test
        $("#simpan_antrian3").on('click',function(){
            $.ajax({
                url   : "pages/beranda/proses3.php",
                type  : "POST",
                cache : false,
                success: function(msg)
                {
                    if(msg=="Sukses"){
                        $('#load_antrian1').load('pages/beranda/getAntrian1.php').fadeIn("slow");
                        $('#load_antrian2').load('pages/beranda/getAntrian2.php').fadeIn("slow");
                        $('#load_antrian3').load('pages/beranda/getAntrian3.php').fadeIn("slow");
                    }
                }
            });
        });
        $("#print").on('click',function () {
            $.ajax({
                url : "pages/beranda/print.php",
                type: "POST",
                cache: false,
                //success: function(data, textStatus, jqXHR)
                success: function()
                {

                    alert('Please take your ticket');

                },
                error:function (){
                    alert("There is an error when printing");
                }

            });
        })
    });

虽然仍然无法进行打印，但是AJAX将其视为成功

  

更新

出于文档目的，我将打印脚本放在下面

<?php
//date_default_timezone_set("ASIA/JAKARTA");

// panggil file config.php untuk koneksi ke database
require_once "../../../config/config.php";
// panggil file fungsi nama hari
require_once "../../../config/fungsi_nama_hari.php";

require 'pengunjung/vendor/autoload.php';
use Mike42\Escpos\Printer;
use Mike42\Escpos\PrintConnectors\WindowsPrintConnector;


$hari_ini = date("Y-m-d");

$configID = "1";
// fungsi query untuk menampilkan data dari tabel sys_config
$result = $mysqli->query("SELECT nama_instansi FROM sys_config WHERE configID='$configID'") or die('Ada kesalahan pada query tampil data config: '.$mysqli->error);
$data_config = $result->fetch_assoc();

// fungsi query untuk menampilkan data dari tabel antrian
$result = $mysqli->query("SELECT max(no_antrian) as nomor, loket FROM antrian WHERE tanggal='$hari_ini' ORDER BY no_antrian DESC LIMIT 1") or die('Ada kesalahan pada query tampil nomor antrian: '.$mysqli->error);
$data = $result->fetch_assoc();

$nama_instansi  = $data_config['nama_instansi'];
$loket          = $data['loket'];
$no_antrian     = $data['nomor'];
$hari           = date("l");
$tanggal        = date("d-m-Y");
$jam            = date("H:i:s");

$connector = new WindowsPrintConnector("POS-58");
$printer = new Printer($connector);

    $printer->setJustification(Printer::JUSTIFY_CENTER);

    /* Name of shop */
    $printer -> selectPrintMode(Printer::MODE_DOUBLE_WIDTH);
    $printer -> text($nama_instansi."\n");
    $printer -> selectPrintMode();
    $printer -> text($hari." ".$tanggal." ".$jam."\n");
    $printer -> feed();

    /* Title of receipt */
    $printer -> setEmphasis(true);
    $printer -> text("YOUR QUEUE\n");
    $printer -> setEmphasis(false);
    $printer -> feed();
//
    $printer -> setJustification(Printer::JUSTIFY_CENTER);
    $printer -> setTextSize(8, 8);
    $printer -> text($no_antrian."\n");
    $printer -> setTextSize(4, 4);
    $printer -> text($loket."\n");
    $printer -> feed();
    $printer -> cut();
    $printer -> pulse();

    $printer -> close();
    echo 'sukses';
?>

Answer 1

  

您的js代码中有一些错误。检查以下代码。

<script type="text/javascript">
$(document).ready(function(){ 
    $('#load_antrian1').load('pages/beranda/getAntrian1.php');
    $('#load_antrian2').load('pages/beranda/getAntrian2.php');
    $('#load_antrian3').load('pages/beranda/getAntrian3.php');
    // antrian sertifikat
    $("#simpan_antrian1").on('click',function(){
        $.ajax({ 
            url   : "pages/beranda/proses1.php",
            type  : "POST",
            cache : false,
            success: function(msg){

                if(msg=="Sukses"){ 
                    $('#load_antrian1').load('pages/beranda/getAntrian1.php').fadeIn("slow");
                    $('#load_antrian2').load('pages/beranda/getAntrian2.php').fadeIn("slow");
                    $('#load_antrian3').load('pages/beranda/getAntrian3.php').fadeIn("slow");
                    $.ajax({
                        url : "pages/beranda/print.php",
                        type: "POST",
                        cache: false,
                        //success: function(data, textStatus, jqXHR)
                        success: function()
                        {

                                alert('Please take your ticket');

                        },
                        error:function (){
                            alert("There is an error when printing")
                        }

                    });
                }

            }

        });
    });

    // antrian Test
    $("#simpan_antrian2").on('click',function(){
        $.ajax({
            url   : "pages/beranda/proses2.php",
            type  : "POST",
            cache : false,
            success: function(msg)
            {
                if(msg=="Sukses"){ 
                    $('#load_antrian1').load('pages/beranda/getAntrian1.php').fadeIn("slow");
                    $('#load_antrian2').load('pages/beranda/getAntrian2.php').fadeIn("slow");
                    $('#load_antrian3').load('pages/beranda/getAntrian3.php').fadeIn("slow");
                    $.ajax({
                        url : "pages/beranda/print.php",
                        type: "POST",
                        cache: false,
                        //success: function(data, textStatus, jqXHR)
                        success: function()
                        {

                                alert('Please take your ticket');

                        },
                        error:function (){
                            alert("There is an error when printing")
                        }

                    });
                }
            }

        });
    });

    // antrian Test
    $("#simpan_antrian3").on('click',function(){
        $.ajax({
            url   : "pages/beranda/proses3.php",
            type  : "POST",
            cache : false,
            success: function(msg)
            {
                if(msg=="Sukses"){ 
                    $('#load_antrian1').load('pages/beranda/getAntrian1.php').fadeIn("slow");
                    $('#load_antrian2').load('pages/beranda/getAntrian2.php').fadeIn("slow");
                    $('#load_antrian3').load('pages/beranda/getAntrian3.php').fadeIn("slow");
                    $.ajax({
                        url : "pages/beranda/print.php",
                        type: "POST",
                        cache: false,
                        //success: function(data, textStatus, jqXHR)
                        success: function()
                        {

                                alert('Please take your ticket');

                        },
                        error:function (){
                            alert("There is an error when printing")
                        }

                    });
                }
            }
        });
    });
}); 
</script>

Answer 2

您应尝试使用Promise和回调函数，如上面的示例：

    //an ajax call to return some data from the server, in this case is dynamic based on the action I want to perform
function _ajaxObtenerInfo(action,data){
    return $.ajax({
     url: 'ajsources/file.php',
     type: 'POST',
     dataType: 'html',
     data: {action: action, data:data}
    })
}

//a function to append the content returned on my ajax success
function cargarElement (response1,response2){//pass the responses
  //in my case i need to load with data the first tab from a tab list so i have to loop the panels
  //to find the id of the current active tab cause the ids where generated randomly
  //if you know the id you would not need the loop i use under this comment
  var href = $("#listData").children("li.ui-tabs-active").find('a').attr('href');
  var div = $("#panels").children('div');
  $.each(div, function(index, value) {
    //console.log(index,value);
   if ($(value).attr('id') == href.substring(1,href.length)) {
    $(value).append(response1[0]+response2[0]); //note : my responses are html content so you should manage your response as you needed
    }
  });
}
//a when callback to manage all promises
$.when(_ajaxObtenerInfo('TPROGRAMADOS',data2),_ajaxObtenerInfo('TSEGUIMIENTO',data2))
//what happends here is that my when will wait 'til all my ajax calls are done and then
//it will execute a function to append my content
.then(function(response1,response2){
  cargarElement(response1,response2);
  })

希望对您有帮助=）

Answer 3

首先，很抱歉，这是我的print.php代码中的一个错误...

我试图在没有AJAX的情况下运行此脚本，并发现了找不到文件的错误

require 'pengunjung/vendor/autoload.php';

所以我想这是一个小错误，我将其更改为

require '../../vendor/autoload.php';
// you should know where this file located

它有效！

再次抱歉，