Question

我能够删除上述复选框操作上的列数据和标题。但是因为我正在使用tablesorter插件。过滤器不会隐藏或消失。这会占用我们要为扩展表视图提供的额外空间。

请看两个图片以获得更好的参考和理解？

我希望@Mottie会提出一些解决方案。

这是我目前的结构

Dim driver As IWebDriver
Dim ChromeOptions As New ChromeOptions
Dim driverWait_5 As Support.UI.WebDriverWait
Dim jsExec As OpenQA.Selenium.IJavaScriptExecutor

Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
    driver = New ChromeDriver("C:\ChromeDriver", ChromeOptions)
    driverWait_5 = New Support.UI.WebDriverWait(driver, TimeSpan.FromSeconds(5))
    jsExec = CType(driver, OpenQA.Selenium.IJavaScriptExecutor)
    Dim address As String = "https://www.google.co.uk/webhp"
    driver.Navigate.GoToUrl(address)
    Dim element As IWebElement = driverWait_5.Until(ExpectedConditions.ElementIsVisible(By.Id("lga")))
    If IsNothing(element) = False Then
        jsExec.ExecuteScript("document.getElementById('lga').remove();")
    End If

End Sub

这是我用来从表中隐藏列的功能。

<table class="table table-striped" id="someussta">
          <div class="btn-cal-group pull-right">    <a href="#" id="downsta" class="btn btn-sm bg-blue">Export Results Excel</a>
          <a href="#" id="testussta" type="button" onclick="exportPDFResults();" class="btn btn-sm bg-blue">Export Results pdf</a></div>


                                        <thead>
                               <tr>   <div> <b> ** Customize Column ** </b> </div> <div id="grpChkussta">
    <p>
    <input type="checkbox" name="Dcou" /> State
    <input type="checkbox" name="sresu" /> Search Result
<input type="checkbox" name="mflag" /> Flag
<input type="checkbox" name="mcomm" /> Comment
<input type="checkbox" name="mname" /> Trademark Name
<input type="checkbox" name="mtype" />Trademark No.
  <input type="checkbox" name="mleg" /> Legal Status</p>

            </div></tr>
                          <tr>  <div id="sticky" class="sticky">
                                 <th style="width: 10px"><input type="checkbox"  id="inp-chkboxsta"></th>
                                 <!--   <th>Mark Image</th> -->
                                   <th class="Dcou">State</th>
                                 <th class="sresu">Search Result</th>
                                <th class="mflag"> Flag </th>
                                <th class="mcomm"> Comment </th>
                                <th class="mname">Trademark Name</th>
                                <th class="mtype">Trademark No.</th>
                                <th class="mleg">Legal Status</th>
                                      <!-- <th>Web link</th> -->
                        </div>         </tr>     </thead>     

                      <tbody>
                              {% for result in cat.results %}
                              <tr id="someussta" class="content">
                                <td><input type="checkbox" name="tuesday[]" data-pid="{{result.id_}}" class="inpchksta"></td>
                                <td class="Dcou">{% for state in result.designatedContractedStates %}
                                                                        {{state}}
                                                                        {% endfor %}</td>

                                <td class="sresu">{{result.trademarkType}}</td>

                             <td width="125" class="{{result.id_}}">



                  <td class="mname"><a data-toggle="modal" class="tm" data-target="#TMResultModal" data-tid="{{result.id_}}">{{result.markName}}</a></td>
                   <td class="mreg">{{ (result.registrtionNo|string).rstrip('0').rstrip('.') }}</td>
                    <td class="mleg">{{result.legalStatus}}</td>
                                <!-- <td>{{result.goodsServices}}</td> -->
                              </tr>

                                                                    {% endfor %}</tbody>
                                                            </table>

Answer 1

过滤器行是动态构建的，因此单元格不包含每列的名称。可以使用filter_cellFilter option

添加

$(function() {
  $("table").tablesorter({
    widgets: ["filter"],
    widgetOptions : {
      filter_cellFilter : ["Dcou", "sresu", "mflag", "mcomm", "mname", "mtype", "mleg"]
    }
  });
});

注意：

HTML无效。将<div>包裹在表格单元格周围可能无法在所有浏览器中正常工作。
提供的HTML在屏幕快照中似乎不是针对同一表的，因此，如果您有多个表具有可切换的列，则使用column selector widget可能会更容易。也不必为每个表单元格命名，因为小部件使用nth-child() css选择器来隐藏列。
还有一个sticky header widget。

隐藏表中的列时，tablesorter过滤器未隐藏

1 个答案: