jQuery bootgrid插件-设置列宽

时间:2018-12-21 12:04:38

标签: jquery html css jquery-bootgrid

我有一个带有表格的Razor页面。 enter image description here 一切顺利,直到我应用jquery bootgrid。 列宽固定,数据被截断。  列宽固定,数据被截断。

如何保持列宽为自动,以便数据不被截断? 如何保持列宽为自动,以便数据不会被截断?

enter image description here

  <table id="grid"  class="table table-condensed table-hover table-striped">
            <thead>
                 <tr>
                     <th data-column-id="Nominal">
                         Nominal
                     </th>
                     <th data-column-id="TD">
                        Tradedate / Valuedate
                    </th>
                    <th data-column-id="ReleaseDate">
                        ReleaseDate
                    </th>
                     <th data-column-id="Fund">
                       Fund
                    </th>
                    <th data-column-id="Pre-Pay">
                        Pre-Pay
                    </th>
                    <th data-column-id="Comment">
                        Comment
                    </th>
                </tr>
            </thead>
            <tbody>

                @foreach (var item in Model)
                {
                <tr>
                    <td>
                        @Html.DisplayFor(modelItem => item.Nominal)
                    </td>

                    <td>
                        @Html.DisplayFor(modelItem => item.TD) <br />
                        @Html.DisplayFor(modelItem => item.VD)

                    </td>

                    <td>
                        @Html.DisplayFor(modelItem => item.ReleaseDate)
                    </td>

                    <td>
                        @Html.DisplayFor(modelItem => item.Fund)
                    </td>
                    <td>
                       @Html.DisplayFor(modelItem => item.Pre_Pay)
                    </td>

                    <td>
                        @Html.DisplayFor(modelItem => item.Comment)

                    </td>
                </tr>
                }
            </tbody>
        </table>

    <script type="text/javascript">

            document.addEventListener('DOMContentLoaded', function () {
                $("#grid").bootgrid({
                    caseSensitive: false

                })

            });

        </script>

1 个答案:

答案 0 :(得分:0)

已解决:style = "table-layout: auto;"是我所需要的。