在jqxDataTable中显示数据库中的数据

时间:2017-04-10 17:04:12

标签: php jquery jqxgrid

我有一个像Check this fiddle这样的jqxDataTable,它是来自jqx网站的例子

我正在尝试实现并将数据库中的数据显示到jqxDataTable中,但我没有在线运行如何做到这一点的示例?我在服务器端脚本中使用php。有可能从PHP?阿贾克斯可能吗?有人可以指出如何从数据库填充表。

for (var i = 0; i < 200; i++) {
        var row = {};
        var productindex = Math.floor(Math.random() * productNames.length);
        var price = parseFloat(priceValues[productindex]);
        var quantity = 1 + Math.round(Math.random() * 10);
        row["firstname"] = firstNames[Math.floor(Math.random() * firstNames.length)];
        row["lastname"] = lastNames[Math.floor(Math.random() * lastNames.length)];
        row["productname"] = productNames[productindex];
        row["price"] = price;
        row["quantity"] = quantity;
        row["total"] = price * quantity;
        data[i] = row;
    }

这是从硬编码值更新。

1 个答案:

答案 0 :(得分:0)

这是非常基本的。您需要一个函数来转到您的数据库,然后您需要连接到该函数。这绝不是完整的。您需要进一步编码。

PHP

function conn(){
$dbhost = 'localhost:3036';
   $dbuser = 'root';
   $dbpass = 'rootpassword';

   $conn = mysql_connect($dbhost, $dbuser, $dbpass);

   if(! $conn ) {
      die('Could not connect: ' . mysql_error());
   }

   $sql = 'SELECT emp_id, emp_name, emp_salary FROM employee';
   mysql_select_db('test_db');
   $retval = mysql_query( $sql, $conn );

   if(! $retval ) {
      die('Could not get data: ' . mysql_error());
   }

   while($row = mysql_fetch_array($retval, MYSQL_ASSOC)) {
      echo "EMP ID :{$row['emp_id']}  <br> ".
         "EMP NAME : {$row['emp_name']} <br> ".
         "EMP SALARY : {$row['emp_salary']} <br> ".
         "--------------------------------<br>";
   }

   echo "Fetched data successfully\n";

   mysql_close($conn);
}

AJAX

$.ajax({
            type: 'POST',
            data: {
                action: 'conn',
                somevaluetosend : value,
            },

            success : function(msg){
                console.log(msg); //put this in a function, that will then assign in your table.
            },
            datatype: 'json' //depends on what you get back
        });