質問をすることでしか得られない、回答やアドバイスがある。

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

新規登録して質問してみよう
ただいま回答率
85.48%
PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

1回答

817閲覧

セレクトボックスの値が変化した時に編集画面内の値を取得したい

t-ju

総合スコア14

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2019/07/11 08:54

編集2019/08/01 01:21

事象

管理サイトをメンテしています。
タブを選択→タブ内のある「編集」ボタンを押下したら同じタブ内が編集モードに切り替わりDBから取得した内容を編集→保存できる様な画面です。
タブは先頭にある追加タブがあり複数作成できます。

タブ内で「編集」ボタンを押下すると”editGroupHtml”の変数内で表示させたいHTMLをコーディングし下記の様にコーディングされ作成されたHTMLをセットしています。

$('#' + currentGroupName).empty().append(editGroupHtml);

実現したいこと

編集画面(生成されたHTML)内のセレクトボックスの値が変化した時に編集画面内の値を取得したいのです。
私なりにコーディングしているのですが、無反応&シンタックスエラーが発生しています。
何方かアドバイスをお願い致します。

よろしくお願い致します。

試したこと

セレクトボックスがチェンジされた際に値を取得したいので、下記の様にコーディングし試してみましたがNGでした。

javascript

1 23 $('select[name="selectTypeEdit"]').on('ifChanged', function(){ 4alert(); 5); 6 78$('#' + currentGroupName + 'table.addContentTable tbody #selectTypeEdit' ).change( function() { 9alert(); 10); 11 1213$('[name=selectTypeEdit]').change(function() { 14alert(); 15); 16

補足情報(ツールのバージョンなど)

PHP VER.7
boostrap3

html

1 2 currentGroupName = $(this).closest('.tab-pane').attr('id'); 3 var currentGroupId = $(this).closest('.tab-pane').data('id'); 4 var currentName = $('a[href="#' + currentGroupName + '"]').text(); 5 var editGroupHtml = ` 6 <div class="tab-pane" id="editGroup"><!-- 編集 --> 7 <div style="padding: 3px;"></div> 8 <div class="row"> 9 10 11 </div> 12 </div> 13 <div style="padding: 5px;"></div> 14 <!---------------------- 左 ----------------------> 15 <div class="col-md-6"> 16 <div class="x_panel"> 17 <div style="padding: 5px;"></div> 18 <div class="control-label col-md-8 top_search"> 19 <div class="input-group"> 20 <input type="text" id="addSearch" class="form-control input" placeholder="コンテンツ名で検索"> 21 <span class="input-group-btn"> 22 <button class="btn btn-default" type="button">検索</button> 23 </span> 24 </div> 25 </div> 26 <div class="form-inline"> 27 <!-- update taguchi REVIEW sakuraba --> 28 <select class="form-control selectTypeEdit" name="selectTypeEdit" id="selectTypeEdit" > 29 <option selected="">種別を選択</option> 30 <?php 31 foreach ($db->getAllRecords('types') as $value5) { 32 echo '<option value="' . $value5['id'] . '">' . $value5['name'] . '</option>'; 33 } 34 ?> 35 </select> 36 <!-- update taguchi REVIEW sakuraba --> 37 <select class="form-control" name="selectShortestEdit" id="selectShortestEdit"> 38 <option selected="">最短を選択</option> 39 <option value="10">10分</option> 40 <option value="15">15分</option> 41 <option value="20">20分</option> 42 <option value="30">30分</option> 43 <option value="60">60分</option> 44 <option value="61">61分</option> 45 <option value="240">240分</option> 46 <option value="720">720分</option> 47 </select> 48 </div> 49 <br> 50 51 </table> 52 </div><!-- x_panel --> 53 </div><!-- col-md-6 --> 54 55 </div><!-- x_panel --> 56 </div><!-- col-md-6 --> 57 </div><!-- 編集 --> 58 `;

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

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

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

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

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

yambejp

2019/07/11 09:06

最低限動作が確認できる内容にしてほしい (埋め込まれたPHPの記述は回答者側で把握できない)
t-ju

2019/07/12 00:04

mts10806様、yambejp様 回答ありがとうございます。 初回投稿でしたので何もわからず投稿してしまいました。 コードはマークダウンのcode機能を利用を見てみます。
m.ts10806

2019/07/12 00:12

質問は編集できますので適宜ご対応ください。
t-ju

2019/07/12 08:31

自己解決しました。 返信頂いた方、ありがとうございました。
m.ts10806

2019/07/12 08:45

それはいいのですが、せめてコードのマークダウン対応だけでもしておいてください その後に、自身で解決までの経緯を具体的に回答を投稿してベストアンサーに選んでください。
t-ju

2019/08/01 01:28

更新しました、遅れまして済みませんでした。。。
m.ts10806

2019/08/01 01:29

あ、回答でもコードはマークダウンで・・ 後から見た人も見やすくなりますので
guest

回答1

0

自己解決

下記で全体を取得し、コピー元の対象のデータを取得する様にしました。

javascript

1 2var thisContent = $(this).closest('.content'); 3$.each(thisContent.find('#' + bodyData), function(index, value) { 4}); 5

他のタブの内容をこれで取得できるようになりました。

投稿2019/08/01 01:27

編集2019/08/01 01:30
t-ju

総合スコア14

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問