Editable DataTable plugin - Adding new record

Editable DataTable plugin - Adding new record

col.braziercol.brazier Posts: 26Questions: 2Answers: 0
edited August 2011 in General
Hi,

My page is here http://www.fobgfc.org/players_edit2.php

I cannot get the 'add record' to work correctly, ie. the add form is displayed instantly.

I think I have followed all the instructions but must have got in a muddle somewhere and I cannot work it out. Any help appreciated.

Hopefully view source will contain all the info you need but I would be pleased to answer any questions.

Thanks in advance,

Col

Replies

  • allanallan Posts: 61,438Questions: 1Answers: 10,052 Site admin
    There are a number of Javascript errors on the page:

    [code]
    Uncaught ReferenceError: jQuery is not defined
    checkform.jsFailed to load resource: the server responded with a status of 404 (Not Found)
    jquery.dataTables.editable.js:304Uncaught TypeError: Object [object Object] has no method 'fnSettings'
    [/code]

    I think that's the starting point. Firstly, you load jEditable before jQuery - since jEditable has a dependency on jQuery, they should be loaded the other way around. And hopefully that will help get it sorted out.

    Allan
  • col.braziercol.brazier Posts: 26Questions: 2Answers: 0
    Hi Allan,

    Apologies for the delay - I didn't see your response!

    I have changed the order but still get this error...

    oTable.fnSettings is not a function
    http://www.fobgfc.org/Scripts/jquery.dataTables.editable.js
    Line 304

    Colin
  • col.braziercol.brazier Posts: 26Questions: 2Answers: 0
    Progress of a sort...but I am now getting

    DataTables warning (table id = 'players'): Cannot reinitialise DataTable.

    in my new version http://www.fobgfc.org/players_edit3.php

    having changed the initialisation to this:

    $(document).ready(function() {
    var oTable = $('#players').dataTable().makeEditable({
    sUpdateURL: "UpdateData.php",
    sAddURL: "add_player.php",
    sAddHttpMethod: "GET", //Used only on google.code live example because google.code server do not support POST request
    sDeleteURL: "DeleteData.php"
    });

    $('#players').dataTable( {
    "sPaginationType": "full_numbers",
    "aoColumns": [
    { "sSortDataType": "dom-text" },
    { "sSortDataType": "dom-text" },
    { "sSortDataType": "dom-text" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" }
    ]
    });

    });
  • col.braziercol.brazier Posts: 26Questions: 2Answers: 0
    Ah, just switching them around did the trick...now I need to look at the CSS!

    $(document).ready(function() {

    $('#players').dataTable( {
    "sPaginationType": "full_numbers",
    "aoColumns": [
    { "sSortDataType": "dom-text" },
    { "sSortDataType": "dom-text" },
    { "sSortDataType": "dom-text" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" },
    { "sSortDataType": "dom-checkbox" }
    ]
    });

    var oTable = $('#players').dataTable().makeEditable({
    sUpdateURL: "UpdateData.php",
    sAddURL: "add_player.php",
    sAddHttpMethod: "GET", //Used only on google.code live example because google.code server do not support POST request
    sDeleteURL: "DeleteData.php"
    });
    });
This discussion has been closed.