Serverside Datatables搜索框样式

我曾尝试寻找解决方案来解决这个问题一段时间，但还没有设法找到任何东西。希望有人能帮助我。Serverside Datatables搜索框样式

我注意到数据表的搜索和显示输入卡在标签内。当我尝试从源javascript中删除标签标签时，输入消失。我可能会做错，但有没有办法删除它，以便我可以调整其宽度，并使其符合我的动态列大小？

这部分IM谈论（从源javascript文件）

function pb(a) { 
     var b = a.oClasses, 
      c = a.sTableId, 
      d = a.oLanguage, 
      e = a.oPreviousSearch, 
      f = a.aanFeatures, 
      g = '<input type="search" class="' + b.sFilterInput + '"/>', 
      j = d.sSearch, 
      j = j.match(/_INPUT_/) ? j.replace("_INPUT_", g) : j + g, 
      b = h("<div/>", { 
       id: !f.f ? c + "_filter" : null, 
       "class": b.sFilter 
      }).append(h("<label/>").append(j)), 
      f = function() { 
       var b = !this.value ? 
        "" : this.value; 
       b != e.sSearch && (fa(a, { 
        sSearch: b, 
        bRegex: e.bRegex, 
        bSmart: e.bSmart, 
        bCaseInsensitive: e.bCaseInsensitive 
       }), a._iDisplayStart = 0, O(a)) 
      }, 
      g = null !== a.searchDelay ? a.searchDelay : "ssp" === y(a) ? 400 : 0, 
      i = h("input", b).val(e.sSearch).attr("placeholder", d.sSearchPlaceholder).bind("keyup.DT search.DT input.DT paste.DT cut.DT", g ? Oa(f, g) : f).bind("keypress.DT", function(a) { 
       if (13 == a.keyCode) return !1 
      }).attr("aria-controls", c); 
     h(a.nTable).on("search.dt.DT", function(b, c) { 
      if (a === c) try { 
       i[0] !== I.activeElement && i.val(e.sSearch) 
      } catch (d) {} 
     }); 
     return b[0] 
    }

的代码时，页面加载

<div class="row"> 
    <div class="col-sm-12"> 
     <div id="table_filter" class="dataTables_filter pull-left"> 
      <label> 
       <input type="search" class="form-control input-sm" placeholder="Search" aria-controls="table"> 
      </label> 
     </div> 
    </div> 
</div>

看到搜索输入是怎样的标签之下？我想知道如何去除它，以便它符合我的色谱柱尺寸。

来源

2017-07-03 JianYA

修改插件的源文件几乎总是一个坏主意，还有其他方法可以做到这一点。你能否用一个截图和/或HTML来展示你想要达到的结构？ –

嗨！感谢回复。我已更新我的代码以显示html结构 – JianYA

使用下面的代码从搜索框中删除label节点。

var table = $('#example').DataTable({ 
    initComplete: function(){ 
     $('.dataTables_filter label').children().unwrap('<label/>'); 
    } 
});

请参阅this example的代码和演示。

来源

2017-07-04 10:40:46

由于某些原因，我收到语法错误，无法识别的表达式：。 – JianYA

我设法根据你的代码解决它！谢谢！我必须检查我的特定班级的父母是否为标签并将其打开。 – JianYA

另外，如果您是真正的Gyrocode.com，非常感谢您为数据表复选框的教程。这是超级有用 – JianYA

Serverside Datatables搜索框样式

回答

相关问题