manuelgtz / jquery-datatables-editable

Automatically exported from code.google.com/p/jquery-datatables-editable
0 stars 0 forks source link

Inline delete link issue #102

Open GoogleCodeExporter opened 9 years ago

GoogleCodeExporter commented 9 years ago
I am trying to get inline row deleting working in datatables where there is 
only a delete image (unchecked.gif) in the last column of each row (i.e. 
oDeleteRowButtonOptions is not visible) and clicking on this image will delete 
the row in datatables and mysql.

The datatable lists public holidays and has 5 columns - HolID (primary key); 
holiday_name; holiday_date; day_name; column to hold delete image.

What is the expected output? What do you see instead?

When I click the delete image, I get an alert which confirms the correct row 
id, but it thens fail to invoke the deletedata.php file.  I think the problem 
is in the line - return"<a class='table-action-deletelink' 
href='modules/holidays/holidays_DeleteData?id=" + aData.HolID + "'></a>", but I 
don't know how to fix it.

Also, is there an option for oDeleteRowButtonOptions to make the button 
invisible?

Interestingly, I can only get inline editing for columns 2 onwards to work.  I 
can't get inline editing to work on column 1.

What version of the product are you using? On what operating system?

Datatables 1.8.2; jEditable 1.6.2, datatables-editable 1.3.0 (using 2.3.1 
breaks the table), with sName changed to mDataProp on line 198 (252 in 2.3.1)

Here is my code

var oTable;

$('#holidays tbody td img').live( 'click', function () {
    var nTr = this.parentNode.parentNode;
    if ( this.src.match('unchecked') )
    {
       var aData = oTable.fnGetData( nTr );
       //window.alert(aData.HolID);//just a test to confirm correct DT_RowID returned
       return"<a class='table-action-deletelink' href='modules/holidays/holidays_DeleteData?id=" + aData.HolID + "'></a>"
    }
} );

$(document).ready( function () {
    oTable = $('#holidays').dataTable({
        "sDom": '<"clear"><"H"fr>t<"F"i>',
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "modules/holidays/holidays_objects.php",
        "bJQueryUI": true,
        "aoColumns": [
            { "mDataProp": "HolID", "sClass": "center"},
            { "mDataProp": "holiday_name"},
            { "mDataProp": "holiday_date"},
            { "mDataProp": "day_name"},
            { "mDataProp": null, "sDefaultContent": '<img src="media/images/unchecked.gif">', "sClass": "center", "bSearchable": false, "bSortable": false, "sWidth": "10px" },
        ]
    }
).makeEditable({
        sUpdateURL: "modules/holidays/holidays_UpdateData.php",
        sAddURL: "modules/holidays/holidays_AddData.php",
        sDeleteURL: "modules/holidays/holidays_DeleteData.php",
        sAddNewRowFormId: "formNewHoliday",
        oAddNewRowButtonOptions: { 
            label: "New Holiday",
            icons: { primary: 'ui-icon-plus' }
        },
        "aoColumns": [
            {// HolID
                indicator: 'Saving Holiday ID ...',
                tooltip: 'Click to change HolID',
                onblur: 'submit',
                type: 'text',
            },
            {// holiday name
                indicator: 'Saving Holiday ...',
                tooltip: 'Click to change Holiday Name',
                onblur: 'submit',
                type: 'text',
            },
            {// holiday date
                indicator: 'Saving Holiday Date ...',
                tooltip: 'Click to change Holiday Date',
                //onblur: 'submit',
                type: 'datepicker',
            },
            {//day
                indicator: 'Saving Holiday day of week ...',
                tooltip: 'Click to select Holiday day of week',
                type      : "autocomplete",
                autocomplete : {
                    autofill : true,
                    max : 3,
                    selectFirst : true,
                    highlight : true,
                    source : 'modules/holidays/get_days.php'
                },
                onblur: 'submit',
            },
            null
        ],
    });
});

Thanks, BanDan88

Original issue reported on code.google.com by dkimt...@yahoo.com on 19 Mar 2012 at 7:36