Help for server side and editable?
Help for server side and editable?
press_ok
Posts: 4Questions: 0Answers: 0
Hi;
I combined some options on datatables like tabletools, colvis, fixed columns from examples and trying to use server side and editable now. Everthings work fine except editable. Because of editable_ajax.php file is a demo. I dont know any javascript or php language just little bit understand and edit written codes. So, can you share to editable_ajax.php content with me? I would ask a lot.
these are my codes
[code]
$(document).ready(function() {
var oTable;
/* Use the elements to store their own index */
$("thead input").each( function (i) {
this.visibleIndex = i;
} );
$("thead input").keyup( function () {
/* If there is no visible index then we are in the cloned node */
var visIndex = typeof this.visibleIndex == 'undefined' ? 0 : this.visibleIndex;
/* Filter on the column (the index) of this element */
oTable.fnFilter( this.value, visIndex );
} );
/*
* Support functions to provide a little bit of 'user friendlyness' to the textboxes
*/
$("thead input").each( function (i) {
this.initVal = this.value;
} );
$("thead input").focus( function () {
if ( this.className == "search_init" )
{
this.className = "";
this.value = "";
}
} );
$("thead input").blur( function (i) {
if ( this.value == "" )
{
this.className = "search_init";
this.value = this.initVal;
}
} );
oTable = $('#example').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "scripts/id.php",
"sDom": 'C,T<"top"ipl<"clear">>rt<"clear">>',
"fnDrawCallback": function () {
$('#example tbody tr td').editable( 'scripts/editable_ajax.php', {
tooltip : "Double click to edit.",
event : "dblclick",
onblur : 'submit',
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnUpdate( sValue, aPos[0], aPos[1] );
//alert(aPos[0]);
},
"submitdata": function ( value, settings ) {
return { "row_id": oTable.fnGetData( this.parentNode )[0], // get the value of first row/column. In my case it is the "id" in database
"column": oTable.fnGetPosition( this )[2] // Column number
};
},
"height": "20px"
} );
},
"aoColumnDefs": [
{ "bVisible": true, "aTargets": [ 2 ] }
],"oColVis": {"activate": "mouseover"
}
} );
new FixedColumns( oTable, {
"iColumns": 0
} );
//$(document).ready(function() {
/* Initialise the DataTable */
//var oTable = $('#example').dataTable(
//{"sScrollX": "100%","sScrollXInner": "150%","bScrollCollapse": true,
//"sDom": 'C,T<"top"iflp<"clear">>rt<"bottom"iflp<"clear">>',
//"oColVis": {"activate": "mouseover"}
//});
} );
function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0;
}
[/code]
I combined some options on datatables like tabletools, colvis, fixed columns from examples and trying to use server side and editable now. Everthings work fine except editable. Because of editable_ajax.php file is a demo. I dont know any javascript or php language just little bit understand and edit written codes. So, can you share to editable_ajax.php content with me? I would ask a lot.
these are my codes
[code]
$(document).ready(function() {
var oTable;
/* Use the elements to store their own index */
$("thead input").each( function (i) {
this.visibleIndex = i;
} );
$("thead input").keyup( function () {
/* If there is no visible index then we are in the cloned node */
var visIndex = typeof this.visibleIndex == 'undefined' ? 0 : this.visibleIndex;
/* Filter on the column (the index) of this element */
oTable.fnFilter( this.value, visIndex );
} );
/*
* Support functions to provide a little bit of 'user friendlyness' to the textboxes
*/
$("thead input").each( function (i) {
this.initVal = this.value;
} );
$("thead input").focus( function () {
if ( this.className == "search_init" )
{
this.className = "";
this.value = "";
}
} );
$("thead input").blur( function (i) {
if ( this.value == "" )
{
this.className = "search_init";
this.value = this.initVal;
}
} );
oTable = $('#example').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "scripts/id.php",
"sDom": 'C,T<"top"ipl<"clear">>rt<"clear">>',
"fnDrawCallback": function () {
$('#example tbody tr td').editable( 'scripts/editable_ajax.php', {
tooltip : "Double click to edit.",
event : "dblclick",
onblur : 'submit',
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnUpdate( sValue, aPos[0], aPos[1] );
//alert(aPos[0]);
},
"submitdata": function ( value, settings ) {
return { "row_id": oTable.fnGetData( this.parentNode )[0], // get the value of first row/column. In my case it is the "id" in database
"column": oTable.fnGetPosition( this )[2] // Column number
};
},
"height": "20px"
} );
},
"aoColumnDefs": [
{ "bVisible": true, "aTargets": [ 2 ] }
],"oColVis": {"activate": "mouseover"
}
} );
new FixedColumns( oTable, {
"iColumns": 0
} );
//$(document).ready(function() {
/* Initialise the DataTable */
//var oTable = $('#example').dataTable(
//{"sScrollX": "100%","sScrollXInner": "150%","bScrollCollapse": true,
//"sDom": 'C,T<"top"iflp<"clear">>rt<"bottom"iflp<"clear">>',
//"oColVis": {"activate": "mouseover"}
//});
} );
function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0;
}
[/code]
This discussion has been closed.
Replies
Exactly what that file will look like will depend very heavily on your server-side - it could be as simple as setting up a PDO DB connection in PHP and then doing an INSERT or UPDATE on the database, or it could be a whole huge amount more complex.
If you are just starting out with PHP / JS, then you might want to take a look at using Editor for DataTables: http://editor.datatables.net/ . It has a 'Generator' tool which will create the SQL, PHP, JS and HTML for you: http://editor.datatables.net/generator :-)
Allan
The editor is expensive for me at least for now. In fact, I'm not a developer can makes money from this apps. Im just an IT guy and try to work this on intranet of the little company.
Sorry I couldnt use the generator. As I said, Im not good in this works.
I was thought, someone else share own codes and I can edit it according to my database. Maybe still someone can do it. I just want to update to datas from table.
Thanks a lot again.
[code]
UPDATE records
SET
field = {post_val},
...
WHERE
id = {post_id}
[/code]
So you just need the PHP around that to create the statement. Most PHP books will be able to give you scripts for connecting to a DB and executing code such as this.
Allan