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

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

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

CentOSは、主にRed Hat Enterprise Linux(RHEL)をベースにした、フリーのソフトウェアオペレーティングシステムです。

PHP

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

jQuery

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

MariaDB

MariaDBは、MySQL派生のオープンソースなリレーショナルデータベースシステムです。 また、MySQLとほぼ同じデータベースエンジンに対応しています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Q&A

1回答

3122閲覧

MariaDBから取得した情報を一つ選択し、フォームに自動で挿入するソースコード

AY6M_

総合スコア14

CentOS

CentOSは、主にRed Hat Enterprise Linux(RHEL)をベースにした、フリーのソフトウェアオペレーティングシステムです。

PHP

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

jQuery

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

MariaDB

MariaDBは、MySQL派生のオープンソースなリレーショナルデータベースシステムです。 また、MySQLとほぼ同じデータベースエンジンに対応しています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

0グッド

0クリップ

投稿2016/07/17 00:05

編集2022/01/12 10:55

以前請求書処理の質問をさせていただいたものです。

結果形は纏まったのですが、他にも似たような処理をするページもあり、色々と調べて実行してみたのですが、知識不足が故にわからない点がいくつかあり、質問させていただきます。

処理の流れとして、

・モーダルウィンドウを開き、MySQLから取得した顧客データを一覧表示
・選択した顧客データを各[会社名][郵便番号][住所]フォームに出力
(選択ボタンを押すとモーダルウインドウは閉じる)

という動作をさせたいです。

モーダルウインドウを開き顧客情報一覧を表示させるところまではできたのですが、

選択ボタンを押してからモーダルウインドウを閉じ情報をフォームに出力する、スクリプトの記述の仕方がわかりません。

以前の質問で教えて頂いたあるサイトを参照し、

$(function() {

$("#sentaku").click(function(){

$.ajax({
type: "POST",
url: "ajax.php",
data: {
"output":
},
success: function(j_data){

// 処理を記述

}
});

});

});

http://raining.bear-life.com/jquery/ajax%e3%82%92%e4%bd%bf%e7%94%a8...

とありますが、顧客情報一覧はwhile文で1行ごとに出力しているため、選択のリンクもhref="ajax.php?id='$row=['顧客ID']'" となるかと思いますが、この記述の仕方がどうしていいかわからないのと、フォームに出力するやり方(以前教えて頂いたサイトを参照したり、調べてみたりしたのですが、上手くいかず...)を教えて頂きたいのです。

フォームデータとモーダルウインドウ部分のソースコードを記載しておきます。

フォーム部

<form action = "kakunin.php" method="post"> <table><tr><th>会社名:</th><td><input type="text" name="coltd" size="45"></td><th>担当者様名:</th><td><input type="text" name="name" size="30"></td><th>郵便番号:</th><td><input type="text" name="znum" size="10"></td></tr> <tr><th>住所:</th><td colspan="5"><input type="text" name="zyuusyo" size="100%"></td></tr></table> <input type=submit name=send value="登録"> </form>

モーダルウインドウ部分

<div id="modal-content-02" class="modal-content"> <!-- モーダルウィンドウのコンテンツ開始 --> <p><h2>顧客情報を選択してください</p> <p> <table> <tr><th>ID</th><th>会社名</th><th>担当者様名</th><th>住所</th><th>電話番号</th><td>選択</td></tr> <?php $con = mysql_connect('localhost', 'root', 'パスワード') or die('error(connect)'); mysql_select_db('testdb', $con) or die('error(select_db)'); mysql_set_charset('utf8'); $sql = 'select * from kokyaku'; $result = mysql_query($sql, $con); while ($row = mysql_fetch_array($result)) { echo '<tr><td>' .$row['顧客ID'] . '</td><td>' .$row['coltd'] . '</td><td> ' .$row['担当者様名'].'</td><td>' .$row['住所']. '</td><td>' .$row['電話番号']. '</td><td><button type="button" class="btn">選択</button></td></tr>' ; } mysql_close($con); ?> </table> </p> <p><a id="modal-close" class="button-link">閉じる</a></p>

このような場合、どういった記述になるのか教えて頂ければ幸いです。
拙さ全開で申し訳ございませんが、よろしくお願いします。

####余談ですが...

phpのmysql系の関数は脆弱性があり、削除されたという情報をお聞きしました。
現状他の機能もこの状態で実装されており、書き換えればならないと思うのですが、小耳にはさむ程度でもよいので効率よく置き換える方法等ご存じであれば教えて頂ければと思います。

####追記
改めて見返すとわかりにくかったので、
メイン部分のソースコードそのまま貼ります

<div class="contents"> <!-- 1つ目のコンテンツ [開始] --> <div id="modal-content-01" class="modal-content"> <!-- モーダルウィンドウのコンテンツ開始 --> <p>1</p> <p>「閉じる」か「背景」をクリックするとモーダルウィンドウを終了します。</p> <p><a id="modal-close" class="button-link">閉じる</a></p> <!-- モーダルウィンドウのコンテンツ終了 --> </div> <!-- 1つ目のコンテンツ [終了] --> <!-- 2つ目のコンテンツ [開始] --> <div id="modal-content-02" class="modal-content"> <!-- モーダルウィンドウのコンテンツ開始 --> <p><h2>顧客情報を選択してください</p> <p><table> <tr><th>ID</th><th>会社名</th><th>担当者様名</th><th>住所</th><th>電話番号</th><td>選択</td></tr> <?php $con = mysql_connect('localhost', 'root', 'パスワード') or die('error(connect)'); mysql_select_db('testdb', $con) or die('error(select_db)'); mysql_set_charset('utf8'); $sql = 'select * from kokyaku'; $result = mysql_query($sql, $con); while ($row = mysql_fetch_array($result)) { echo '<tr><td>' .$row['顧客ID'] . '</td><td>' .$row['coltd'] . '</td><td> ' .$row['担当者様名'].'</td><td>' .$row['住所']. '</td><td>' .$row['電話番号']. '</td><td><button type="button" class="btn">選択</button></td></tr>' ; } mysql_close($con); ?> </table> </p> <p><a id="modal-close" class="button-link">閉じる</a></p> </p> <p><a id="modal-close" class="button-link">閉じる</a></p> <!-- モーダルウィンドウのコンテンツ終了 --> </div> <!-- 2つ目のコンテンツ [終了] --> <!-- 3つ目のコンテンツ [開始] --> <div id="modal-content-03" class="modal-content"> <!-- モーダルウィンドウのコンテンツ開始 --> <p>2つ目のモーダルウィンドウです。全体を囲むdiv要素に[id="modal-content-03"]が設定されています。</p> <p>「閉じる」か「背景」をクリックするとモーダルウィンドウを終了します。</p> <p><a id="modal-close" class="button-link">閉じる</a></p> <!-- モーダルウィンドウのコンテンツ終了 --> </div> <!-- 3つ目のコンテンツ [終了] --> <!-- 右カラム --> <div id="main"> <h1>請求書作成</h1> <!--テスト--> <form action="" method="post"> <p> <label for="">会社名</label> <input type="text" name="company_name" /> </p> <p> <button type='submit'>更新</button> </p> </form> <!--テストここまで--> <p><a class="modal-syncer button-link" data-target="modal-content-01">見積もり書のデータを参照する</a></p> <p><a class="modal-syncer button-link" data-target="modal-content-02">顧客情報を自動入力する</a></p> <p><a class="modal-syncer button-link" data-target="modal-content-03">商品情報を自動入力する</a></p> <p><button type="button" class="modal-syncer button-lin" data-target="modal-content-02">顧客情報を一覧から入力する</button>&nbsp;<button type="button" class="modal-syncer button-lin" data-target="modal-content-01">見積書データを入力する</button> <form action = "kakunin.php" method="post"> <table><tr><th>会社名:</th><td><input type="text" name="coltd" size="45"></td><th>担当者様名:</th><td><input type="text" name="name" size="30"></td><th>郵便番号:</th><td><input type="text" name="znum" size="10"></td></tr> <tr><th>住所:</th><td colspan="5"><input type="text" name="zyuusyo" size="100%"></td></tr></table> <table> <tr><td>*</td><td>商品名</td><td>数量</td><td>単価</td><td>金額</td><td>備考</td></tr> <tr><td><button type="button" class="modal-syncer button-lin" data-target="modal-content-03">選択</button></td><td><input type="text" name="nm" size="40"></td><td><input type="text" size="2" name="kosuu" value="1"></td><td><input type="text" name="nm" size="7"></td><td><input type="text" name="nm" size="10"></td><td><input type="text" name="nm"></td></tr> <tr><td><p>プレビュー</p></td> <td><p><input type=submit name=send value="登録"><br></p></td></tr> </table> </form>

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

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

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

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

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

Mr_Roboto

2016/07/17 00:55

おはようございます、HTMLはそのまま貼ると見づらいのでコードタグで囲んでくださいね、編集画面の上にある</>というボタンです。
Mr_Roboto

2016/07/17 00:55

あ、PHPでしたね、失礼 ^_^;
guest

回答1

0

#common.php

php

1<?php 2 3/** 4 * common.php 5 * 6 * @since 2016/07/17 7 */ 8ini_set('display_errors', 1); 9error_reporting(E_ALL); 10 11function h($string) 12{ 13 return htmlspecialchars($string, ENT_QUOTES, 'utf-8'); 14} 15 16function getConnection() 17{ 18 try { 19 $host = 'localhost'; 20 $dbname = 'test'; 21 $dsn = sprintf('mysql:dbname=%s;host=%s;charset=utf8' 22 , $dbname 23 , $host 24 ); 25 $user = 'root'; 26 $password = 'password'; 27 $options = [ 28 PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION 29 ]; 30 $pdo = new PDO($dsn, $user, $password, $options); 31 return $pdo; 32 } catch (PDOException $e) { 33 throw new Exception($e); 34 } 35} 36

#index.php

php

1<?php 2/** 3 * index.php 4 * 5 * @since 2016/07/17 6 */ 7require_once 'common.php'; 8 9try { 10 $pdo = getConnection(); 11 $statement = 'select id, company_name, staff_name, address, tel from kokyaku'; 12 $stmt = $pdo->prepare($statement); 13 $stmt->execute(); 14 $recSet = $stmt->fetchAll(PDO::FETCH_ASSOC); 15} catch (PDOException $e) { 16 $err = $e->getMessage(); 17} 18?> 19 20<!DOCTYPE HTML> 21<html lang="ja"> 22 <head> 23 <meta charset="UTF-8"> 24 <title></title> 25 <style type="text/css"> 26 #model { 27 display:none; 28 position: absolute; 29 width: 600px; 30 top: 0; 31 left: 50%; 32 margin-left: -300px; 33 background-color: #EEE; 34 border: 1px solid #666; 35 } 36 #model p { 37 margin: 0.5em; 38 } 39 </style> 40 </head> 41 <body> 42 43 <table> 44 <thead> 45 <tr> 46 <th>ID</th> 47 <th>会社名</th> 48 <th>担当者名</th> 49 <th>住所</th> 50 <th>電話番号</th> 51 <th>選択</th> 52 </tr> 53 </thead> 54 <tbody> 55 <?php foreach ($recSet as $rec) : ?> 56 <tr> 57 <td><?= h($rec['id']); ?></td> 58 <td><?= h($rec['company_name']); ?></td> 59 <td><?= h($rec['staff_name']); ?></td> 60 <td><?= h($rec['address']); ?></td> 61 <td><?= h($rec['tel']); ?></td> 62 <td> 63 <button class="opendialog" type='button' data-id='<?= h($rec['id']); ?>'> 64 選択 65 </button> 66 </td> 67 </tr> 68 <?php endforeach; ?> 69 </tbody> 70 </table> 71 72 <!-- model --> 73 <div id="model"> 74 <form action="" method="post"> 75 <p> 76 <label for="">会社名</label> 77 <input type="text" name="company_name" /> 78 </p> 79 <p> 80 <button type='submit'>更新</button> 81 </p> 82 </form> 83 </div> 84 85 <script type="text/javascript" src="//code.jquery.com/jquery-2.2.4.min.js"></script> 86 <script type="text/javascript"> 87 $(function () { 88 $("#model").hide(); 89 $("#model button:submit").on('click', function () { 90 $("#model").hide(); 91 }); 92 93 $(".opendialog").on('click', function () { 94 var url = 'ajax.php'; 95 var params = { 96 id: $(this).attr('data-id') 97 }; 98 $.getJSON(url, params, function (json) { 99 $("#model").show(function () { 100 $(this).find('input[name=company_name]').val(json.company_name); 101 }); 102 }); 103 }); 104 }); 105 </script> 106 </body> 107</html>

#ajax.php

php

1<?php 2 3/** 4 * ajax.php 5 * 6 * @since 2016/07/17 7 */ 8require_once 'common.php'; 9 10try { 11 $id = filter_input(INPUT_GET, 'id'); 12 13 $pdo = getConnection(); 14 $statement = 'select id, company_name, staff_name, address, tel from kokyaku where id=?'; 15 $stmt = $pdo->prepare($statement); 16 $arr = []; 17 $arr[] = $id; 18 $stmt->execute($arr); 19 $recSet = $stmt->fetchAll(PDO::FETCH_ASSOC); 20 21 $res = null; 22 if (isset($recSet[0])) { 23 $res = $recSet[0]; 24 } 25} catch (PDOException $e) { 26 $res = $e->getMessage(); 27} finally { 28 echo json_encode($res); 29}

投稿2016/07/17 01:40

編集2016/07/17 01:45
退会済みユーザー

退会済みユーザー

総合スコア0

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

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

AY6M_

2016/07/18 04:26

ありがとうございます。 既存のコンソールに組み込んでみたら500エラーを吐いてしまったので、回答にあるindex.phpの代替としてtest.phpを作成しテストしてみたのですが、選択ボタンを押してもなにも反応せず、色々思い当たる部分(主にデータベースのカラム名)等いじってみましたが改善しませんでした... 質問内容もわかりにくいと見返して思ったのでコンテンツ部分のソースコードをまるまる貼りました。 まだ試作なのでお見苦しいかとは思いますが.... ちなみに、モーダルウインドウ部のスクリプト/CSSは、 https://syncer.jp/jquery-modal-window こちらのものを使用させていただいております。
退会済みユーザー

退会済みユーザー

2016/07/18 04:34 編集

私が提示したソースに合わせてDBを新規で作れば、動きます。 提示したソースを無理に既存コードに組み込むのではなく、単独で動作させてみてください。組み込むことを想定してソースは書いていません。 どうやれば良いのかがわかるように書いたものです。
AY6M_

2016/07/18 09:32

新規にDBを作成し、ソースコードもpass部分のみの変更で単独動作を試みてみましたが、やはり選択ボタンを押しても何も反応しませんでした。実行環境に関して、ほとんどがyumコマンドでインストールしたものなので念のため実行環境を記しておきます。 実行環境 CentOS7 Php5.4.16-36 MariaDB 5.5.47 Apache(httpd)2.4.6-40 ツールとしてphpmyadmin導入
退会済みユーザー

退会済みユーザー

2016/07/18 09:34

「動かない」だけでは何も判断できません。ログを見てみるなり、解決につながる情報を提示してください。
退会済みユーザー

退会済みユーザー

2016/07/18 09:38

とりあえず。 ini_set('display_errors', 1); error_reporting(E_ALL); をindex.php にも記述してみては?
AY6M_

2016/07/18 11:22

Apacheのエラーログを参照したところ、 [Mon Jul 18 18:52:56.003115 2016] [:error] [pid 5555] [client ] PHP Parse error: syntax error, unexpected '{' in /var/www/html/console/ajax.php on line 27, referer: http://hogehoge.com/console/test.php 調べてみたらfinally句が使えるのはphp5.5以降とのことで やはり実行環境が古いのが原因?だと見受けられるので、環境の更新作業をしていますが、何か不手際があったのかphp自体が動かなくなるという事態に発展してるので、解決までしばらくお待ちください....(汗
AY6M_

2016/07/21 08:11

業務多忙で遅くなりました...すいません。 php5.6に更新後、同じエラーは吐かなくなりましたが、選択ボタンを押してもうんともすんとも言わないのでエラーログを参照しても何のエラーも吐いておらず、ためしに ini_set('display_errors', 1); ini_set('log_errors','On'); ini_set('error_log','/log/php_error.log'); error_reporting(E_ALL); とし、ログも残るようにしてみたのですが、こちらも何のリアクションも取れず... JavaScript側の問題かと思いChromeのツールで確認しようとしても「No Breakpoints」....。 Apacheのエラーログも特にエラーを吐いているわけでもなく、原因を特定しようにも、さっぱりな状態です.... 現在進行形で原因特定を急いでますので、何か進展ありましたらまた追記します。 尚、ブラウザはMicrosoftEdge、Chromeで確認しました。
退会済みユーザー

退会済みユーザー

2016/07/21 08:22

> JavaScript側の問題かと思いChromeのツールで確認しようとしても「No Breakpoints」....。 なんのことやら?
AY6M_

2016/07/21 09:12

いい加減な直訳ですが「エラー等なし」です。 chrome等のデベロッパーツールではJavaScriptなどにエラーがあると教えてくれる機能があります。
退会済みユーザー

退会済みユーザー

2016/07/21 09:28 編集

さすがに回答者の立場ですから、「開発者ツール」くらいは当たりまえに知っていますよ。 「ツール」と言っても、プラグインなのか、デフォルト機能の開発者ツールなのか、また、開発者ツールであってもどの機能を使ってみていて、どう判断しているのかというような、具体的な記述がないと判断できないよってことです。単純に使い方間違っている可能性も排除できません。 「エラーがない」といっても、使うべき機能を間違っているなんてことがよくあるのです。なので、主に回答者として利用している人は、質問者の言っていることが事実なのか、推測なのか、本当に意図した内容を指して言っているのか、その判断のもとになる根拠が示されないと、回答しにくいのです。
AY6M_

2016/07/21 14:05

若葉つけて質問している理由を少しは察していただければと思うのですが… 少なくともなにもしてない訳ではありませんし、拙い知識ながらも自分で出来ることは出来る限りやっての情報を開示してるのに対して、情報を提示してくださいという割には、その具体的な情報の提示の方法は全く記されていないので、具体的な提示のしようがありません。 具体的に、 •何を実行するか •何を何に追加するのか •どういった情報や項目を提示すればいいのか を教えて頂ければと思います。 あまりにも業務多忙な為あまり調べる時間もなく拙い知識丸出しでお見苦しいかとは存じますがお願いします。
退会済みユーザー

退会済みユーザー

2016/07/21 15:07 編集

無償でやってもいいと思える範囲内であれば、お手伝いはしますよ。 ただ、お金を払って仕事をくれるお客さんがいる立場ですから、丸投げされるよりも手間のかかるお手伝いはできません。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問