GASのHTMLのformの属性が効果を持たない…

Question

GASのHtmlserviceで、

function doGet() {  
  var html = HtmlService.createTemplateFromFile('reportInput');
  return html.evaluate();
}  

とかで返しているページ

<form action="#"><table><tbody>
<tr><th>管理番号</th><td><input type="text" name="f_0" disabled></td></tr>

<tr><th>タイトル</th><td><input type="text" name="f_1"></td></tr>

<tr><th>タイトル/ひら仮名</th><td><input type="text" name="f_2"></td></tr>

<tr>
<th>巻数</th>
<td><input type="text" name="f_3"></td>
</tr>

<tr><th>ステータス</th><td>
<select name="f_4"><option value="購入済">購入済</option><option value="未購入">未購入</option><option value="紛失中">紛失中</option><option value="貸与中">貸与中</option><option value="その他">その他</option></select>
</td></tr>

<tr><th>作者・著者・原作者等</th><td><input type="text" name="f_5"></td></tr>

<tr><th>出版社・発行所等</th><td><input type="text" name="f_6"></td></tr>

<tr><th>Cコード</th><td><input type="text" maxlength="4" name="f_7" required></td></tr>

<tr><th>定価(単位:円)</th><td><input type="text" name="f_8"></td></tr>

<tr><th>ISBN</th><td><input type="text" name="f_9"></td></tr>

<tr><th>書籍JAN</th><td><input type="text" name="f_10"></td></tr>

<tr><th>備考</th><td><textarea name="f_11" value="--none--">--none--</textarea></td></tr>

</tbody>
</table><!-- end table -->
<input type="button" name="btn" onclick="google.script.run.withSuccessHandler(update).myFunction(this.parentNode);" value="登録する">
</form>

上の

<input type="text" maxlength="4" name="f_7" required>

の部分にrequiredやmaxlengthやpatternなどを記述してみましたが記述したとおりに入力制限されずに、果ては空白のままでも送信されてしまいます。
仕様としてこの3つが聞かないのかこちらの書き方がおかしいのか別の答えが存在するのかというのを教えていただきたいです。

言葉が足りなかったら追記いたしますので追記依頼をコメントしてください。
ご回答のほどよろしくお願いいたします。

Comments

[m.ts10806]

actionはなぜ#なのでしょうか。

[----------]

送信する先がGASなので onclick="google.script.run.withSuccessHandler(update).myFunction(this.parentNode);"に送信しています#を付けたのは今まで勉強してきたサイトが送信せーへん時に#をつけてはったからです。とったバージョンも試してみましたが……状況は変わらなかったです。

[macaron_xxx]

私の環境では少なくともmaxlengthは効きましたが…。

Answer 1

submitしてないのでは？(requiredはsubmitでチェックがかかるはずなので、onclickでajaxで投げるとhtmlのルールとしてのrequiredがチェックされない)

Comments

[----------]

何か他に代替手段としていい方法はないですか？
やっぱりGAS側でいじるしかないですか？

[papinianus]

gasで値が埋まっているか見るか、ajaxをなげているmyfunctionで見るか。本当にsubmitするか。
あるいは、gasでできるかどうか未確認ですが、ボタン自体をsubmitにかえて、onsubmitのイベントハンドラでpreventdefaultしてmyFunctionに投げさせる、とかですかね。
bootstrapとかを使っていますが、https://qiita.com/tamtam0847/items/8b79754bb10fe58a01a3 みたいなものも参考になれば。

[----------]

ご回答ありがとうございました。来週の土日にやってみます。????