首页 > 解决方案 > Tabulator ajaxLoaderLoading 未按预期工作

问题描述

`

	<script type="text/javascript"> 
		jQuery('#datetimepicker').datetimepicker();
		jQuery('#datetimepicker1').datetimepicker();

		var value1 = window.location.toString();
    		console.log(value1);
		value2 = value1.split('=');

    		value3i= value2[3].replace("%20"," ");
    		value4i= value2[4].replace("%20"," ");

		$.ajax({
                            url : "../php/dw_query_dict.php",
                            type : "GET",
                            data : ({"a": value4i , "b": value3i , "c": value2[2] ,"d": value2[1] }),
                            success : function(data1){
                            console.log(data1);
                            query_sql = data1[0].query;
			table.setData(data1);
			table1.setData(data1);
                            console.log("query:"+query_sql);
			},
                    error : function(data1) {
                    }
            });


                    $.ajax({
                            url : "../php/dw_slow_query_list.php",
                            type : "GET",
                            data : ({"a": value4i , "b": value3i , "c": value2[2] ,"d": value2[1] }),
                            success : function(data2){
                            console.log(data2);
                            table2.setData(data2);
                            },
                    error : function(data2) {
                    }
            });



	var table = new Tabulator("#db-error", {
           			// height:"300px",
            		layout:"fitColumns",
			ajaxLoader: true,
                            ajaxLoaderLoading:'Loadibg data', 
			ajaxProgressiveLoad:"load",
			ajaxProgressiveLoadDelay: 200,
            		columns:[
                    	{title:"Info", field:"query",formatter:"textarea", align:"left"},
                    	]
   		 });

            var table1 = new Tabulator("#db-error1", {
                            // height:"300px",
                            layout:"fitColumns",
			ajaxLoader: true,
   				ajaxLoaderLoading:'Loadibg data', 
			ajaxProgressiveLoad:"load",
			ajaxProgressiveLoadDelay: 200,
                            columns:[
			{title:"Host", field:"host", align:"cemnter"},
                            {title:"User", field:"user", align:"center"},
                            {title:"Schema", field:"db", align:"center"},
                            {title:"Lock time", field:"lock_time", align:"center"},
                            {title:"Rows examined", field:"rows_examined", align:"center"},
                            {title:"Rows sent", field:"rows_sent", align:"center"},
			{title:"Count", field:"count", align:"cemnter"},
			{title:"Min", field:"min_time", align:"center"},
			{title:"Max", field:"max_time", align:"center"},
			{title:"Avg", field:"avg_query_time", align:"center"},
			{title:"median", field:"median", align:"center"},
			{title:"95%", field:"95_per", align:"center"},
			{title:"Stddev", field:"stddev", align:"center"},
                            ]
             });

            var table2 = new Tabulator("#db-error2", {
                            // height:"300px",
                            layout:"fitColumns",
			ajaxLoader: true,
                            ajaxLoaderLoading:'Loadibg data', 
			ajaxProgressiveLoad:"load",
			ajaxProgressiveLoadDelay: 200,
                            columns:[
                            {title:"Query timestamp", field:"query_timestamp", align:"cemnter"},
			{title:"Host", field:"host", align:"cemnter"},
			{title:"Query time", field:"query_time", align:"cemnter"},
                            {title:"Lock time", field:"lock_time", align:"center"},
                            {title:"Rows examined", field:"rows_examined", align:"center"},
                            {title:"Rows sent", field:"rows_sent", align:"center"},
                            {title:"User", field:"user", align:"center"},
                            {title:"Schema", field:"db", align:"center"},
                            {title:"Actual query", field:"arg",formatter:"textarea", align:"left"},
                            ]
             });

	</script>

我有下面的代码,但由于某种原因,“加载数据”覆盖对我不起作用。Ajax 调用从 mysql 表中提取数据,大约需要 60 秒才能完成。提取数据时,我看不到屏幕有任何变化。我确定我错过了一些重要的东西,但我无法弄清楚。提前道歉:)

附言。我正在使用制表符 v4.5.3。并且我已经尝试过 Chrome 和 Firefox 浏览器进行测试。

在此处输入图像描述

标签: tabulator

解决方案


推荐阅读