在TH单元格中调整选择字段
Fit Select Field inside a TH cell
我在PHP中有一个函数,可以根据MySQL查询的结果创建一个表。我还添加了一个javascript类来根据列过滤行,但这个函数为每列创建了一个具有唯一数据的隐藏选择。当我显示这些选择字段时,它们会更改列的宽度,但它们的宽度应该来自TD单元格的内容,而不是选择。。。
为什么我要限制选择字段以适应TH单元格而不改变其宽度?
<table>
<thead>
<tr>
<th>Index
<th>Column 1 <br> <select><option>Ble</option><option>Bigger</option></select>
<th>Col2 <br> <select><option>Bla</option><option>Big option blablabla</option></select>
</tr>
</thead>
<table>
我试过CSS:
第th个选择{宽度:100%}
广告:
<th class="table-sortable:alphanumeric table-filterable table-sortable" table-sortable:alphanumeric="" table-filterable="" title="Click to sort">Resposta
<br><select onchange="Table.filter(this,this)" onclick="Table.cancelBubble(event)" class="table-autofilter" style="display: inline-block;">
<option value="">Filter: All</option>
<option value="1">1</option>
<option value="NAO">NAO</option>
<option value="SEPLAG">SEPLAG</option>
<option value="SIM">SIM</option>
</select>
</th>
打印示例:https://www.dropbox.com/s/cah2igqt40kq0vm/tables.png
好的,解决了。。。
我刚刚添加了选择字段CSS:
margin: 0 -45 0 -45;
您可以在选择的标签中添加样式:
<select style="width:300px;">
这将把select的宽度设置为300px。如果您使用
<select style="width:100%;">
它将把选择宽度设置为其父项留下的可用空间(<th>)。
问候,
相关文章:
- 选择字段-更改popover颜色
- 构建HTML选择字段并使用JavaScript数组选择选项
- 无法使用 Javascript 禁用选择字段
- 在应用 jQuery.Selected 时,使用 jQuery.Validate 来验证选择字段时,暴露错误
- 取消选中特定复选框时,React切换不删除的选择字段
- 添加值以动态选择字段
- jquery自动更新两个选择字段
- 如何在Sencha Touch应用程序的选择字段内自定义列表
- 自动完成PHP表单选择字段中的用户姓氏
- 添加选项以使用 javascript 从 json 文件中选择字段
- Angular ng通过ng选项重复多个选择字段,而不显示已选择的数据
- 如何创建具有空白选项和未筛选状态的动态选择字段
- 选择字段无需按钮即可工作,但在选择字段中不会更改
- 合并到选择字段
- 动态选择字段,在另一个选择字段 - Laravel 5.2 和 JS 中更改后重新填充
- 检查 2 个输入字段和一个选择字段,以便在它们全部填写后进行更改
- ReactJS - 如何在单击按钮时添加更多文本、文本字段、选择字段
- 检查表行的所有输入/选择字段是否都有值
- 当从第一个选项中选择一个选项时,如何取消隐藏另一个选择字段
- 具有相同名称和不同 id 的选择字段数组