正如您所看到的,我的数据表上的排序图标位于该列的最右侧:

是否可以将它们对齐在左侧,以便它们出现在文本之后?
即.
# ^ Technician ^ Completed Date ^
Run Code Online (Sandbox Code Playgroud)
谢谢
所要求的代码:
<div class="dataTable_wrapper">
<table class="table table-striped table-hover" id="table-d">
<thead>
<tr>
<th>{% trans %} id {% endtrans %}</th>
<th>{% trans %} technician {% endtrans %}</th>
<th>{% trans %} date {% endtrans %}</th>
<th>{% trans %} summary {% endtrans %}</th>
</tr>
</thead>
</table>
</div>
Run Code Online (Sandbox Code Playgroud)
和:
$('#table-d').DataTable( {
"processing": true,
"serverSide": true,
"ajax": "{{ path('table_data') }}",
"pageLength": 10
})'
Run Code Online (Sandbox Code Playgroud) 实际上我是jQuery datatables插件的新手.
我已使用此代码使用此方法将插件附加到我的表中.
$(document).ready(function()
$('#table_id').dataTable({
});
});
Run Code Online (Sandbox Code Playgroud)
现在我想要的是datatables提供了一个文本框,我们可以在其中输入我们的过滤字符串,结果将被过滤.
所以我想使用我现有的设计文本框来实现这一目的,我不想在UI中添加新的文本框.所以我经历了这个链接
http://datatables.net/examples/basic_init/dom.html
但我不理解.是否可以使用现有的文本框.请指教
在实现此数据表之前,请参阅我遇到的情况

现在当我应用这个数据表插件时,为搜索添加了一个新的文本框我不想要一个新的文本框我想让我现有的文本框实现搜索功能.
我正在使用提供和解释的Bootstrap Date Range Picker 在这个页面中我使用cdn添加了所有库,我的意思是:
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap/latest/css/bootstrap.css" />
<script type="text/javascript" src="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.css" />
Run Code Online (Sandbox Code Playgroud)
但问题是我需要所有西班牙语,我没有看到一段代码来配置它.我该怎么办?
如何在关闭另一个引脚或单击地图时关闭所有信息窗口?我正在使用http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/docs/reference.html 和kml叠加层.继到我的JS到目前为止:
jQuery(document).ready(function ($) {
function initialize() {
google.maps.visualRefresh = true;
var myLatlng = new google.maps.LatLng(51.201465, -0.30244);
var mapOptions = {
zoom: 12,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
var kmlLayer = new google.maps.KmlLayer({
url: 'http://***.com/new/wp-content/themes/required-starter/CGAGolfAcademies.kml?rand=' + (new Date()).valueOf(),
suppressInfoWindows: true,
map: map
});
google.maps.event.addListener(kmlLayer, 'click', function (kmlEvent) {
showInContentWindow(kmlEvent.latLng, kmlEvent.featureData.description);
});
function showInContentWindow(position, text) {
var content = "<div class='info_win'><p>" + text + "</p></div>";
var infowindow =new InfoBox({
content: content,
disableAutoPan: false,
maxWidth: …Run Code Online (Sandbox Code Playgroud) 我一直在努力获得带有input-append元素的输入,以便在流畅的布局中获得正确的宽度.我正在使用Bootstrap的v2.0.4.当我调整大小以使页面变小时,它会打破换行符.理想情况下,我输入井的全宽(如警报).我已经在下面添加了标记和一些截图.任何帮助非常感谢!
<div class="row-fluid">
<div class="span3 well">
<form class="form-horiztonal">
<h2>Filters</h2>
<fieldset>
<div class="control-group">
<label class="control-label" for="msisdn">MSISDNs</label>
<div class="controls">
<div class="input-append">
<input class="span10" id="msisdn" size="" type="text" name="msisdn"><button
class="btn btn-primary" type="submit"><i class="icon-plus icon-white"></i></button>
</div>
</div>
</div>
</fieldset>
</form>
</div>
<div class="span9"></div>
</div>
Run Code Online (Sandbox Code Playgroud)


我正在使用带有Button的数据表.我想显示成功按钮而不是默认.我试过这个代码
buttons: [
{
extend: "excel",
className: "btn-sm btn-success",
titleAttr: 'Export in Excel',
text: 'Excel'
}]
Run Code Online (Sandbox Code Playgroud)
这段代码正在运行,但这是添加btn-success类,但是我想首先删除btn-default类,然后添加成功类.
当前课程: "btn btn-default buttons-excel buttons-html5 btn-sm btn-success"
我想要的是 : "btn buttons-excel buttons-html5 btn-sm btn-success"
我正在使用jQuery dataTable,当用户选择下拉列表时,它会搜索数据表并对其进行过滤,并根据搜索到的数据重新绘制内容:
mtTable.columns().each(function() {
mtTable.column(22).search(searchVal, true, true).draw();
});
Run Code Online (Sandbox Code Playgroud)
现在我尝试在搜索完成后获取所有列值,但是我找不到执行此操作的函数.目前我正在使用api
var myTable = $("#tblResults").DataTable();
var resultsArray = myTable.columns(colIndex).data();
Run Code Online (Sandbox Code Playgroud)
根据文档,这将返回未经过滤的列中的所有数据.我找不到一个函数来为我提供过滤数据的列值数组.
我有一个数据表,我有打印按钮和pdf按钮.我可以在打印页面时更改字体大小,但在导出pdf文件时无法更改字体大小.
{
extend: 'pdfHtml5',
text: 'Save PDF',
exportOptions: {
modifier: {
page: 'current'
}
},
header: true,
title: 'My Table Title',
orientation: 'landscape'
},
{
extend: 'print',
text: 'Print',
customize: function ( win ) {
$(win.document.body)
.css( 'font-size', '15pt' )
$(win.document.body).find( 'table' )
.addClass( 'compact' )
.css( 'font-size', '8pt' );
},
header: false,
title: '',
orientation: 'landscape'
},
Run Code Online (Sandbox Code Playgroud)
你能帮助我吗?
我正在使用angular-fontawesome和datatables,我想在表格中创建一个按钮,但我想用fontawesome来放置一个图标而不是文本.我有以下代码:
this.dtOptions = {
//...
buttons: [
//...
{
extend: 'pdf',
text: '<fa-icon [icon]="faDownload"></fa-icon>'
}
]
};
Run Code Online (Sandbox Code Playgroud)
我知道我不会以这种方式加载图标的组件,但有没有办法在不必使用fontawesome css的情况下完成它?
我使用以下代码来设置DataTable的列宽.在部分页面加载期间,宽度看起来是正确的,当它完全加载时,宽度关闭.
<script>
$(document).ready(function () {
$("#memberGrid").dataTable({
"dom": 'T<"clear">lfrtip',
"tableTools": {
"sSwfPath": "../../Content/swf/copy_csv_xls.swf"
},
"destroy": true,
"info": true,
"bLengthChange": false,
"bFilter": false,
"bAutoWidth": false,
"aoColumns": [{ "sWidth": "20%" }, { "sWidth": "20%" }, { "sWidth": "20%" }, { "sWidth": "10%" }, { "sWidth": "20%" }, { "sWidth": "10%" }]
});
});
</script>
Run Code Online (Sandbox Code Playgroud)
表标记
<table class="group-grid table table-hover table-bordered table-responsive zebra-striped" id="memberGrid">
<thead class="tablehead">
<tr>
<th style="width: 20%">Name</th>
<th style="width: 20%">Room with</th>
<th style="width: 20%">Extensions</th>
<th style="width: 10%">Travel Protection</th>
<th style="width: 20%">Flying …Run Code Online (Sandbox Code Playgroud) datatables ×5
jquery ×4
javascript ×3
css ×2
angular ×1
angular-cli ×1
font-awesome ×1
font-size ×1
google-maps ×1
html ×1
pdf ×1
width ×1