数据表中的多个子行

时间:2014-09-09 17:52:14

标签: javascript php jquery datatables

我有一个现有的PHP / javascript应用程序,它生成一个包含一些行和相应子行的表(可能有很多行,所有这些都是从DB一次性重新获取),默认情况下是隐藏的。用户单击按钮放置在表行后显示子行。 它看起来像这样(一个父母,两个孩子): http://i.imgur.com/hul9fT9.png

它是从php生成的:

    for($i = 0; $i < count($shipArr); $i++)
    {           
        echo '
            <tr>
                <td><span>'.$shipArr[$i]["orderNo"].'</span></td>
            </tr>
            <tr>
                <td>
                    <table id="details">
        ;'
        for($j = 0; $j < count($shipDetailsArr[$i]); $j++)
        {
            echo '
                        <tr>
                            <td>
                                    <p>
                                        <span>Order Number: </span><span>'.$shipDetailsArr[$i][$j]["lineNo"].'</span>
                                    </p>
                            </td>
                        </tr>
            ';
        }
        echo '</table>;'
    }

我可以使用从db填充的某些对象$ shipArr和$ shipDetailsArr来使用datatables插件创建相同的效果吗?我怎样才能做到这一点?

感谢您的帮助。

2 个答案:

答案 0 :(得分:1)

我不认为有一个数据库插件可以自动生成一个表。你应该使用像表生成器这样的东西。你可以自己编程,例如PHP。

如果这对你来说很难,那么已经有了可以做到这一点的课程。两个例子是:

祝你好运!

答案 1 :(得分:1)

我知道这个问题已经很老了,但我想我会考虑另一个与我的项目相关的答案,并提供一些支持。

我最近使用新的2.x版本更新了 naomik / htmlgen 。如果我自己这么说的话,它会使用PHP生成HTML非常好!

use function htmlgen\html as h;
use function htmlgen\map;

$beeData = [
  'pop' => 'yup',
  'candy' => 'sometimes',
  'flowers' => 'so much',
  'water' => 'not really',
  'sand' => 'indifferent',
  'donuts' => 'most definitely'
];

echo h('table',
  h('thead',
    h('tr',
      h('td', 'item'),
      h('td', 'do bees like it?')
    )
  ),
  h('tbody',
    map($beeData, function($value, $key) { return
      h('tr',
        h('td', $key),
        h('td', $value)
      );
    })
  )
);

输出(实际输出中不包括空格)

<table>
  <thead>
    <tr>
      <td>item</td>
      <td>do bees like it?</td>
    </tr>
  </thead>
  <tbody>
   <tr>
     <td>pop</td>
     <td>yup</td>
   </tr>
   <tr>
     <td>candy</td>
     <td>sometimes</td>
   </tr>
   <tr>
     <td>flowers</td>
     <td>so much</td>
   </tr>
   <tr>
     <td>water</td>
     <td>not really</td>
   </tr>
   <tr>
     <td>sand</td>
     <td>indifferent</td>
   </tr>
   <tr>
     <td>donuts</td>
     <td>most definitely</td>
   </tr>
 </tbody>
</table>

请参阅example目录中的代码以获取更多有用的提示!