javascript - 如何使用引导程序 4 在移动设备上隐藏 gridview 列?
问题描述
我有一个gridview,我想使用引导程序在移动/平板电脑视图上隐藏一列(例如BirthDate。请参阅代码)。如何实现?我找到了解决方案,但使用了 bootstrap 3。先感谢您。
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" CellSpacing="-1" HorizontalAlign="Center" Height="80px" Width="800px" AutoGenerateColumns="False" EnableModelValidation="True" OnPageIndexChanging="GridView1_PageIndexChanging">
<RowStyle BackColor="#FFFBD6" ForeColor="#333333" BorderColor="Black" BorderStyle="Solid" BorderWidth="1px" HorizontalAlign="Center" />
<Columns>
<asp:BoundField DataField="EmployeeID" HeaderText="Employee">
<HeaderStyle BorderColor="#CC9966" />
</asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name" />
<asp:BoundField DataField="Surname" HeaderText="Surname" />
<asp:BoundField DataField="BirthDate" HeaderText="Date of Birth">
<ItemStyle HorizontalAlign="Right" />
</asp:BoundField>
</Columns>
</asp:GridView>
解决方案
在表格单元格上设置显示类会产生奇怪的结果。最好在内容上使用它。您可以使用 TemplateFields 并span
在 HeaderText 和内容中使用具有正确类的元素。
<asp:GridView ID="GridView1" AutoGenerateColumns="false" CssClass="table table-striped" GridLines="None" runat="server" ItemType="NameSpace1.Book">
<Columns>
<asp:TemplateField HeaderText="Always Visible">
<ItemTemplate>
<%# Item.id %>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="<span class='d-md-none'>Visible on Mobile</span>">
<ItemTemplate>
<span class="d-md-none"><%# Item.Name %></span>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="<span class='d-none d-md-block'>Visible on Desktop</span>">
<ItemTemplate>
<span class="d-none d-md-block"><%# Item.date.ToLongDateString() %></span>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
推荐阅读
- c# - '强类型' 泛型集合,包含任何
给定接口/类的 - python - requests.exceptions.ConnectionError:无法建立新连接:[Errno 111] 连接被拒绝
- css - 角度内容不会滚动
- google-slides-api - 如何通过 Google Slides API 将对象形状图像蒙版应用于图像
- c# - xUnit,Moq - 测试 .Net Core 存储库
- javascript - Firebase 存储下载到用户计算机
- youtube-api - Google API(youtube 搜索)总是按相关性而不是日期对结果进行排序
- android - 未调用 RecyclerView 标头的 OnClickListener
- ocaml - 创建一个可以更新的大小为 x 的空字符串数组
- ios - CollectionViewCell 绘制矩形