Layui関連フォームメソッド

リリース: 2020-06-12 17:41:59
転載
3891 人が閲覧しました

Layui関連フォームメソッド

次に、layui フォームの関連付けを作成します。フォームの関連付けとは何ですか? たとえば、layui テーブルが 2 つあります。最初のテーブルのデータをクエリした後、特定のボタンをクリックします。データの一部について、このデータの主キー ID に基づいて 2 番目のフォームのデータをクエリし、データをバックフィルします。

最初のステップは、2 つのテーブルを準備し、データに対応するヘッダーを設計することです。

Layui関連フォームメソッド

用意したのは 2 つのテーブルです。1 つは VIP テーブル、もう 1 つは VIP ポイント調整テーブルです。しばらくして、次のデータ クエリをクリックします。 VIPフォームのデータを出力する ポイント調整フォームのデータを出力する これら2つのフォームのデータクエリメソッドをコントローラー側で記述しましたので、ページにどのようなデータを表示する必要があるかを見てみましょう。

Layui関連フォームメソッド

ページ上のフォームはこのように表示されます。調整記録テーブルにはまだデータがありません。これは、初期化時に調整フォームのリクエスト パスをログアウトしたためです。上記のフォームのように、さらに多くの条件を指定してクエリを実行する方法はあまりありませんが、クエリ パスにバーを追加し、条件が満たされたときにクエリを開始するだけです。

以下はリスニングイベントであるフォーム関連のイベントで、layuiモジュールをロードするメソッド内にこのイベントを記述する必要があります。ここでのコードの意味は、VIP テーブル内の特定の行のデータを取得し、クリック イベントで変数を宣言し、この変数に値を代入することです。値を代入する場合、通常は ID に代入されます。後で、この ID データに基づいて調整テーブルが照会されます。データをクエリできる場合は、コンソールに割り当てられた値を出力して、それが可能かどうかを確認できます。

//获取VIP表行事件
            layuiTable.on('row(tabVip)', function (obj)
             {
                  var data = obj.data;//获取点击行数据
                  //标注选中样式
           		obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
           		
                    ////***单击选中单选框
                    obj.tr.find('div.layui-unselect.layui-form-radio')[0].click();
                    
                    var vipId = data.VipID;//vip类型id
                    
                    //控制台输出看看是否能获取到VIPid
                    console.log(vipId);
                    
                    //调整记录附件,根据VIPid查询对应的调整记录信息
                    tabAdjustmentRecord.reload
                    ({
                        //查询路径
                        url: '/DailyAffairs/VIPManege/AdjustmentRecord',
                        where:
                         { //设定异步数据接口的额外参数,比如设置多条件查询的参数
                            vipId: vipId
                        },
                        //从第一页开始
                        page:
                         {
                            curr:1
                        }
                    });
                });
ログイン後にコピー

まず効果を見てみましょう:

Layui関連フォームメソッド

#2 番目のデータをクリックしたため、コンソールによって出力される ID は 2 です。 , これは、id が正常に取得されたことを証明します。VIP テーブルの VIPid が取得されなかった場合、調整テーブルにはデータがありません。これには、id 出力があるかどうかを確認するためにコンソール出力が必要です。 id が出力されると、id が正しく取得されていないかどうか、またはコントローラーに ID を渡し、レコードを調整したコントローラーがそれを受け取るために対応する ID を書き込んでいるかどうかを確認します。

詳細については、layui、PHP中国語ウェブサイトlayuiチュートリアルコラム

をご覧ください。

以上がLayui関連フォームメソッドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:csdn.net
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート