X-editable和DataTables问题

时间:2014-05-07 16:18:41

标签: javascript jquery twitter-bootstrap-3 jquery-datatables x-editable

我为我的问题做了一个小问题,但它没有反映我正确的问题所以我会解释。

我有10个列表,使用带有bootstrap3的数据表版本1.10, 可使用内联编辑和onblur进行X-editable:'忽略'(用于多次修改)

X | Y标题

a | b单元格值

所以,如果我点击两个& b像这样的细胞会发生

X | ÿ

a(内联编辑模式) b(内联编辑模式)

单击时,单元格b会到达X列中单元格a的底部。

我通过在Tags中使用标签解决了这个问题。 但是我的一些数据表过滤器没有工作, 如果我从所有列中删除span标签,过滤器将正常工作。

以下是Jsfiddle链接:http://jsfiddle.net/xBB5x/4346/

 $.fn.editable.defaults.mode = 'inline';
$('#users a').editable({
    type: 'text',
    name: 'username',
    url: '/post',
    title: 'Enter username'
});
$('.s').editable({
    type: 'text',
    name: 'username',
    url: '/post',
    title: 'Enter username'
});
//ajax emulation
$.mockjax({
    url: '/post',
    responseTime: 200
}); 

实际上我并不知道如何在代码中编辑onblur选项,因此它无法正确反映我的问题。

更新:以下是生成的HTML

数据表中的选择代码

   var table = $('#example').DataTable();

    $("#example thead td ").each( function ( i ) {

        if(i>1)
         select = $('<select class="form-control"><option value=""></option></select>')
            .appendTo( $(this).empty() )
            .on( 'change', function () {
                table.column( i )
                    .search( $(this).val() )
                    .draw();
            }
                 );


        table.column( i ).data().unique().sort().each( function ( d, j ) {
        if(i>1)
            select.append( '<option value="'+d+'">'+d+'</option>' )

        } );
    } );

这是我的问题 因此,对于带有数字的列,即使值中有span标记,它也能正常工作。

<option value=""></option><option value="<span>0</span>">0</option><option value="<span>10</span>">10</option><option value="<span>1</span>">1</option><option value="<span>2</span>">2</option><option value="<span>3</span>">3</option><option value="<span>4</span>">4</option><option value="<span>5</span>">5</option><option value="<span>8</span>">8</option>

但对于包含文字的列,它并不匹配。

<select class="form-control"><option value=""></option><option value="<span></span>"></option><option value="<span>TEAM1</span>">TEAM1</option><option value="<span>TEAM2</span>">TEAM2</option><option value="<span>TEAM3</span>">TEAM3</option><option value="<span>TEAM4</span>">TEAM4</option><option value="<span>UNASSIGNED</span>">UNASSIGNED</option></select>

所以有人可以告诉我如何删除值中的span标记。

更新我接近我知道的答案,

我只需更改主jquery.datatables.js中的d obj,例如选择span标记内的数据而不是td

0 个答案:

没有答案