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


Hide/Show table column from database using Ajax

我找到了一种连接到我的数据库和检索数据的方法,但当我试图隐藏/显示我的表列时,它似乎不工作,我甚至不知道它是否可能与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。

我的ajax:

$(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>
如果有人可以帮助或协助,我真的很感激!如果有人有另一种方法来获取数据库信息并为用户隐藏特定的列,表,我也很感激。

你能提供完整的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();
}

好的,我猜对了:

我把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();

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