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

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

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

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

JavaScript

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

jQuery

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

解決済

JavaScriptとPHPを連携したい(DBから取ってきたデータをJavaScriptで用いたい)

BeatStar
BeatStar

総合スコア4721

PHP

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

JavaScript

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

jQuery

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

2回答

0評価

1クリップ

326閲覧

投稿2022/06/27 09:12

編集2022/06/30 14:07

※ 現在ローカル環境にXAMPPを用いて開発しています。

JavaScript + PHP でWebアプリを作っているのですが、
JavaScript側からPHPの関数を呼び出す方法はありますか?

概要としては、

[概要フロー] 1. index.php で PHP側でDBに接続し、データを取ってきてセッションにセットする 2. ユーザが次のページに入ると 2.1. テーブル状のデータ列(イメージとしてはECサイトの在庫管理の部分)が表示される 2.2. この(2.1)のselect(コンボボックス)のデータの在庫を2から1に変更する等のような変更を加えると 2.2.1. (1)で設定されていたセッションのデータも変更する 2.3. (このページが閉じられるまで同じ処理を繰り返す

のような感じです。

(2.2)の「selectのデータが変更された」イベントはPHPではできないようで、JavaScript側でonchange="JavaScriptの関数" を設定して呼び出しています。
ですが、この(2.2.1)の部分、つまり「セッションのデータも変更する」の部分をどのように実装すべきか悩んでいます。

全体的な構造をPHP側でデータを制御するのではなくJavaScript側のデータとしてjsonとかのようなデータとしてやる方法もあるようですが、
その方法だとデータが丸見えなのであまり好ましくありません。
(今回の処理だとそこまで問題はなさそうな気がしますが、念のため…)

データそのものは、上記のように「ECサイトでの在庫管理」のような、「在庫の数」とかみたいなやつです。(方向性としては)

以下はそのアプリに組み込むかどうかを検討するために作った軽いサンプルです。

とりあえず、「JavaScript PHP 呼び出し」等で調べてみるとjQueryのAjaxを使うらしいので試してみました。
ですが、私のやり方が間違っているのか、なぜかPHP側の関数が呼び出されません。

以下、軽いサンプルです。(実際に作りたいものとは違います…)

<!-- index.php --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <?php session_start(); ?> </head> <body> <?php if( !isset( $_SESSION[ 'session1' ] ) ){ $_SESSION[ 'session1' ] = "CLang"; } echo $_SESSION[ 'session1' ]."<br />"; ?> <form action="page1.php" method="post"> <p><button name="gobutton">Go</button></p> </form> </body> </html>
<!-- page1.php --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Calling PHP from JavaScript</title> <?php session_start(); ?> </head> <body> <script src="./jquery-3.6.0.min.js"></script> <script> function SelectChanged( ctrlId ){ var slct = document.getElementById( ctrlId ); alert( slct.value ); jQuery.ajax({ type: "post", url: "http://localhost/samples/calling_php_from_javascript/page2.php", data: { "func" : "func2", "argument" : ctrId }, }); } </script> <form> <select name="select1" id="select1" size="1" onchange="SelectChanged('select1')"> <option value="C#">C#</option> <option value="C++">C++</option> <option value="PHP" selected>PHP</option> </select> </form> </body> </html>
// page2.php <?php // セッション開始 session_start(); function func2( $id ){ if( !isset( $_SESSION[ 'session1' ] ) ){ echo "error2"; } echo "<p>ok!</p>"; return 0; } $func = $_POST[ 'func' ]; $argument = $_POST[ 'argument' ]; $func( $argument ); ?>

同じディレクトリ内にjQueryがあるとします。
(apacheを起動してPHPが使える状態にした後に)このファイル群のindex.phpを開き、
ボタンを押してpage1.phpに進みます。
そして出てきたselectのアイテムを選択すると、私の考えでは

1. 選択されたアイテムがalertで表示される 2. page2.phpのfunc2関数が呼び出されて少なくともecho "<p>ok!</p>";が処理される

となるはずですが、実際には(1)は行われて(2)は行われている様子が見当たりません…

これ以外の方法でもいいのですが、「selectのアイテムが選択されたときに、セッション内のデータを変更したい」のです。
上記サンプルではselectのoptionタグで表示しているデータは完全固定ですが、実際にはDBから取ってきたデータを用いるつもりです。

どのような方法でやるべきなのでしょうか。

[情報] 言語: PHP, JavaScript(jQueryあり) jQuery: jQuery-3.6.0.min.js XAMPP: XAMPP Version 8.1.6 OS: Windows 10

ーーー

修正になりますが、やりたい処理は単にDBから一方通行一方通行で用いるのではなく用いるのではなく、双方向で用います。

上記で言えば「スペイン語、英語」等の選択肢と「現在選択されているデータ」はそれぞれ違うテーブルに記述されていて、両方使います。

つまり、スペイン語等の選択肢をselectに設定し、現在選択されているデータもとってきてselectedを付与。
そして「現在選択されているデータ」が変更されたらPHPなりを介してDB内の内のデータも修正する…といったことがしたいのです。
(紛らわしくてすみません……)

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

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

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

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

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

まだ回答がついていません

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

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

ただいまの回答率
87.20%

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

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

質問する

関連した質問

同じタグがついた質問を見る

PHP

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

JavaScript

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

jQuery

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