簡體   English   中英

重新運行Ajax腳本?

[英]Re-Run a Ajax script?

如果我有一個類似下面的腳本,那就是運行加載一個表,其中數據從外部PHP文件注入到頁面中。

<script>
      $(document).ready(function(){
       var response = '';
        $.ajax({ type: "GET",   
          url: "Records.php",   
             success : function(text)
              {
                response = text;
              }
           });

           alert(response);
         });
</script>

我在下面有另一個腳本,用戶可以在其中添加記錄到數據庫。

<script id="sosurce" language="javascript" type="text/javascript">
$("#newitemadd").click(function(){
  $('#New').modal('show');
    $("#insertResults").click(function(){ 
        var getname = $('#getname').val();
        var getquant = $('#getquant').val();
        var getprice = $('#getprice').val();
        var getdesc = $('#getdesc').val();
               $.ajax({                                      
                    url: 'api2.php',    
                    data: "name="+getname+"&quantity="+getquant+"&price="+getprice+"&description="+getdesc,
                     success: function(data)
                     {  $('#New').modal('hide');
                        $("#success").html(data);
                        $('#success').slideDown().delay(3000).slideUp().reload
                    },
                     error: function() { 

                      $("#failure").alert('show');
                  }       
              }); 
          });
});
</script>

它完全按預期工作,但是,如何讓第一個腳本重新運行,以便刷新插入頁面的表格以顯示剛剛添加的新結果?

將第一個代碼移動到類似的函數中

<script>
  $(document).ready(LoadData);

  function LoadData() {
    var response = '';
    $.ajax({ 
      type: "GET",   
      url: "Records.php",   
      success : function(text) {
        response = text;
      }
    });

    alert(response);
  };
</script>

並從其他函數調用此函數,例如成功完成

<script id="sosurce" language="javascript" type="text/javascript">
  $("#newitemadd").click(function() {
    $('#New').modal('show');
    $("#insertResults").click(function() { 
      var getname = $('#getname').val(),
          getquant = $('#getquant').val(),
          getprice = $('#getprice').val(),
          getdesc = $('#getdesc').val();

      $.ajax({                                      
        url: 'api2.php',    
        data:       
          "name="+getname+"&quantity="+getquant+"&price="+getprice+"&description="+getdesc,
        success: function(data) {  
          $('#New').modal('hide');
          $("#success").html(data);
          $('#success').slideDown().delay(3000).slideUp().reload

          // Call load data again to refresh the table
          LoadData();
        },
        error: function() { 
          $("#failure").alert('show');
        }       
      }); 
    });
  });
</script>

你可以這樣做

<script>
  var renderTable = function() {
        var response = '';
                $.ajax({ type: "GET",   
                  url: "Records.php",   
                     success : function(text)
                      {
                        response = text;
                      }
                   });

                   alert(response);
    }

    // Call function onload
    jQuery(function($){
      renderTable();
   $(".refreshBtn").click(function(){
        renderTable();
     })

    });

</script>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM