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

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

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

MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。

POST

POSTはHTTPプロトコルのリクエストメソッドです。ファイルをアップロードしたときや入力フォームが送信されたときなど、クライアントがデータをサーバに送る際に利用されます。

PHP

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

JavaScript

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

Q&A

解決済

2回答

2109閲覧

プルダウンで選択したtextをMYSQLにPOSTしたい

tapp

総合スコア3

MySQL

MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。

POST

POSTはHTTPプロトコルのリクエストメソッドです。ファイルをアップロードしたときや入力フォームが送信されたときなど、クライアントがデータをサーバに送る際に利用されます。

PHP

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

JavaScript

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

0グッド

0クリップ

投稿2021/03/23 10:07

編集2021/03/24 04:21

プルダウンで選択したtextをMYSQLにPOSTしたいです。

現在のコードだと選択肢の値(番号)がPOSTされます。
index.php

php

1<?php 2 //DBへ接続 3 try { 4 $dsn = 'mysql:host=localhost;dbname=car_maker;charset=utf8'; 5 $user = 'root'; //root 6 $pass = 'root'; //root 7 $pdo = new PDO($dsn, $user, $pass, array(PDO::ATTR_EMULATE_PREPARES => false)); 8 $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); 9 } catch(PDOException $e) { 10 exit('データベース接続失敗'.$e->getMessage()); 11 } 12 //makerテーブル から値を取得し、 id と name を $maker_list配列 に格納 13 $sql = "SELECT * FROM maker"; 14 $stmt = $pdo->query($sql); 15 $maker_list = array(); 16 while($row = $stmt -> fetch(PDO::FETCH_ASSOC)){ 17 $maker_list[$row['id']] = $row['maker_name']; 18 } 19?> 20 21 22<!DOCTYPE html> 23<html> 24 <head> 25 <meta charset="utf-8"> 26 <script src="js/jquery-3.6.0.min.js" charset="utf-8"></script> 27 <script type="text/javascript"> 28 $(function(){ 29 //selectタグ(親) が変更された場合 30 $('[name=car_maker]').on('change', function(){ 31 var maker_val = $(this).val(); 32 33 //maker_val値 を select.php へ渡す 34 $.ajax({ 35 url: "select.php", 36 type: "POST", 37 dataType: 'json', 38 data: { 39 "maker_id": maker_val 40 } 41 }) 42 .done(function(data){ 43 //selectタグ(子) の option値 を一旦削除 44 $('.car_model option').remove(); 45 //select.php から戻って来た data の値をそれそれ optionタグ として生成し、 46 // .car_model に optionタグ を追加する 47 $.each(data, function(id, name){ 48 $('.car_model').append($('<option>').text(name).attr('value', id)); 49 }); 50 }) 51 .fail(function(XMLHttpRequest, textStatus, errorThrown) { 52 console.log("ajax通信に失敗しました"); 53 console.log("XMLHttpRequest : " + XMLHttpRequest.status); 54 console.log("textStatus : " + textStatus); 55 console.log("errorThrown : " + errorThrown.message); 56 }); 57 58 }); 59 }); 60 </script> 61 <title></title> 62 </head> 63<body> 64 65 66<h1></h1> 67 <form action="send.php" method="post"> 68 <table> 69 <tr> 70 <th>メーカー:</th> 71 <td><select class="car_maker" name="car_maker"> 72    <option>選択して下さい</option> 73 <?php foreach($maker_list as $key => $maker_name){ 74 75 }?> 76 </select></td> 77 </tr> 78 <tr> 79 <th>車種:</th> 80 <td> 81 <select class="car_model" name="car_model"> 82 <option class="">選択して下さい</option> 83 </select> 84 </div></td> 85 </tr> 86 87 88 <tr colspan="2"> 89 <td><input type="submit" value="送信"></td> 90 </tr> 91 </table> 92 </form> 93</body> 94</html>

select.php

php

1<?php 2 //直接のページ遷移を阻止 3 $request = isset($_SERVER['HTTP_X_REQUESTED_WITH']) ? strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) : ''; 4 if($request !== 'xmlhttprequest') exit; 5 //DBへの接続 6 //本来は db_connect関数 を作成して、DRYにした方が良いです。 7 try { 8 $dsn = 'mysql:host=localhost;dbname=car_model;charset=utf8'; 9 $user = 'root'; 10 $pass = 'root'; 11 $pdo = new PDO($dsn, $user, $pass, array(PDO::ATTR_EMULATE_PREPARES => false)); 12 $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); 13 } 14 catch(PDOException $e) { 15 exit('データベース接続失敗'.$e->getMessage()); 16 } 17 //Ajaxで渡ってきた値をもとに modelテーブル から該当する model を抽出 18 if (!empty($_POST['maker_id'])) { 19 $maker_no = $_POST['maker_id']; 20 //$maker_no = $_POST['maker_no']; 21 $sql = 'SELECT * FROM model WHERE maker_id = :maker_id'; 22 $stmt=$pdo->prepare($sql); 23 $stmt->bindValue(':maker_id', (int)$maker_no, PDO::PARAM_INT); 24 $stmt->execute(); 25 26 //抽出された値を $model_list配列 に格納 27 $model_list = array(); 28 while($row = $stmt -> fetch(PDO::FETCH_ASSOC)){ 29 $model_list[$row['id']] = $row['model_name']; 30 } 31 header('Content-Type: application/json'); 32 //json形式で index.php へバックする 33 echo json_encode($model_list); 34} 35 ?>

send.php

php

1<!DOCTYPE html> 2<html lang="jp"> 3<head> 4 <meta charset="UTF-8"> 5 <title>title</title> 6 7</head> 8<body> 9<?php 10 11$dsn = 'mysql:host=localhost;dbname=gmatome;charset=utf8mb4'; 12$username = 'root'; 13$password = 'root'; 14 15// try-catch 16 17 18// 1.もし、ポストにデータがあるならば・・・ 19if (isset($_POST["car_maker"],$_POST["car_model"])) { 20 // 2.ポストのデータを変数にしま~す 21 $car_maker = $_POST["car_maker"]; 22 $car_model = $_POST["car_model"]; 23 24} 25// 3.データベースに接続しましょう 26try{ 27 $dbh = new PDO($dsn,$username,$password); 28 $dbh->setAttribute(PDO::ATTR_EMULATE_PREPARES, false); 29 $dbh->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); 30 31 32 // SQL文 :nameと:romajiは、名前付きプレースホルダ 33 $stmt = $dbh->prepare("INSERT INTO matome(car_maker,car_model) VALUES (:car_maker,:car_model)"); 34 35 //トランザクション処理 36 $dbh->beginTransaction(); 37 38 try{ 39 $stmt->bindParam(':car_maker', $car_maker); 40 $stmt->bindParam(':car_model', $car_model); 41 $stmt->execute(); 42 43 //コミット 44 $dbh->commit(); 45 46 }catch (PDOException $e) { 47 //ロールバック 48 $dbh->rollback(); 49 throw $e; // 50 } 51 // 接続を閉じる 52 //$pdo = null; スクリプト終了時に自動で切断されるので不要 53}catch (PDOException $e) { 54 // UTF8に文字エンコーディングを変換します 55 exit(mb_convert_encoding($e->getMessage(),'UTF-8','SJIS-win')); 56} 57?> 58 </body> 59</html> 60

上記で
カーメーカーリストがトヨタ(データベースのidは1)、ホンダ、・・・としてトヨタを選択
トヨタの車種リストがアルファード、プリウス(データベースのidは2)・・・としてアルファードを選択すると
mysqlに1、1がpostされます。これをトヨタ、プリウスで入れたいです。

調べたこと

var = $('option:selected').text();を使用するといいようですが、どこにどのように挿入したら
いいのか分かりませんでした。

データベース

データベース名car_maker
テーブル名maker

idmaker_name
1TOYOTA
2HONDA
3NISSAN

データベース名car_model
テーブル名model

idmaker_idmodel_name
11アルファード
21プリウス
33GT-R
42オデッセイ

データベース名gmatome
テーブル名matome
|id|date|maker_id|model_name|naiyou|
|:--:|:--:|:--:|
|1|1029|TOYOTA|アルファード|オイル交換|
|2|1030|TOYOTA|アルファード|車検|
|3|1031|NISSAN|GT-R|速い|
|4|1101|HONDA|オデッセイ|車検|
|5|1102|1|2|車検|

一番下のgmatomedbのid1~4のようにメーカーと車種が入ってほしいのですが
id5のようにメーカーと車種が数字で入ってしまいます。

会社で使用するものである為、実際のデータは使用しておらず、
車に置き換えて投稿させて頂いており、間違いが多々ありました。
その他、gmatomedbの内容記入欄や日付欄などはindex.phpでプルダウン選択と
同時に記入しdbに入ってくれています。

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

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

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

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

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

FKM

2021/03/24 00:43

POSTじゃなくてDBのテーブルにインポートしたいってことでしょうか。 それならば、使用しているテーブルの提示お願いします。 根本的な間違いをしている可能性があります。
tapp

2021/03/24 04:23

有難うございます。インポートしたいということでいいかと思いまます。データベースにデータを追加していきたいです。 投稿を修正させて頂きましたのでよろしくお願いいたします。
guest

回答2

0

ベストアンサー

二通りの方法があります。

1.プルダウンのvalueにマスタの値を紐付ける。マスタidの取得はidプロパティから取得する

紐付けているプルダウンのvalueにマスタの値を持ってくるといいです。
現在、Ajaxで引っ張ってきているのはマスタのidだけなので、値も取得するようにするといいでしょう。
idは英数字から始めないほうがいいので、あえて接頭辞をつけています。

<select name="car_maker"> <option id="m1" value="アルファード">アルファード</option> </select>

2.取得したidからPHP内のプログラムで、マスタに紐付いたメーカー名と車種名を取得する

現状だとPOSTの値はidしか取得していませんので、そこからメーカー名を取得できるようにします。

$sql = "select id, maker_name from car_maker where id = '{$carmaker}'";

実際はプレースホルダなどを使ってちゃんと処理してください。

投稿2021/03/24 04:33

編集2021/03/24 09:16
FKM

総合スコア3647

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

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

tapp

2021/03/24 09:12

ご回答頂きありがとうございます。2パターンについて明日試してみます。
tapp

2021/03/31 09:25

パソコンを触れなかったことと、勉強不足でどこを触ったらいいかよくわからず、まだ出来ておりません。 1番のやり方はindex.phpの91行目の echo '<option name="" value="'.$key.'">'.$maker_name.'</option>'; のvalueのところに値を持ってくるという感じでしょうか。
guest

0

ajaxでselect.phpを呼んでますが、send.phpになっています
またsend.phpがjsonを返すことを期待しているのに、だらだらとhtmlが書いてあります

投稿2021/03/23 10:19

編集2021/03/23 10:21
yambejp

総合スコア116724

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

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

tapp

2021/03/23 12:24 編集

select. phpを記載しておりませんでした。失礼しました! プルダウンは連動できておりsend.phpでmysqlに送る段階でつまづいております。 質問に追記致しました。よろしくお願いします。
yambejp

2021/03/23 12:49

ajaxでdoneに処理が流れていることを確認してください .done(function(data){ console.log(data); もしdataがjsonできちんと受け取れていれば、ご提示のソースで 連動するselectが更新されると思います 最初のoptionは消さないほうが良いかもしれません $('.car_model option:not(:first)').remove(); $.each(data, function(id, name){ $('.car_model').append($('<option>').text(name).attr('value', id)); });
tapp

2021/03/23 23:25

ご回答ありがとうございます。教えて頂いたコードに変更しました。 プルダウンが連動して選択する操作は既に出来ておりますので、 プルダウンで選択した、プルダウンに表示されている メーカー名や車名をデータベースにpostするにはどのような記述に したら良いのでしょうか。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.35%

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

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

質問する

関連した質問