🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
Google Apps Script

Google Apps ScriptはGoogleの製品と第三者のサービスでタスクを自動化するためのJavaScriptのクラウドのスクリプト言語です。

Q&A

解決済

1回答

1775閲覧

HTMLで検索ボックスに入力された値をもとにスプレッドシートを検索して取得した値をformにセットしたい

yamadaman_q

総合スコア22

Google Apps Script

Google Apps ScriptはGoogleの製品と第三者のサービスでタスクを自動化するためのJavaScriptのクラウドのスクリプト言語です。

0グッド

0クリップ

投稿2021/03/01 08:52

現在でGASを使用して簡単なWEBアプリを作成しています。
内容としては、顧客情報の新規登録と登録情報の編集機能だけのシンプルなものです。
初心者で完全に独学なもので不明な部分はすべてwebで調べて作成しているのですが、どうしても引っかかっている内容がありましてご質問させて頂きました。
質問の仕方に問題がありましたら申し訳ありません。

【やりたいこと】
HTML上に設置されたテキストボックスに新規登録した顧客IDを入力し、表示ボタンを押すとformにDB替わりのスプレッドシートでひっかかった値をセットする。

【わからないこと】
なんとなくボタン押下時に入力された値を検索するような流れまではできた気がするのですが、
検索できたデータをどうやってHTMLにセットしていいかがわかりません。

html

1<form id="form_search" onsubmit="return false"> 2 <!--顧客ID--> 3 <div class="form-group"> 4 <label class="control-label col-xs-6">顧客IDを入力して、【表示】ボタンをクリックしてください</label> 5 <div class="control-label col-xs-3"> 6 <input type="text" class="form-control" id="input_id12"> 7 <!--入力時に誤りがある場合などのメッセージはhelp-blockのタグに入れるのか--> 8 <div class="help-block with-errors"></div> 9 </div> 10 <div class="control-label"> 11 <button id="send_button" type="submit" class="btn btn-primary btn-large"> 12 <i class="fa fa-send fa-lg"></i>表示   13 </button> 14 </div> 15 </div> 16 </form> 17 18<form id="r_form1" onsubmit="return false";> 19 <!--区分--> 20 <div class="form-group"> 21 <label class="control-label col-xs-2">区分</label> 22 <div class='col-xs-10'> 23 <select class="form-control" id="select_id1"></select> 24 <div class="help-block with-errors"></div> 25 </div> 26 </div> 27 28 <!--顧客ID--> 29 <div class="form-group"> 30 <label class="control-label col-xs-2" for="input_id1">顧客ID</label> 31 <div class="col-xs-10"> 32 <input type="text" class="form-control" id="input_id1"> 33 <div class="help-block with-errors"></div> 34 </div> 35 </div> 36     <!--氏名--> 37 <div class="form-group"> 38 <label class="control-label col-xs-2" for="input_id1">顧客ID</label> 39 <div class="col-xs-10"> 40 <input type="text" class="form-control" id="input_id1"> 41 <div class="help-block with-errors"></div> 42 </div> 43 </div> 44

JavaScript

1/*修正の検索ボタンを押された時の処理*/ 2$(function(){ 3 $('#form_search').submit(function(e){ 4 var res = confirm("患者情報の表示を行います。よろしいですか?"); 5 if(res == true){ 6 7 searchData(); 8 } 9 }); 10}); 11 12//セレクトボックスのリストを取得 13 function searchData(){ 14 15 var pId = document.getElementById("input_id12").value; 16 17 google.script.run.withFailureHandler(fail).withSuccessHandler(suc).s_Data(pId); 18 19 }
/*-----登録データ表示---------------------------------------------------------------*/ function s_Data(pId){ //シートを取得 var ss = SpreadsheetApp.openById('///////////////////////////////////////'); var sh = ss.getSheetByName("顧客情報マスタ"); //患者基本マスタのデータを取得 var master = sh.getDataRange().getValues(); //取得した患者IDでフィルタリング var inv = master.filter(function(e){return e[5] === pId}); return JSON.stringify(inv); }

取得できたデータをjQueryのボタン押下時の処理のところまで持っていければあとはvalでセットできるのかなぁと考えたりしていますが持っていく方法がいまいちわからなかったり、そもそも考え方ナンセンスなのか。

わかりづらい質問で申し訳ありませんがヒントだけでもわかるとありがたいです。

宜しくお願い致します。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

s_DatareturnしているJSON.stringify(inv)withSuccessHandlerで指定しているsuc関数の第一引数に渡りますので、そこで値をセットすればよいです。

投稿2021/03/01 23:43

macaron_xxx

総合スコア3191

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

yamadaman_q

2021/03/02 06:50

わざわざJQueryにデータを戻さなくても普通にsucでセットすればいいということですね。ありがとうございました。助かりました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問