詳細画面でポップアップを立ち上げて入力する方法

お世話になります。初投稿です。

詳細画面のヘッダースペースにボタンを配置し、

そのボタンを押すと詳細画面の任意のカラムの内容を引き継いだ

ポップアップが立ちあがって、内容を編集

のちのちはその内容をsendgridで適当な人にメールで送信したいのですが、

ボタンを押してポップアップが立ち上がる処理のやり方が分かりません。

カスタマイズビューではなく、viewを直接いじれないため、

innnerhtmlでポップアップ用のフォーム画面を追加しないといけないと

思うのですが、そのあたりが実装の仕方がよく分かりません。

ざっくりとした説明で申し訳ありませんが分かる方おりましたら

よろしくお願いします。

maitake  さん、こんにちは。

jQuery UI の Dialog https://jqueryui.com/dialog/ を使うのが一般的の様です。

流れとしては次の様になるかと思います。

  1. 詳細画面にボタンを設置(例えばkintoneのメニュー右の空白を利用する)
  2. ダイアログ画面のHTMLを準備(変数にダイアログ用のHTMLをセットする)
  3. ダイアログ画面を表示する関数を作成(例えば $( “ダイアログ用のHTML” ).dialog().dialog(‘open’); など)
  4. ボタンクリックイベントに3.のダイアログ表示関数の実行を設定

参考になるソースをdeveloper network で探してみたところ下記がありました。

https://developer.cybozu.io/hc/ja/community/posts/255558266

処理の内容は、一般的なJavaScriptの世界の話なので、JavaScript ダイアログ や jQuery ダイアログ

で検索すると良いかと思います。

返信ありがとうございます。頂いたURL参考にチャレンジしてみます。

 

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。