我是一個JavaScript的初學者,我有點迷失在所有的東西。Handsontable的數據到sql數據庫
我想從我的sql數據庫中推送我的所有數據。我遵循handontable給出的例子,但它不起作用。
下面是代碼,在那裏我創造我handsontable:
'
$(document).ready(function() {
var container = document.getElementById('Grille_competences');
var headerRenderer = function (instance, td, row, col, prop, value,
cellProperties) {
Handsontable.renderers.TextRenderer.apply(this, arguments);
td.style.fontWeight = 'bold';
td.style.textAlign = 'center';
td.style.backgroundColor = '#B0C4DE';
};
//Initialisation des données de la grille.
var data = [["Compétences","Description","Code",""],
["", "", "",""],
["","", "",""],
["","", "",""],
["","", "",""],
["","", "",""]];
//Création de la grille
hot = new Handsontable(container, {
data: data,
height: 800,
width: 1183,
colWidths: [35,200,25,80],
manualRowResize: true,
colHeaders: true,
rowHeaders: true,
mergeCells: true,
stretchH: 'all',
columnSorting: true,
contextMenu: true,
contextMenuCopyPaste: {
swfPath: './zeroclipboard/dist/ZeroClipboard.swf'
},
//Fonctionnalités lors d'un clic droit dans la grille.
contextMenu: {
items: {
"row_above": {
name: 'Insérer ligne au dessus',
disabled: function() {
return hot.getSelected()[0] === 0;
}
},
"row_below": {
name: 'Insérer ligne en dessous',
disabled: function() {
return hot.getSelected()[0] === 0;
}
},
"hsep1": "---------",
"col_left": {
name: 'Insérer colonne à gauche',
disabled: function() {
return hot.getSelected()[0] === 0;
}
},
"col_right": {
name: 'Insérer colonne à droite',
disabled: function() {
return hot.getSelected()[0] === 0;
}
},
"hsep2": "---------",
"remove_row": {
name: 'Supprimer la ligne',
disabled: function() {
return hot.getSelected()[0] === 0;
}
},
"remove_col": {
name: 'Supprimer la colonne',
disabled: function() {
return hot.getSelected()[0] === 0;
}
},
"hsep3": "---------",
"copy": {
name:'Copier',
disabled: function() {
return hot.getSelected()[0] === 0;
}
},
"paste": {
name: 'Coller',
disabled: function(){
return hot.getSelected()[0] === 0;
}
},
"hsep4": "---------",
"undo": {
name:'Précédent',
disabled: function(){
return hot.getSelected()[0] === 0;
}
},
"redo": {
name: 'Suivant',
disabled: function(){
return hot.getSelected()[0] === 0;
}
},
"hsep5": "---------",
"make_read_only": {
name: 'Lecture seule',
disabled: function() {
return hot.getSelected()[0] === 0;
}
},
"alignment": {
name: 'Alignement du texte',
disabled: function() {
return hot.getSelected()[0] === 0;
}
},
"mergeCells": {
name: 'Fusionner les cellules',
disabled: function() {
return hot.getSelected()[0] === 0;
}
},
},
},
//Entetes de la grille en lecture seule.
cells: function(row, col, prop) {
var cellProperties = {};
if(row===0){
cellProperties.renderer = headerRenderer;
}
if(row === 0 && col <3){
cellProperties.readOnly = true;
}
return cellProperties;
}
});
//Lors d'un clic sur le bouton valider, transmission des données de la grille.
});
$('#save').click(function(){
$.ajax({
url: "testGetData.php",
dataType: 'json',
data: {data: hot.getData() },
type: 'GET',
success: function() {
$console.text('Saved !');
}
});
});
`
,這裏是爲testGetData.php代碼file:
<?php
session_start();
require_once('./lib/demo/php/functions.php');
$db = getConnection();
createBDD($db);
if($db)
{
$db = new PDO('mysql:host=localhost; dbname=bdd'.$_SESSION['login'],'root', 'passwd');
createTableBDD($db);
foreach ($_GET['data'] as $value){
$query = $db->prepare('INSERT INTO Competences(libelle) VALUES('.$value[0].')');
$query->execute();
}
}
?>
如果我明白了,handsontable發送$ _REQUEST到testGetData.php。所以,我可以訪問$ _GET超全球。考慮到這個變量是許多數組的數組,foreach中的$值與其中一個數組重合。但我不明白爲什麼沒有推動。 我修改了我的sql數據庫的getConnection()函數。
在當前情況下,函數'createTableBDD()'是必需的。用戶可以創建多個人格網格,併爲一個網格創建一個數據庫,現在更簡單。我沒有任何選擇,它是該項目的一個組成部分。每一列都與數據庫中的表格匹配,用戶需要能夠合併單元格(數據庫的一個大問題),所以我認爲這不夠。 – arkodath
我可以看到你來自哪裏,但我強烈建議不要用每個ajax調用創建新表。如果不再需要他們,誰將再次「放棄」他們? – cars10m
我重新組織了我的類圖,我認爲它可以與我需要的只有一個數據庫匹配。我會做一些測試,然後我會更新這個主題 – arkodath