Jeditable and DataTables

stobywan

I need to get j editable working with php and mysql to UPDATE the table and I cannot seem to get the the table to update correctly. I can get the serverside to bring in the info and at one point I had jeditable working as well but it would not update the mysql table. here is the initialisation code I have currently.... without the the jeditable handlers.... Can someone help me get the right code block here and help me to understand how to UPDATE the table
the first row in the table is an auto increment id that i would like the row to be labeled with for Updates...Thank you
"[code]
$(document).ready(function() {
$('#example').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "server_processing.php"
} );
} );
[/code]"

stobywan

Icannot seem to get these two peices to work in harmony and update the database as well.... I am using the server_processing.php edited with my database loggin credetials and the data is being pulled into datatables ......"[code]$(document).ready(function() {
/* Init DataTables */
var oTable = $('#example').dataTable();

/* Apply the jEditable handlers to the table */
$('td', oTable.fnGetNodes()).editable( 'editable_ajax.php', {
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnUpdate( sValue, aPos[0], aPos[1] );
},
"submitdata": function ( value, settings ) {
return {
"row_id": this.parentNode.getAttribute('id'),
"column": oTable.fnGetPosition( this )[2]
};
},
"height": "14px"
} );
} );[/code]"

allan

Hi stobywan,

Because the table is being completely redrawn on each draw, you need to make use of the fnDrawCallback function to add jEditable to the new nodes (this is only neede for server-side processing btw). An example of how to do that is here:
http://datatables.net/forums/comments.php?DiscussionID=2754#Item_7

Allan

stobywan

Warning: mysql_fetch_assoc(): supplied argument is not a valid MySQL result resource in /home/content/93/5894593/html/my_store/storeadmin/inventory_list.php on line 285
Can you help me understand how this table works my table name is products should that be the "php echo $row_id['id']; "???


"[code]




id
product_name
price
taxable_goods
details
category
subcategory
ship_weight
sale_price



<?php do { ?>


<?php echo $row_id['id']; ?>
<?php echo $row_id['product_name']; ?>
<?php echo $row_id['price']; ?>
<?php echo $row_id['taxable_goods']; ?>
<?php echo $row_id['details']; ?>
<?php echo $row_id['category']; ?>
<?php echo $row_id['subcategory']; ?>
<?php echo $row_id['ship_weight']; ?>
<?php echo $row_id['sale_price']; ?>



<?php } while ($row_id = mysql_fetch_assoc($id)); ?>




id
product_name
price
taxable_goods
details
category
subcategory
ship_weight
sale_price















[/code]"

stobywan

I am using the server_processing_post.php with my database credentials but I am getting the assoc error from above?

and the jeditable is still not enabled but data is coming through....

stobywan

This is my jscript

"[code]var asInitVals = new Array();

$(document).ready(function() {
var oTable = $('#example').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "server_processing.php",

"sPaginationType": "full_numbers",


});

/* Apply the jEditable handlers to the table */
$('td', oTable.fnGetNodes()).editable( 'server_processing_post.php', {
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnUpdate( sValue, aPos[0], aPos[1] );
},
"submitdata": function ( value, settings ) {
return { "row_id": this.parentNode.getAttribute('id') };
},
"height": "14px"
} );

$("tfoot button").submit( function () {
/* Filter on the column (the index) of this element */
oTable.fnFilter( this.value, $("tfoot input").index(this) );
} );


$("a").click(function() {
oTable.fnFilter( "A" );
return false;
});

$(":button").click(function() {
oTable.fnFilter( this.value );
return false;
});




} );
[/code]"

AKraisser

Remove to http://datatables.net/forums/comments.php?DiscussionID=3738&page=1#Item_1

allan

@stobywan: Have a look at the link I posted earlier - you'll need to use fnDrawCallback if you are using server-side processing: http://datatables.net/faqs#ss_events . Something along these lines:

[code]
var oTable = $('#example').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "zero_config_b.php",
"sPaginationType": "full_numbers",
"fnDrawCallback": function () {
$('td', this.fnGetNodes()).editable( 'SaveToFile.php', {
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnUpdate( sValue, aPos[0], aPos[1] );
},
"submitdata": function ( value, settings ) {
return { "row_id": this.parentNode.getAttribute('id') };
},
"height": "14px"
} );
}
});
[/code]

@AKraisser: Can you post your question in a new thread please, so we don't have multiple conversations going on in a single one :-)

Allan

stobywan

Now the $row_id is not a valid variable what is in the "saveToFile.php file? maybe this is my issue??
This is building the table but every cell has an error Variable not found and the mysql assoc is also wrong so the row id or the id from my database is not being found
I am currently using your file called server_processing_post.php with my db log credentials
Thank you for your support btW!

allan

So the code:

[code]
this.parentNode.getAttribute('id')
[/code]
is trying to read the ID attribute of the TR element ('this' in that context is the TD cell) - but there isn't one set, hence it is failing. So there are two options - you could add an ID to the TR, or you can read the ID from the HTML in the row.

[code]
oTable.fnGetData( this.parentNode )[0];
[/code]
should do the trick.

Allan

stobywan

[code]var oTable = $('#example').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "server_processing.php",
"sPaginationType": "full_numbers",
"fnDrawCallback": function () {
$('td', this.fnGetNodes()).editable( 'server_processing_post.php', {
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnGetData( this.parentNode )[0];
oTable.fnUpdate( sValue, aPos[0], aPos[1] );


},
"submitdata": function ( value, settings ) {
return { "row_id": this.parentNode.getAttribute('id') };

},

"height": "14px"
} );
}
});[/code]


still not finding the id or db info do i have that bit in the right place?

stobywan

I need to get the $id from the first row of my db table it is the first column "id" and i need to get it into the but right now this code i placed above is not inserting the id from the id row of my db into the elements so the echo is still getting a variable "row_id" not found....

stobywan

Here is my entire html Page stripped down to just the table and javascript again I am using your scripts server_processing.php for incoming data in the db and I am using your script server_processing_post.php for the jeditable fnDrawcallback both of these script have my db connection info correct

"[code]<!DOCTYPE HTML>


Inventory List





$(document).ready(function() {
var oTable = $('#example').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "server_processing2.php",
"sPaginationType": "full_numbers",
"fnDrawCallback": function () {
$('td', this.fnGetNodes()).editable( 'server_processing_post2.php', {
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnUpdate( sValue, aPos[0], aPos[1] );
oTable.fnGetData( this.parentNode )[0];
},
"submitdata": function ( value, settings ) {
return { "row_id": this.parentNode.getAttribute('id') };
},
"height": "14px"
} );
}
});






<?php include_once"../template_header.php";?>





id
product_name
price
taxable_goods
details
category
subcategory
ship_weight
sale_price



<?php do { ?>


<?php echo $row_id['id']; ?>
<?php echo $row_id['product_name']; ?>
<?php echo $row_id['price']; ?>
<?php echo $row_id['taxable_goods']; ?>
<?php echo $row_id['details']; ?>
<?php echo $row_id['category']; ?>
<?php echo $row_id['subcategory']; ?>
<?php echo $row_id['ship_weight']; ?>
<?php echo $row_id['sale_price']; ?>



<?php } while ($row_id = mysql_fetch_assoc($id)); ?>




id
product_name
price
taxable_goods
details
category
subcategory
ship_weight
sale_price






















<?php include_once"../template_footer.php";?>




[/code]"

allan

Did you try my earlier suggestion of replacing the code "this.parentNode.getAttribute('id')" with the fnGetData statement I gave? As I noted, this.parentNode.getAttribute('id') is trying to get the ID from the TR, but your HTML shows that there is no ID on the TR - hence the error.

Regards,
Allan

stobywan

I did but still nothing>>>>

stobywan

"[code]<!DOCTYPE HTML>


Inventory List





$(document).ready(function() {
var oTable = $('#example').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "server_processing.php",
"sPaginationType": "full_numbers",
"fnDrawCallback": function () {
$('td', this.fnGetNodes()).editable( 'server_processing_post.php', {
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnUpdate( sValue, aPos[0], aPos[1] );

},
"submitdata": function ( value, settings ) {
return { "row_id":oTable.fnGetData( this.parentNode )[0]; };
},
"height": "14px"
} );
}
});






<?php include_once"../template_header.php";?>





id
product_name
price
taxable_goods
details
category
subcategory
ship_weight
sale_price



<?php do { ?>


<?php echo $row_id['id']; ?>
<?php echo $row_id['product_name']; ?>
<?php echo $row_id['price']; ?>
<?php echo $row_id['taxable_goods']; ?>
<?php echo $row_id['details']; ?>
<?php echo $row_id['category']; ?>
<?php echo $row_id['subcategory']; ?>
<?php echo $row_id['ship_weight']; ?>
<?php echo $row_id['sale_price']; ?>



<?php } while ($row_id = mysql_fetch_assoc($id)); ?>




id
product_name
price
taxable_goods
details
category
subcategory
ship_weight
sale_price













[/code]"

allan

You might be getting a Javascript error from that (are you - Firebug will show it?). That would be due to the semi colon in the JSON object. Try this:

[code]
return { "row_id":oTable.fnGetData( this.parentNode )[0] };
[/code]

If that doesn't work, add in "alert( oTable.fnGetData( this.parentNode )[0] );" just before it to check that line of code is doing what is expected.

Allan

stobywan

This is the only error the 's are working ok though


Warning: mysql_fetch_assoc(): supplied argument is not a valid MySQL result resource in /home/content/93/5894593/html/my_store/storeadmin/inventory_list2.php on line 72

Nope the alert returns no alerts and the semi colon did not change anything

stobywan

I apologize for the hassles and I thank you for your support!

allan

Try this and let me know what happens:

[code]
$(document).ready(function() {
var oTable = $('#example').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "server_processing.php",
"sPaginationType": "full_numbers",
"fnDrawCallback": function () {
alert( 'Number of rows: '+ this.fnGetNodes() );
$('td', this.fnGetNodes()).editable( 'server_processing_post.php', {
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnUpdate( sValue, aPos[0], aPos[1] );
},
"submitdata": function ( value, settings ) {
alert( 'Got ID of: '+oTable.fnGetData( this.parentNode )[0] );
return { "row_id": oTable.fnGetData( this.parentNode )[0] };
},
"height": "14px"
} );
}
});
});
[/code]
Allan

stobywan

This is the response


Number of rows: [object HTMLTableRowElement],[object HTMLTableRowElement],[object HTMLTableRowElement],[object HTMLTableRowElement],[object HTMLTableRowElement],[object HTMLTableRowElement],[object HTMLTableRowElement],[object HTMLTableRowElement],[object HTMLTableRowElement],[object HTMLTableRowElement

but then the page opened and it was beautiful! and the the jeditable even worked! then when I entered the edit it gave a new error that was the same but just 1

then the cell exands and some code i cannot catch come then quickly leaves ..... I feel like there is a database connection error in the php script or I am not connecting the id from dbtable into the datatable...


Warning: mysql_fetch_assoc(): supplied argument is not a valid MySQL result resource in /home/content/93/5894593/html/my_store/storeadmin/inventory_list2.php on line 80

allan

Sounds like progress :-). So do you get the "'Got ID of: '" message? Is that the '1' you were referring to? Assuming so, then your PHP script is getting the 'row_id' parameter, I presume? If you have a look at Firebug, it will show you what is being set tot he server, and what is being sent back.

It might be useful to print out your SQL statement as well, and check what that is.

Allan

stobywan

I am getting the "Got Id of: 1" or if it is the row four then it says "got id of:4 and so on so I believe everything there is working correctly...

server_processing.php is getting the sEcho and returning the correct db information the server processing_post.php file in my dev tool did fire off an sEcho as well the the info I typed into the jeditable field was not there but the original db info was ...So it appears that it is not uderstanding the update that I am entering " I use chrome" similar to firebug....and here is the error code I received on the page

and I am still getting the mysql_fetch_assoc error too unless I change it from $id to $sql then it goes away but still the database is not updating the changes correctly....



is not allowed inside . Inserting
before the instead.
inventory_list.php:139 is not allowed inside . Inserting before the instead.
inventory_list.php:139<> is not allowed inside . Inserting <> before the instead.
inventory_list.php:139 is not allowed inside . Inserting before the instead.
inventory_list.php:139<> is not allowed inside . Inserting <> before the instead.
inventory_list.php:139 is not allowed inside . Inserting before the instead.
inventory_list.php:139
is not allowed inside . Inserting
before the instead.
inventory_list.php:157Unmatched encountered. Ignoring tag.
inventory_list.php:159 cannot act as a container inside without disrupting the table. The children of the will be placed inside the instead.
inventory_list.php:364Unmatched encountered. Ignoring tag.

allan

I'm not sure what you PHP code is, so I can't really comment on why it would be giving an error at the moment - but certainly it should have $_REQUEST['row_id'] available - which is the id of the row you want to edit. So it sounds like there is an issue with the PHP script for updating the information on the server - is there any way you can give me a link to the page so I can see what is going on? It might make debugging a little easier :-)

Allan

stobywan

www.bryanstober.com/my_store/storeadmin/inventory_list3.php

This is the link to the bare html /script file for a php include
there is no css on that one at the moment but it is working

stobywan

I am using server_processing_post.php this was a script you had in the datatables package.
I just made the necessary changes to the top of the script

allan

Okay - so the issue is the "Warning: mysql_fetch_assoc(): supplied argument is not a valid MySQL result resource in /home/content/93/5894593/html/my_store/storeadmin/inventory_list3.php on line 67" at the top of the page?

What is at line 67 and just before it?

Allan

stobywan

"[code]<?php } while ($row_id = mysql_fetch_assoc($id)); ?>[/code]" this is line 67

and just before it is this table
"[code]



id
product_name
price
taxable_goods
details
category
subcategory
ship_weight
sale_price



<?php do { ?>


<?php echo $row_id['id']; ?>
<?php echo $row_id['product_name']; ?>
<?php echo $row_id['price']; ?>
<?php echo $row_id['taxable_goods']; ?>
<?php echo $row_id['details']; ?>
<?php echo $row_id['category']; ?>
<?php echo $row_id['subcategory']; ?>
<?php echo $row_id['ship_weight']; ?>
<?php echo $row_id['sale_price']; ?>



[/code]"

stobywan

I have played with
both <?php } while ($row_id = mysql_fetch_assoc($id)); ?> and <?php } while ($row_id = mysql_fetch_assoc($sql)); ?> though $sql is another query for something else but when I change it on the include main page the error does go away with the $sql but the database still does not update....

I think my post script is not working

stobywan

here is the entire script for inventory_list3.php


"[code]



$(document).ready(function() {
var oTable = $('#example').dataTable( {
"bJQueryUI": true,
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "server_processing.php",
"sPaginationType": "full_numbers",
"fnDrawCallback": function () {
//alert( 'Number of rows: '+ this.fnGetNodes() );
$('td', this.fnGetNodes()).editable( 'server_processing_post.php', {
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnUpdate( sValue, aPos[0], aPos[1] );
},
"submitdata": function ( value, settings ) {
//alert( 'Got ID of: '+oTable.fnGetData( this.parentNode )[0] );
return { "row_id": oTable.fnGetData( this.parentNode )[0] };
},
"height": "14px"
} );
}
});
});









id
product_name
price
taxable_goods
details
category
subcategory
ship_weight
sale_price



<?php do { ?>


<?php echo $row_id['id']; ?>
<?php echo $row_id['product_name']; ?>
<?php echo $row_id['price']; ?>
<?php echo $row_id['taxable_goods']; ?>
<?php echo $row_id['details']; ?>
<?php echo $row_id['category']; ?>
<?php echo $row_id['subcategory']; ?>
<?php echo $row_id['ship_weight']; ?>
<?php echo $row_id['sale_price']; ?>



<?php } while ($row_id = mysql_fetch_assoc($id)); ?>




id
product_name
price
taxable_goods
details
category
subcategory
ship_weight
sale_price












[/code]"

allan

The problem isn't so much with your Javascript - but with the SQL and PHP. Where is $id being assigned from an SQL query? I don't see it in the above code. It must be trying to execute a query somewhere and then looping over the result (which is the code above).

Allan