导航栏下方的搜索文本框

search text box below the nav bar

本文关键字:搜索 文本 导航      更新时间:2023-09-26

我使用jquery数据表…我想把数据表的搜索文本框移到页面的中心和导航栏....下面问题是搜索文本框自带的数据表插件,所以不知道如何移动它....下面提供我的代码…

http://jsfiddle.net/bz2C4/

<div class="dataTables_filter" id="vendortable_filter" style="margin-left: 80%;"><label>Search: <input type="text" aria-controls="vendortable"></label></div>
<script type="text/javascript" >
$(document).ready(function() {
    $('#inventoryTable').dataTable( {
        "bFilter": true,
        "bLengthChange": false,
        //"bJQueryUI": true,
        "bSort": false,
        "iDisplayLength": 20,
        "sPaginationType": "full_numbers"
    } );
    $('.dataTables_length').remove();
    $('.dataTables_info').remove();
    $('.dataTables_filter').css("float", "right");
});
</script>

您可以使用jquery移动它,这不是建议的方法,但如果您不能更改源代码是唯一的方法。看看这样的东西

$(function() {
  var search = $('.dataTables_filter').detach();
  $('.page-title').before(search);
  var left = ($('.page-title').width() / 2) - (search.width() / 2);
  search.css('margin-left',left+'px');
  search.css('float','');

});