I want to Post data's from a handsontable ([handsontable.com][1]) spreadsheet for get them on PHP with $_REQUEST.
My page is intended to allow the input of information and then to validate them by a button.
I tried for a <form>
$ a. Ajax
or $. Post
but I wasn't able to do what I wanted.
Here is my code :
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script data-jsfiddle='common' src='add/jquery.handsontable.full.js'></script>
<link data-jsfiddle='common' rel='stylesheet' media='screen' href='add/jquery.handsontable.full.css'>
<script data-jsfiddle='common' src='add/jquery.handsontable.removeRow.js'></script>
<script data-jsfiddle='common' src='add/numeral.de-de.js'></script>
<link data-jsfiddle='common' rel='stylesheet' media='screen' href='add/jquery.handsontable.removeRow.css'>
<!-- the below is only needed for DateCell (uses jQuery UI Datepicker) -->
<script data-jsfiddle='common' src='add/jquery-ui.custom.min.js'></script>
<link data-jsfiddle='common' rel='stylesheet' media='screen' href='add/jquery-ui.custom.css'>
<script type="text/javascript">
$(document).ready(function(){
$("#spreadsheet").submit( function () {
$.post(
'index.php',
$(this).serialize(),
function(data){
alert(data);// alert the data from the server
}
);
return false;
});
});
</script>
<body>
<div id="container">
<div class="columnLayout">
<div class="rowLayout">
<div class="descLayout">
<div class="pad" data-jsfiddle="tablecompt">
<h2>Compta</h2>
<div id="tablecompt"></div>
</div>
</div>
<div class="codeLayout">
<div class="pad">
<FORM NAME='spreadsheet' class='formulaire' ID='spreadsheet' METHOD='POST'>
<style data-jsfiddle="common">
.handsontable .currentRow {
background-color: #E7E8EF;
}
.handsontable .currentCol {
background-color: #F9F9FB;
}
</style>
<script data-jsfiddle="tablecompt">
var container = $("#tablecompt");
var people = [
{ctopextract: false}
];
var email_validator_fn = function (value, callback) {
setTimeout(function(){
if (/.+@.+/.test(value)) {
callback(true);
}
else {
callback(false);
}
}, 1000);
};
container.handsontable({
columnSorting: true,
manualColumnResize: true,
manualColumnMove: true,
currentRowClassName: 'currentRow',
currentColClassName: 'currentCol',
removeRowPlugin: true,
rowHeaders: true,
data: people,
minSpareRows: 10,
fixedRowsTop: 1,
contextMenu: true,
beforeChange: function (changes, source) {
},
afterChange: function (changes, source) {
if (source !== 'loadData') {
$("#tablecomptconsole").text(JSON.stringify(changes));
}
},
colHeaders: ['Société', 'TETAB', 'TNUMINT', 'TDOCU', 'CTOPEXTRACT', 'Date comptable', 'Journal', 'Tiers', 'Compte', 'Libellé', 'Débit (€)', 'Crédit (€)', 'Nature', 'TCI', 'TCI1', 'TCI2', 'TCI3', 'TCI4'],
columns: [
{data: 'societe'},
{data: 'tetab'},
{data: 'tnumint', type: 'numeric'},
{data: 'tdocu'},
{data: 'ctopextract', type: 'checkbox'},
{data: 'date', type: 'date'},
{data: 'tjournal', type: 'dropdown', source: ["8A", "8B", "8E", "8F", "8M"]},
{data: 'ttiers'},
{data: 'tcptg'},
{data: 'tlibecr'},
{data: 'debit', type: 'numeric', format: '0,0.00 $', language: 'de-de'},
{data: 'credit', type: 'numeric', format: '0,0.00 $', language: 'de-de'},
{data: 'nature'},
{data: 'tci'},
{data: 'tci1'},
{data: 'tci2'},
{data: 'tci3'},
{data: 'tci4'}
]
});
</script>
<button class='formulaire' type='submit' class='action' NAME='action' id="action" VALUE='M'>Mise à jour</button>
<button class='formulaire' onClick=\"javascript:document.location.href='index.php'\" />Annuler</button>
</FORM>
</div>
</div>
</div>
</div>
</div>
</body>
Could you help me with sending my jQuery spreadsheet from a button to my PHP page (which is the same page).
I'm new in this domain and I haven't been able to find this information. I found examples for Ajax but that doesn't interest me.
Thank you in advance for your help.
-- Sweet