使用Ajax从数据库隐藏/显示表列

时间:2013-06-12 08:47:01

标签: php jquery mysql ajax database

我找到了一种连接到我的数据库并检索数据的方法,但是当我试图隐藏/显示我的表列时它似乎不起作用,我甚至不知道它是否可以用于Ajax。

我的Html:

<table class="footable" id="masterChart">
            <thead><tr><th data-class="expand" class="account">Account Number</th><th>Account Description</th><th>Level 01</th><th>Level 02</th><th>Level 03</th><th>Level 04</th><th>Tax</th><th>YTD - Current</th><th>YTD - Prior</th><th>MTD - Current</th><th>MTD - Prior</th></tr></thead>

            <?php $index = 0?>

            <?php while ($row = mysql_fetch_assoc($result)):?>

            <tr<?php echo $index++ % 2 ? ' class="even"' : ''?>>
                <td><?php echo $row['accountNumber']?></td>
                <td><?php echo $row['accountDescription']?></td>
                <td><?php echo $row['accountLevel1']?></td>
                <td><?php echo $row['accountLevel2']?></td>
                <td><?php echo $row['accountLevel3']?></td>
                <td><?php echo $row['accountLevel4']?></td>
                <td><?php echo $row['id']?></td>
                <td><?php echo $row['id']?></td>
                <td><?php echo $row['id']?></td>
                <td><?php echo $row['id']?></td>
                <td><?php echo $row['id']?></td>
            </tr>

            <?php endwhile?>

        </table>

我的dbconn.php:

 <?php
  include_once('../classes/profile.class.php');

  $host = "localhost";
  $user = "root";
  $pass = "root";

  $databaseName = "accounting";
  $tableName = "login_table_display";

  //--------------------------------------------------------------------------
  // 1) Connect to mysql database
  //--------------------------------------------------------------------------

  $con = mysql_connect($host,$user,$pass);
  $dbs = mysql_select_db($databaseName, $con);

  //--------------------------------------------------------------------------
  // 2) Query database for data
  //--------------------------------------------------------------------------
  $user = $profile->getField('user_id');
  $result = mysql_query("SELECT * FROM '$tableName' WHERE user = '$user'");          //query
  $array = mysql_fetch_row($result);

  echo json_encode($array);
?>

我使用profile.class.php获取user_id。

我的阿贾克斯:

$(function () 
  {
    //-----------------------------------------------------------------------
    // 2) Send a http request with AJAX http://api.jquery.com/jQuery.ajax/
    //-----------------------------------------------------------------------
    $.ajax({                                      
      url: 'dbconn.php',                  //the script to call to get data          
      data: "",                        //you can insert url argumnets here to pass to api.php
                                       //for example "id=5&parent=6"
      dataType: 'json',                //data format      
      success: function(data)          //on recieve of reply
      {
        var user = data[1];              //get id
        var table = data[2];            //get table name
        var column = data[3];           //get column
        var show = data[4];          //display or hide
        //--------------------------------------------------------------------
        // 3) Update html content
        //--------------------------------------------------------------------
        if (show == 0){
       $(table +'td:nth-child('+ column +'),th:nth-child('+ column +')').hide();
        //recommend reading up on jquery selectors they are awesome 
        // http://api.jquery.com/category/selectors/
        }
      } 
    });
}); 

我将上面的ajax.js文件包含在我的文件中:

<script src="ajax/ajax.js" type="text/javascript"></script>

如果有人可以提供帮助或协助,我真的很感激!如果有人有另一种方法来获取数据库信息并隐藏特定列,用户表,我也很感激。

2 个答案:

答案 0 :(得分:2)

您能提供HTML的完整结构吗? 在调用ajax请求之前,您是否从任何表开始?

除此之外,请尝试更新:

if (show == 0){
  $(table +'td:nth-child('+ column +'),th:nth-child('+ column +')').hide();
}

有了这个:

if (show == 0){
  $(table +' td:nth-child(' + column + '),' + table + ' th:nth-child(' + column + ')').hide();
}

答案 1 :(得分:0)

好的,所以我做对了:

我添加了profile.class.php错误,它被认为是../ classes / profile.class.php

除此之外,jquery是错误的,

这:

$(table +'td:nth-child('+ column +'),th:nth-child('+ column +')').hide();

需要这样:

$('#'+ table +' td:nth-child(' + column + '), #' + table + ' th:nth-child(' + column + ')').hide();

它根据用户选择找到显示/隐藏值:)