我可以混合 jqueryui 和 google app 脚本表单提交吗

Posted 2023-03-06

【中文标题】我可以混合 jqueryui 和 google app 脚本表单提交吗

【英文标题】：Can I mix jqueryui and google app script form submissions

【发布时间】：2012-10-16 17:11:36

【问题描述】：

如此处所述：

https://developers.google.com/apps-script/html_service#GoogleScriptAPI

我在我的 google app scripts html 界面模板中使用了一个小表单来允许提交数据：

<form id='myForm'><input type='button' onclick='google.script.run.processForm(this.parentNode)'></form>

这会触发我脚本中的一个函数，该函数会像这样更新电子表格单元格：

function processForm(params) 
  var ss = SpreadsheetApp.openById(XXXXXXXXX);
  var email_sheet = ss.getSheetByName('Week '+(parseInt(params['week'],10)+1)+' Assignments');
  var range = colName(parseInt(params['assignment'],10)+1) + (parseInt(params['match'],10)+1);
  var existing_val = email_sheet.getRange(range).getValue()
  email_sheet.getRange(range).setValue(existing_val+ params['submission']);

很多事情都与我的大型系统有关，但这样做是允许我班级中的学生提交作业信息，这些信息会被转储到电子表格中与他们的 google 登录相对应的位置，以及当他们刷新时页面，html界面更新以指示收到提交。界面如下：

刚刚完成这项工作，我要开香槟了，因为它将极大地简化学生提交的管理，但目前如果用户点击提交按钮时，界面会更加直观，并且会立即更新删除表格，然后从红十字切换到绿色勾号。目前用户必须重新加载整个页面。

通过阅读文档：

https://developers.google.com/apps-script/html_service#Caja

似乎 jqueryUI 可能是执行此类操作的方法，但我不清楚 jqueryUI 是否可以很好地与 google app 脚本表单提交配合使用。我将详细研究 jqueryUI，但我想知道是否有人知道这两者是否会混合使用。

通过搜索主题，我看到 JQueryUI 不会与谷歌应用脚​​本 UIInstance 混合

How to mix jQuery and a UiInstance for generating GUIs

但是我正在使用 htmlinstance，所以 jquery 应该没问题吧？还是我完全找错了树？

在此先感谢

附言我真的需要弄清楚如何更好地设置提交按钮的样式，而且如果您在文本文件中点击返回，似乎会发生完​​整的表单提交并给出此错误“此网页不可用 无法找到位于 9f9e682e-25ca-4eae-b4f9-6cac8db35390.foo.bar 的服务器，因为 DNS 查找失败。 DNS 是将网站名称转换为其 Internet 地址的网络服务。” - 我已经在网上搜索了该错误，但并不高兴 - 希望 JQueryUI 可以再次帮助我解决这个问题，即使使用 Caja 清理...就我是否应该使用我目前获得的界面来减少损失获得意见...

【参考方案1】：

HtmlService 可以正常使用 jQuery 和 jQueryUI，它不会干扰脚本的表单提交部分。页面、表单或其外观不会影响其值的处理。

但是，根据您的描述，您真正需要进行“图标切换”和“隐藏输入和按钮”的只是一些好的旧 javascript。 jQuery 可以使它更容易（更少的代码），但如果你不习惯纯 javascript，它可能只会给你更多的设置麻烦。这同样适用于 jQueryUI，它可以更轻松地构建漂亮的界面，但你的似乎有些简单，而且 jQueryUI 可能有点矫枉过正。

希望这会有所帮助。

【讨论】：

谢谢，这听起来是个好建议。我一直假设如果 jQueryUI 工作，它会通过允许我在更高级别上操作来简化事情，并让我可以访问漂亮的淡入淡出效果，但现在你建议我试试 POJS :-)