我只是简化了我的问题,希望它会更容易理解。我需要的形式,以更新其金额自动当用户选择一个产品代码。和所有的参考号码,以自动填写的uuid从后端。这是我的第一个问题上栈,我真的希望有人能帮助。
金额FIELD〉〉根据表中的产品代码更新参考FIELD〉〉获取uuid并将其输入字段。
电子表格链接:https://docs.google.com/spreadsheets/d/1CK1bAcrTAOabkzK0YxliVFFh8VFPYIYXDy6ocvnGuGY
代码.js
const APP_NAME = "PRODUCT SALES APP"
var url="https://docs.google.com/spreadsheets/d/1CK1bAcrTAOabkzK0YxliVFFh8VFPYIYXDy6ocvnGuGY/edit#gid=1312844985";
/**
* Link the html file to another one
*/
function link(filename){
return HtmlService.createHtmlOutputFromFile(filename).getContent()
}
/**
* Handle get request
*/
function doGet() {
return HtmlService.createTemplateFromFile("index.html").evaluate().setTitle(APP_NAME).setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL)
}
function getCost(Productcode){
var ss= SpreadsheetApp.openByUrl(url);
var ws = ss.getSheetByName("Products");
var data = ws.getRange(1, 1, ws.getLastRow(), 6).getValues();
//Logger.log(data);
var codesList = data.map(function(r){ return r[2]; });
var costList = data.map(function(r){ return r[4]; });
var position = codesList.indexOf(Productcode);
if (position > -1){
return "₦" + costList[position].toFixed(2);
} else{
return 'Unavailable'
}
}
/**
* Handle post request
*/
function doPost(e){
const postData = e.parameter
const uuid = Utilities.getUuid()
//const image = createFile(postData.data, postData.profile)
//save to spreadsheet
var ss= SpreadsheetApp.openByUrl(url);
var ws = ss.getSheetByName("PRODUCT SALES");
ws.appendRow([new Date(),uuid, postData.category, postData.gender_type, postData.product_class, postData.product_code, postData.first_name, postData.last_name, postData.delivery_address, postData.phone_number, postData.email_address, postData.platinum_id])
const html = `Thanks for your submission! \n${uuid}`
return HtmlService.createHtmlOutput(html).setTitle("Success!")
}
索引.html
<div>
<label for="product_code">Product Code</label>
<select name="product_code" id="productcode" required>
<option value="" disabled selected>Select Product Code</option>
<option value="LC1">"Product Code A"</option>
<option value="LC2">"Product Code A"</option>
<option value="LC3">"Product Code A"</option>
</select>
</div>
<!-- AMOUNT -->
<div>
<label for="amount">Amount</label>
<input type="text" id="amount" required>
</div>
<!-- REFERRENCE-->
<div>
<label for="reff">Reference</label>
<input type="text" id="reff" required>
</div>
<!-- Submit button -->
<div>
<input type="submit" value="BUY NOW">
</div>
</form>
<!-- Link the javascript -->
<?!= link('js'); ?>
</body>
</html>
js.html文件
<script>
const productAmount = document.getElementById("amount")
const referenceNo= document.getElementById("reff")
document.getElementById("productcode").addEventListener("select",getEstimate);
document.getElementById("fn").addEventListener("input",getUuid);
function getEstimate(){
var productCode = document.getElementById("productcode").value;
if(productCode.length > -1){
google.script.run.withSuccessHandler.getCost(Productcode);
document.getElementById("amount").value = cost;
}
function getUuid(){
const uuid = Utilities.getUuid.getValue()
referenceNo = uuid;
}
</script>
1条答案
按热度按时间xwbd5t1u1#
Google Apps脚本服务(包括
Utilities
)不能直接从客户端JavaScript调用。在服务器端代码(.gs文件)上声明调用这些服务的函数,并通过使用google.script.run
和withSuccessHandler
调用回调(作为参数传递的JavaScript函数)来处理服务器端函数输出。有关详细信息,请参阅https://developers.google.com/apps-script/guides/html/communication。代码有一些错误,首先花一些时间学习客户端-服务器通信,然后创建一个更基本的“mcve”,学习如何调试Google Apps脚本Web应用程序。
相关(最近的排在最前面)
参考文献