我正在使用Bootstrap X-Editable进行内联编辑CRUD。我碰巧将它与Datatables结合使用,它就像一个魅力,直到我需要在一个具有x可编辑下拉列的列上添加过滤选项。
基本上,表格如下:
<table class="table-striped table-condensed" id="sortable">
<thead>
<tr>
<th></th>
<th>Src_id</th>
<th>Element_name</th>
<th>Src_type_id</th>
<th class="select-filter">Subcontract_id</th>
<th class="select-filter">Language_id</th>
<th class="select-filter">Site_id</th>
<th class="select-filter">Costcentre_id</th>
</tr>
</thead>
<tfoot>
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</tfoot>
<tbody>
@foreach($elements as $key => $value)
<tr>
<td width="10px"><input type="checkbox" name="ids_to_edit[]" value="{{$value->src_id}}" /></td>
<td>{{ $value->src_id }}</td>
<td><a href="#" class="testEdit" data-type="text" data-column="element_name" data-url="{{route('elements/update', ['src_type_id'=>$value->src_type_id, 'src_id'=>$value->src_id])}}" data-pk="{{$value->src_id}}" data-title="change" data-name="element_name">{{$value->element_name}}</a></td>
<td>{{ $value->src_type_id }}</td>
<td>{{ $value->subcontract }}</td>
<td><a href="#" class='testEdit2' data-column="language_id" data-url="{{route('elements/update', ['src_type_id'=>$value->src_type_id, 'src_id'=>$value->src_id])}}" data-pk="{{$value->src_id}}" data-title="change" data-name="language_id">{{ $value->language }}</a></td>
<td>{{ $value->site }}</td>
<td>{{ $value->costcentre }}</td>
</tr>
@endforeach
</tbody>
</table>
并且语言ID列的初始化为:
$('.testEdit2').editable({
type: 'select',
source: [
<?php foreach($languages as $key => $value){ ?>
{value: <?php echo $value->language_id; ?>, text: '<?php echo $value->language; ?>'},
<?php } ?>
],
params: function(params) {
// add additional params from data-attributes of trigger element
params.name = $(this).editable().data('name');
return params;
},
error: function(response, newValue) {
if(response.status === 500) {
return 'Server error. Check entered data.';
} else {
return response.responseText;
// return "Error.";
}
}
});
不幸的是,Datatables的列过滤器显示如下:
我发现它几乎包含了整个href标签:
我想知道如何清除此初始化以删除<a href></a>
标记。
$(document).ready(function() {
$('#sortable').DataTable({
"stateSave": false,
initComplete: function () {
this.api().columns('.select-filter').every( function () {
var column = this;
var select = $('<select><option value=""></option></select>')
.appendTo( $(column.footer()).empty() )
.on( 'change', function () {
var val = $.fn.dataTable.util.escapeRegex(
$(this).val()
);
column
.search( val ? '^'+val+'$' : '', true, false )
.draw();
} );
column.data().unique().sort().each( function ( d, j ) {
select.append( '<option value="'+d+'">'+d+'</option>' )
} );
} );
}
});
} );