Form Submit selected (selectable row) to server
Form Submit selected (selectable row) to server
I'm trying to use selectable rows rather than checkboxes + serialize to submit data to server (php page) all I need is one column.
I've managed to get the column info to display using alert, so I know the info is there, however when I submit nothing happens, using print_r/var_dump I can see the only thing being sent is table length: Array ( [tablename_length] => 10 )
All I need is to somehow get the array into the form to be submitted - the info is there
[code]alert("The following data would have been submitted to the server: \n\n"+gaiSelected);[/code]
how do I load gaiSelected array into the form that is being submitted? Thanks,
[code]
var gaiSelected = [];
$(document).ready(function() {
// JQuery Dialog
$('#can').submit(function(){
$('#dialog').dialog('open');
return false;
});
$("#dialog").dialog( "option", "draggable", true );
//data table initialize
var oTable = $('#userstats').dataTable({
"bServerSide": true,
"bProcessing": true,
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"sAjaxSource": "../include/leave_ajax.php",
"fnServerData": function ( sSource, aoData, fnCallback ) {
/* Add some data to send to the source, and send as 'POST' */
aoData.push( { "name": "min", "value": $('#min').val() } );
aoData.push( { "name": "max", "value": $('#max').val() } );
$.ajax( {
"dataType": 'json',
"type": "GET",
"url": "../include/leave_ajax.php",
"data": aoData,
"success": fnCallback
} );
},
"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
if ( jQuery.inArray(aData[0], gaiSelected) != -1 )
{
$(nRow).addClass('row_selected');
}
return nRow;
},
"aoColumns": [
{ "bVisible": 0 }, /* ID column */
null,
null,
null,
null,
null
]
} );
/* Click event handler */
$('#userstats tbody tr').live('click', function () {
var aData = oTable.fnGetData( this );
var iId = aData[0];
if ( jQuery.inArray(iId, gaiSelected) == -1 )
{
gaiSelected[gaiSelected.length++] = iId;
}
else
{
gaiSelected = jQuery.grep(gaiSelected, function(value) {
return value != iId;
} );
}
$(this).toggleClass('row_selected');
} );[/code]
I've managed to get the column info to display using alert, so I know the info is there, however when I submit nothing happens, using print_r/var_dump I can see the only thing being sent is table length: Array ( [tablename_length] => 10 )
All I need is to somehow get the array into the form to be submitted - the info is there
[code]alert("The following data would have been submitted to the server: \n\n"+gaiSelected);[/code]
how do I load gaiSelected array into the form that is being submitted? Thanks,
[code]
var gaiSelected = [];
$(document).ready(function() {
// JQuery Dialog
$('#can').submit(function(){
$('#dialog').dialog('open');
return false;
});
$("#dialog").dialog( "option", "draggable", true );
//data table initialize
var oTable = $('#userstats').dataTable({
"bServerSide": true,
"bProcessing": true,
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"sAjaxSource": "../include/leave_ajax.php",
"fnServerData": function ( sSource, aoData, fnCallback ) {
/* Add some data to send to the source, and send as 'POST' */
aoData.push( { "name": "min", "value": $('#min').val() } );
aoData.push( { "name": "max", "value": $('#max').val() } );
$.ajax( {
"dataType": 'json',
"type": "GET",
"url": "../include/leave_ajax.php",
"data": aoData,
"success": fnCallback
} );
},
"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
if ( jQuery.inArray(aData[0], gaiSelected) != -1 )
{
$(nRow).addClass('row_selected');
}
return nRow;
},
"aoColumns": [
{ "bVisible": 0 }, /* ID column */
null,
null,
null,
null,
null
]
} );
/* Click event handler */
$('#userstats tbody tr').live('click', function () {
var aData = oTable.fnGetData( this );
var iId = aData[0];
if ( jQuery.inArray(iId, gaiSelected) == -1 )
{
gaiSelected[gaiSelected.length++] = iId;
}
else
{
gaiSelected = jQuery.grep(gaiSelected, function(value) {
return value != iId;
} );
}
$(this).toggleClass('row_selected');
} );[/code]
This discussion has been closed.
Replies
Convert the JS array to string and put it in a hidden field - on the server side (PHP) - explode it to get back the array:
on your HTML Form add this in :
[code]onSubmit="setValue()"[/code]
which runs this function:
[code]
function setValue() {
var SelectedRowIds = gaiSelected.toString();
document.can.IDsToString.value = SelectedRowIds;
}
[/code]