ThinkPHP と Ajax によるセカンダリ連携ドロップダウン メニュー

この記事では、主に ThinkPHP と Ajax 間の二次連携のドロップダウン メニューを紹介します。これは、必要な友人に共有することができます。

連携のデータの存在。メニューでは、コードを変更することなく、データベースを追加、削除、変更することで、いつでもメニュー データを変更できます。同時に、レベル 2 を達成した後、レベル 3 およびレベル 4 を達成することもできます。 。 。 。関連メニューをお待ちください

最初はデータベースの設計です。分類テーブルは、cate と呼ばれます。

私が行っているのは、分類されたデータの第 2 レベルのリンクです。データに必要なフィールドは、id、name (中国名)、pid (親 ID) です。

親 ID の設定: データに上位階層がない場合、親 ID は 0 です。上位階層がある場合、親 ID は上位階層の ID になります。

データベースにコンテンツが追加されたら、セカンダリ リンケージを実装するコードの作成を開始できます。

まず、バックグラウンド PHP で pid 0 のすべてのデータを取得し、それを $cate に保存し、次に foreach ループを使用して最初のレイヤーの に出力します。

HTML コード:

<select name="type" size="1" id="type">
    <option>请选择类型</option>
     <foreach name=&#39;cate&#39; item=&#39;v&#39;>
         <option value="{$v[&#39;ca_id&#39;]}">{$v.ca_name}</option>
     </foreach>
 </select>
 标签：
 <select name="lable" size="1" id="lables">
 </select>

Ajax コード:

 $('#type').click(function(){
            $(this).change(function(){
                var objectModel = {};
                var   value = $(this).val();
               var   type = $(this).attr('id');
                objectModel[type] =value;
                $.ajax({
                    cache:false,
                    type:"POST",
                    url:site.web+"lable",
                    dataType:"json",
                    data:objectModel,
                    timeout:30000,
                    error:function(){
                        alert(site.web+"lable");
                    },
                    success:function(data){
                        $("#lables").empty();
                        var count = data.length;
                        var i = 0;
                        var b="";
                           for(i=0;i<count;i++){
                               b+="<option value=&#39;"+data[i].ca_id+"&#39;>"+data[i].ca_name+"</option>";
                           }
                        $("#lables").append(b);
                    }
                });
               });
        }
    );

Ajax コードは、最初のレイヤーのタイプが変更された後にトリガーされます。ajax メソッドの主なパラメーターは次のとおりです。

1 .url: バックグラウンドで ajax を受信するためのアドレス;

2.data: バックグラウンドに渡されるデータは通常、json で渡されます。 。

3.type: transfer メソッド。get メソッドと post メソッドがあります。私は通常、get よりも多くのデータを送信でき、より安全な post を使用します。

4.error: ajax 実行。失敗メソッド;

5.success: ajax の実行が成功したためのメソッド。これはコールバック関数です。ここで成功を実行するときは、まず empty() を使用して 2 番目のドロップダウン メニューの内容をクリアし、次にバックグラウンドから取得したデータを出力します。

以下は、Thinkphp が ajax データを受信して​​処理するページです。

//后台ajax验证
  $result = array();
  $cate =$_POST['type'];
  $result = M('cate')->where(array('ca_pid'=> $cate))->field('ca_id,ca_name')->select();
  $this->ajaxReturn($result,"JSON");

Thinkphp の I() メソッドは、渡された最初のレイヤーの選択を取得するために、実際には $_POST[] と見なすことができます。 ajax でコンテンツの ID を取得し、ajaxReturn() を使用して ajax に返します。ここでは、戻りデータが json 形式で設定されているため、ajax は json 形式でデータを受け取ります。

ネイティブ PHP リターン データ メソッド:

コードは次のとおりです:

  //搜索结果为$result
   .....
   echo json_encode($result);

これで 2 レベルのリンケージ ドロップダウン メニューの実装が完了しました。URL に注意してください。正しくなければならず、バックグラウンドで受信したときに戻り値がなければなりません。そうでない場合は、ajax 成功メソッドは実行されません。

以上がこの記事の全内容です。読んでいただきありがとうございます。詳細については PHP 中国語 Web サイトをご覧ください。

関連する推奨事項:

PHP で実装されたリアルタイム メッセージ プッシュ機能 [アンチ Ajax プッシュに基づく]

Ajax を使用して Thinkphp でリフレッシュフリーのページングを実装する方法

以上がThinkPHP と Ajax によるセカンダリ連携ドロップダウン メニューの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

脱衣画像を無料で

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AIヘンタイを無料で生成します。

もっと見る

人気の記事

R.E.P.O.説明されたエネルギー結晶と彼らが何をするか（黄色のクリスタル）

1 か月前 By 尊渡假赌尊渡假赌尊渡假赌

R.E.P.O.最高のグラフィック設定

1 か月前 By 尊渡假赌尊渡假赌尊渡假赌

アサシンのクリードシャドウズ：シーシェルリドルソリューション

3週間前 By DDD

Windows11 KB5054979の新しいものと更新の問題を修正する方法

2週間前 By DDD

Will R.E.P.O.クロスプレイがありますか？

1 か月前 By 尊渡假赌尊渡假赌尊渡假赌

もっと見る

ホットツール

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

神レベルのコード編集ソフト（SublimeText3）

もっと見る

ホットトピック

Gmailメールのログイン入り口はどこですか？

7549

15

CakePHP チュートリアル

1382

52

Steamのアカウント名の形式は何ですか

83

11

Win11 Activation Key Permanent

58

19

NYTの接続はヒントと回答です

22

90

もっと見る

Related knowledge

thinkphpプロジェクトの実行方法 Apr 09, 2024 pm 05:33 PM

ThinkPHP プロジェクトを実行するには、Composer をインストールし、Composer を使用してプロジェクトを作成し、プロジェクト ディレクトリに入り、php bin/consoleserve を実行し、http://localhost:8000 にアクセスしてようこそページを表示する必要があります。

thinkphp にはいくつかのバージョンがあります Apr 09, 2024 pm 06:09 PM

ThinkPHP には、さまざまな PHP バージョン向けに設計された複数のバージョンがあります。メジャー バージョンには 3.2、5.0、5.1、および 6.0 が含まれますが、マイナー バージョンはバグを修正し、新機能を提供するために使用されます。最新の安定バージョンは ThinkPHP 6.0.16 です。バージョンを選択するときは、PHP バージョン、機能要件、コミュニティ サポートを考慮してください。最高のパフォーマンスとサポートを得るには、最新の安定バージョンを使用することをお勧めします。

thinkphpの実行方法 Apr 09, 2024 pm 05:39 PM

ThinkPHP フレームワークをローカルで実行する手順: ThinkPHP フレームワークをローカル ディレクトリにダウンロードして解凍します。 ThinkPHP ルート ディレクトリを指す仮想ホスト (オプション) を作成します。データベース接続パラメータを構成します。 Webサーバーを起動します。 ThinkPHP アプリケーションを初期化します。 ThinkPHP アプリケーションの URL にアクセスして実行します。

jQuery AJAX リクエストで発生した 403 エラーを解決する方法 Feb 20, 2024 am 10:07 AM

タイトル: jQuery AJAX リクエストの 403 エラーを解決する方法とコード例。403 エラーは、サーバーがリソースへのアクセスを禁止するリクエストを指します。このエラーは通常、リクエストにアクセス許可がないか、サーバーによって拒否されたために発生します。 jQueryAJAX リクエストを行うときにこのような状況に遭遇することがありますが、この記事ではこの問題の解決方法とコード例を紹介します。解決策: 権限を確認します。まず、要求された URL アドレスが正しいことを確認し、リソースにアクセスするための十分な権限があることを確認します。

jQuery AJAXリクエスト403エラーを解決する方法 Feb 19, 2024 pm 05:55 PM

jQuery は、クライアント側の開発を簡素化するために使用される人気のある JavaScript ライブラリです。 AJAX は、Web ページ全体をリロードせずに、非同期リクエストを送信し、サーバーと対話するテクノロジーです。ただし、jQuery を使用して AJAX リクエストを行うと、403 エラーが発生することがあります。 403 エラーは通常、セキュリティ ポリシーまたは権限の問題が原因で、サーバーによってアクセスが拒否されたエラーです。この記事では、jQueryAJAX リクエストで 403 エラーが発生した場合の解決方法について説明します。

laravelとthinkphpではどちらが優れていますか? Apr 09, 2024 pm 03:18 PM

Laravel フレームワークと ThinkPHP フレームワークのパフォーマンスの比較: ThinkPHP は、最適化とキャッシュに重点を置いて、一般に Laravel よりもパフォーマンスが優れています。 Laravel は優れたパフォーマンスを発揮しますが、複雑なアプリケーションの場合は、ThinkPHP の方が適している可能性があります。

thinkphpのインストール方法 Apr 09, 2024 pm 05:42 PM

ThinkPHP のインストール手順: PHP、Composer、および MySQL 環境を準備します。 Composer を使用してプロジェクトを作成します。 ThinkPHP フレームワークと依存関係をインストールします。データベース接続を構成します。アプリケーションコードを生成します。アプリケーションを起動し、http://localhost:8000 にアクセスします。

jQuery AJAX エラー 403 の問題を解決するにはどうすればよいですか? Feb 23, 2024 pm 04:27 PM

jQueryAJAX エラー 403 の問題を解決するにはどうすればよいですか? Web アプリケーションを開発する場合、非同期リクエストを送信するために jQuery がよく使用されます。ただし、jQueryAJAX の使用時に、サーバーによってアクセスが禁止されていることを示すエラー コード 403 が発生する場合があります。これは通常、サーバー側のセキュリティ設定が原因ですが、回避する方法があります。この記事では、jQueryAJAX エラー 403 の問題を解決する方法と具体的なコード例を紹介します。 1.作る

See all articles

福祉オンライン PHP トレーニング，PHP 学習者の迅速な成長を支援します！

私たちについて 免責事項 Sitemap

© php.cn All rights reserved