3

My question is same as addressed here

But It was working, if we use 1.jquery1.7.2.js

2.jquery.dataTables.min.js(1.7.2)

3.jquery.jeditable.js(1.7.3)

4.jquery.dataTables.editable.js(2.3.3)

But currently I am using 1.jquery1.10.2.js

2.jquery.dataTables.min.js(1.10.2)

3.jquery.jeditable.js(1.7.3)

4.jquery.dataTables.editable.js(2.3.3) It throwing error table.makeEditable() is not a function. I did not found where is the Mistake is? Please Help Me. Thanks In Advance.

<html>


<head>
    <link href="/JqueryDatatable/css/dataTables.jqueryui.css" type="text/css" rel="stylesheet"/>
    <link href="/JqueryDatatable/css/jquery-ui.css" type="text/css" rel="stylesheet"/>
    <link href="/JqueryDatatable/css/jquery.dataTables.css" type="text/css" rel="stylesheet"/>

    <script type="text/javascript" src="/JqueryDatatable/js/jquery-1.10.2.js" ></script>
       <script type="text/javascript" src="/JqueryDatatable/js/jquery.dataTables.js" ></script>
    <script type="text/javascript" src="/JqueryDatatable/js/jquery.jeditable.js" ></script>

   <script type="text/javascript" src="/JqueryDatatable/js/jquery.dataTables.editable.js" ></script>


<script type="text/javascript">

$(document).ready(function() {


var table= $('#example').DataTable( {
      //  "sScrollY":        250

    } );
    // Apply the filter
   table.columns().eq( 0 ).each( function ( colIdx ) {
        $( 'input', table.column( colIdx ).header() ).on( 'keyup change', function () {
            table
                .column( colIdx )
                .search( this.value )
                .draw();
        } );
    } );

    //Making datatable as editable columns
    table.makeEditable();

} );
Community
  • 1
  • 1
Do It
  • 113
  • 2
  • 15

3 Answers3

2

Change this

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

to

  var table= $('#example').dataTable( {

Im facing same problem, and this solution worked perfectly.

cutez7boyz
  • 741
  • 7
  • 16
0

Try this

<script type="text/javascript">

  $(document).ready(function() {


  var table= $('#example').DataTable( {
  //  "sScrollY":        250

   } );

// Apply the filter
   table.columns().eq( 0 ).each( function ( colIdx ) {
    $( 'input', table.column( colIdx ).header() ).on( 'keyup change', function () {
        table
            .column( colIdx )
            .search( this.value )
            .draw()
            .makeEditable();
    } );
   } );

  } );
  • Hi Kartikeya,Thanks for sharing your thoughts. But still am getting the same error."Uncaught type error: undefined is not a function" – Do It Jun 29 '14 at 04:38
0

this is not answer but would like if you have found an answer to your question as I am facing similar challenge and the reason is because you have used the capital "D" for datatable if you had used the small "d" as in

var table= $('#example').dataTable( { // "sScrollY": 250

} );

makeEditable will work for that. But in my case, I need to use the capital "D" because I need to use the row().child() function of the datatable.

Kunbi
  • 628
  • 6
  • 13
  • Kunbi, you are right, If we use lower case "d", then we did not get any error. But i need to apply header filter for all the columns. In this case the code i have written for to apply the header column filter, will not work , it will work if we use jquery.dataTables.min.js(1.10.2). I have found that updated version of jquery.dataTables.editable.js which is compatible to jquery1.10.2.js ,is not available. – Do It Jul 06 '14 at 09:03
  • I have modified code to apply the filter at header column level,it will compatible to jquery1.7.2.js and jquery.dataTables.min.js(1.7.2) // Apply the filter $("thead input").keyup( function () { /* Filter on the column (the index) of this element */ table.fnFilter( this.value, $("thead input").index(this) ); } ); – Do It Jul 06 '14 at 09:12
  • Actually, I am using the web hosted version of jQuery, so what I did is to make two different declarations. The small letter "d" when I need to use makeEditable and the big "D" when I need to use the row.child() and its working. However, now my challenge is if I try to add a new column to the datatable using the makeEditable function, it doesn't work. it gives me error. I would like to know if you have an answer to that.Thanks. – Kunbi Jul 07 '14 at 10:20
  • Latest version of jquery.dataTables.editable.js is required, it's third party software and not part of jQuery and Datatable. Currently not available.. – Do It Jul 12 '14 at 07:16