Quantcast
Channel: DataTables 1.9 — DataTables forums
Viewing all articles
Browse latest Browse all 1816

datatable + add row + jeditable

$
0
0
Hello,

I'm searching to create a table with add row button like the example but seem not work for my case.
I've done a jsfiddle for demo http://jsfiddle.net/supersonique/ncHQ5/8/

Any idea why I've this error in consol ( Uncaught TypeError: Cannot read property 'aoData' of null ) , and the row not created ?

<h4>tel <a href="javascript:void(0);" onclick="fnClickAddRow('phonelist');" id="add-phone" class="btn btn-mini btn-primary" type="button"> + </a></h4>

<table id="phonelist" class="table table-hover table-striped table-bordered" width="80%">
    <tr>
        <th>id</th>
        <th>Type</th>
        <th>Tel</th>
        <th></th>
    </tr>
    <tr>
        <td>1</td>
        <td class="dblclick">mob</td>
        <td class="dblclick">0000000</td>
        <td><input type="radio" name="1-tel-default" id="1-tel-default-1" value="1" /></td>
    </tr>
    <tr>
        <td>2</td>
        <td class="dblclick">mob</td>
        <td class="dblclick">0000000</td>
        <td><input type="radio" name="1-tel-default" id="1-tel-default-2" value="1" /></td>
    </tr>
</table>

function fnClickAddRow(table_id) {
    $(table_id).dataTable().fnAddData( [
        "Edit",
        "Edit",
        "Edit",
        '<input type="radio" name="default" value="0" />' 
    ] );
}

$(document).ready(function(){ 
    
    $(".dblclick").editable("http://www.appelsiini.net/projects/jeditable/php/echo.php", { 
				indicator : "<img src='assets/img/ui-anim_basic_16x16.gif'>",
				submit: '<i class="icon-ok"></i>',
				cancel: '<i class="icon-ban-circle"></i>',
				tooltip   : "Double-click pour editer...",
				cssclass : 'input-block-level',
				event     : "dblclick",
				style  : "inherit"
    });
    

    /* phonelist test*/
    if($('#phonelist').length){
        
        var asInitVals = new Array();
        
        var oTable = $('#phonelist').dataTable( { 
            "aoColumnDefs": [{ "sType": "html", "aTargets": [ 2 ] }],
            "bJQueryUI": false,
            'bFilter': false,
            'bSort': false,
            'bPaginate': false,
            'bInfo': false,
            'bServerSide': false,
            "sDom": ""
        } );
        
    };
    /* end of table_display test*/

});

Thanks for help.

Viewing all articles
Browse latest Browse all 1816

Latest Images

Trending Articles



Latest Images