Wie laden Sie Daten auf und speichern Sie Daten von einem Mobilfunk in einer MySQL -Datenbank? ⇐ HTML

[Guest]

Ich entwickle eine Web -App, in der Benutzer Daten in eine Tabelle wie die Benutzeroberfläche eingeben und auf eine Schaltfläche Senden klicken können. Die Daten werden in einer MySQL -Datenbanktabelle gespeichert. < /p>
I Baut das Projekt mit Vite auf und basiert auf der grundlegenden Benutzeroberfläche. Ich habe jedoch Probleme, mit der Backend -Implementierung zu beginnen

Code: Select all

import './style.css';
import HyperFormula from 'hyperformula';

document.querySelector('#app').innerHTML = `

SUBMIT
`;

import Handsontable from 'handsontable';
import 'handsontable/dist/handsontable.full.min.css';
import { registerAllModules } from 'handsontable/registry';

registerAllModules();

const fakeDataset = [
{
id: 1,
name: 'John',
secondName: 'Doe',
age: 30,
location: 'New York',
},
];

const hyperformulaInstance = HyperFormula.buildEmpty({
// to use an external HyperFormula instance,
// initialize it with the `'internal-use-in-handsontable'` license key
licenseKey: 'internal-use-in-handsontable',
});

const container = document.querySelector('#example1');
const hot = new Handsontable(container, {
//data: fakeDataset, commenting this out will load mockup data
startCols: 9, //number of empty columns
startRows: 100, //numbver of empty rows
height: 500, //hight in pixels
colHeaders: [
'Date of Service',
'Claimant Number',
'Service Type',
'Quantity per Claimant',
'Pay Rate each',
'Pay Rate extended',
'Zip code',
'Mobile',
'E-mail',
], //can pass true to get default A,B,C column headers
columns: [
{
type: 'date',
dateFormat: 'MM/DD/YYYY',
correctFormat: true,
defaultDate: '01/01/1900',
// datePicker additional options
// (see https://github.com/dbushell/Pikaday#configuration)
datePickerConfig: {
// First day of the week (0: Sunday, 1: Monday, etc)
firstDay: 0,
showWeekNumber: true,
/*disableDayFn(date) {
// Disable Sunday and Saturday
return date.getDay() === 0 || date.getDay() === 6;
}*/ //this is to disable Sundays and Saturdays
},
},
{
type: 'text',
allowInvalid: false,
},
{
type: 'dropdown',
source: ['a', 'b', 'c', 'd', 'e', 'f'],
allowInvalid: false,
},
{
type: 'numeric',
allowInvalid: false,
},
{
type: 'numeric',
allowInvalid: false,
},
{
type: 'numeric',
source: 'PROD(D:E)',
allowInvalid: false,
},
],
rowHeaders: true, //this enables the 1, 2, 3 row headers
contextMenu: true, //this is a menu that will allow to add/remove row/column if you open it up with RMB on any cell
autoWrapRow: true, //this allows to move to another row with arrows when you are in the last cell
autoWrapCol: true, //this allows to move to another row with arrows when you are in the last cell
licenseKey: 'non-commercial-and-evaluation', //this is only for evaluation, after the purchase you will replace that with your own key
});

document.querySelector('.save').addEventListener('click', () => {
let alteredDataset = hot.getData();
console.log(alteredDataset);
//this is the place to send it back to the server
});

So schaut es im Browser aus. sstatic.net/k1m8w.png " /> < /p>
Ich möchte eine Funktionalität implementieren, in der Benutzer Daten in das Datenraster eingeben und auf die Schaltfläche Senden klicken können, um die Daten in eine MySQL -Datenbank zu speichern Tabelle mit den gleichen Feldern. Ich bin neu bei Node.js und verwirrt darüber, wie ich anfangen soll.