私はエレクトロンの新人です。
Electron を使用して小さなアプリを構築しようとしています。私がやろうとしているのは、フロントエンドから取得したデータを挿入することです。
私は SQL を使用しており、データベースを持っており、フロントエンドが提案できるように反応します。
データを挿入するには？誰でも解決策を教えてください。
私を助けてください。
私はこのように試しました: これは私の Index .html であり、ここから取得したデータを投稿する必要があります。ZIpcode.js には MySQL コードが含まれます。
索引.html
<div>
<form className =" col-lg-12 form-horizontal" role="form" >
<nav className="navbar navbar-inverse navbar-fixed-top">
<div className = "container-fluid">
<div className="navbar-header">
<div className="col-lg-12 col-sm-12 col-xs-12">
<div className ="row">
<div className="col-lg-2 col-sm-2 col-xs-2">
<button type="submit" id="btnSubmit" className="btn btn-primary center-block">
Submit
</button>
</div>
<div className="col-lg-1 col-sm-1 col-xs-1">
<button type="reset" className="btn btn-danger center-block">
Cancel
</button>
</div>
</div>
</div>
</div>
</div>
</nav>
<br/><br/><br/>
<div className ="container">
<div className = "row">
<div className = "row">
<div className="col-lg-6 col-sm-6 col-xs-6">
<div className="form-group">
<div className="col-lg-1 col-sm-1">
</div>
<label className="control-label col-lg-4 col-sm-4 col-xs-12" for="ZipCode">Zip Code:</label>
<div className="col-lg-6 col-sm-6 col-xs-12">
<input type="number" className="form-control" id="ZipCode" ref = "ZipCode" placeholder="Zip Code" required="true"/>
</div>
<div className="col-lg-1 col-sm-1">
</div>
</div>
</div>
<div className="col-lg-6 col-sm-6 col-xs-6">
<div className="form-group">
<label className="control-label col-lg-4 col-sm-4 col-xs-12" for="ShortCode">Short Code:</label>
<div className="col-lg-6 col-sm-6 col-xs-12">
<input type="Short Code" className="form-control" id="ShortCode" ref = "ShortCode" placeholder="Short Code" required="true"/>
</div>
<div className="col-lg-2 col-sm-2">
</div>
</div>
</div>
</div>
<div className = "row">
<div className="col-lg-6 col-sm-6 col-xs-6">
<div className="form-group">
<div className="col-lg-1 col-sm-1">
</div>
<label className="control-label col-lg-4 col-sm-4 col-xs-12" for="City">City:</label>
<div className="col-lg-6 col-sm-6 col-xs-12">
<input type="City" className="form-control" id="City" ref = "City" placeholder="City" required="true"/>
</div>
<div className="col-lg-1 col-sm-1">
</div>
</div>
</div>
<div className="col-lg-6 col-sm-6 col-xs-6">
<div className="form-group">
<label className="control-label col-lg-4 col-sm-4 col-xs-12" for="State">State:</label>
<div className="col-lg-6 col-sm-6 col-xs-12">
<input type="State" className="form-control" id="State" ref = "State" placeholder="State" required="true"/>
</div>
<div className="col-lg-2 col-sm-2">
</div>
</div>
</div>
</div>
<div className = "row">
<div className="col-lg-6 col-sm-6 col-xs-6">
<div className="form-group">
<div className="col-lg-1 col-sm-1">
</div>
<label className="control-label col-lg-4 col-sm-4 col-xs-12" for="PhoneAreaCode">Phone Area Code:</label>
<div className="col-lg-6 col-sm-6 col-xs-12">
<input type="PhoneAreaCode" className="form-control" id="PhoneAreaCode" ref = "PhoneAreaCode" placeholder="Phone Area Code" required="true"/>
</div>
<div className="col-lg-1 col-sm-1">
</div>
</div>
</div>
<div className="col-lg-6 col-sm-6 col-xs-6">
</div>
</div>
<div className = "row">
<div className="col-lg-6 col-sm-6 col-xs-6">
<div className="form-group">
<div className="col-lg-1 col-sm-1">
</div>
<label className="control-label col-lg-4 col-sm-4 col-xs-12" for="TaxCode">Tax Code:</label>
<div className="col-lg-6 col-sm-6 col-xs-12">
<input type="TaxCode" className="form-control" id="TaxCode" ref = "TaxCode" placeholder="Tax Code" required="true"/>
</div>
<div className="col-lg-1 col-sm-1">
</div>
</div>
</div>
<div className="col-lg-6 col-sm-6 col-xs-6">
<div className="form-group">
<label className="control-label col-lg-4 col-sm-4 col-xs-12" for="Tax">%Tax:</label>
<div className="col-lg-6 col-sm-6 col-xs-12">
<input type="number" className="form-control" id="Tax" ref = "Tax" placeholder="Tax" required="true"/>
</div>
<div className="col-lg-2 col-sm-2">
</div>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
zipcode.js
window.onload = function() {
document.getElementById("btnSubmit").onclick = function () {
alert('Submit button click');
var v1 = document.getElementById('ZipCode').value;
var v2 = document.getElementById('ShortCode').value;
var v3 = document.getElementById('City').value;
var v4 = document.getElementById('State').value;
var v5 = document.getElementById('PhoneAreaCode').value;
var v6 = document.getElementById('TaxCode').value;
var v7 = document.getElementById('Tax').value;
//alert("ZipCode:"+v1+" "+"ShortCode:"+v2+" "+"City:"+v3)
//sql connection
//alert('after Connection');
var Connection = require('tedious').Connection;
var config = {
userName: 'xx',
password: 'xxxx',
server: 'xxxxxx', // You can use 'localhost\\instance' to connect to named instance
database: 'XXXXX',
options: {
database: 'XXXXX'
},
}
alert("SQL")
var connection = new Connection(config);
connection.on('connect',function(err){
alert('hai')
if(err){
console.log(err)
}
executeStatement();
});
Request = require('tedious').Request;
function executeStatement(){
//alert(v1,v2,v3,v4,v5,v6,v7)
var request = new Request("INSERT INTO XXXXX VALUES ("+v1+",'"+v2+"','"+v3+"','"+v4+"','"+v5+"','"+v6+"',"+v7+")",
function(err,result){
console.log(request)
if(err){
console.log(err);
}else{
console.log(result)
}
});
connection.execSql(request);
}
alert('completion')
}
}