yii2 の Gridview と組み合わせてモーダル ポップアップ ウィンドウのサンプル コードを使用する方法の詳細な説明、yii2gridview

yii2のモーダルポップアップウィンドウとgridviewの組み合わせの詳しい説明 前回の記事ではyii2gridview

で作成を例にYii2のモーダルポップアップウィンドウの使い方(基本的な使い方)を紹介しました。例。

実際の開発では、モーダルを使って一覧ページのデータを変更する場面によく遭遇しますが、一般的なループ表示であれば、モーダルの基本的な使い方を見た上で操作できる人がほとんどだと思いますが、グリッドビューと組み合わせると、問題が発生する人もいるかもしれません。それでは、この問題を解決する方法を見てみましょう。

1. GridViewオペレーションに[Update]ボタンを追加し、data-toggle data-target classとdata-idの値を指定します

リーリー

2. 更新用のモーダルを追加します

リーリー

JS;

リーリー

3. 更新方法を変更します

リーリー

プロセス全体は、前に説明したモーダルの基本的な使用法と何ら変わらないことがわかります。しかし、これで終わるわけではありません。ほとんどの人は、解決が難しい次のような一般的な問題に遭遇する可能性があると思います。

select2 は yii2 モーダルで使用されています。検索ボックスが検索できないのはなぜですか?

yii2 1 つのページに複数のモーダルがあるのに、ページが 1 つのモーダルを共有し、データが読み込まれるまで待機するのはなぜですか?

yii2 単一のページに複数のモーダルがあります。単一のページを追加して上記のグリッドビューを更新すると、更新された select2 が無効になるのはなぜですか?

これらの問題を 1 つずつ解決する方法を見てみましょう:

最初の質問は、モーダルの使用を開始するときにoptionsオプションのtabindexをfalseに指定するだけです。参考は次のとおりです。 リーリー

2 番目と 3 番目の問題は、1 つのページで複数のモーダルを使用することによって発生します。問題を説明するために、リストの [作成] ボタンとグリッドビューの [更新] ボタンの両方でモーダルを使用します。 Yii2 でモーダルポップアップを使用する方法 (基本的な使用法) とこの記事によると、最初の質問は明らかに

リーリー

複数のモーダルが原因で、初めてモーダルを使用した後、すべてのモーダルの本体に値が割り当てられるため、後で他のモーダルが使用されたときに、データが要求される前に同じ内容が表示されます。この問題を解決するには、各非同期リクエストの後にそれぞれのモーダル本体に個別の値を割り当てるだけで済みます。コードは次のように参照できます。 リーリー

最後の質問を見てください。select2 を使用したことがある学生は注意してください。 ！ ！

このトピックで紹介した例のように、フォームにselect2が含まれていると、[作成]時のみselect2フィールドが正常になり、[更新]操作時はselect2フィールドが「非表示」になります。

これは実際には、同じページ上の同じ select2 に対応する ID が原因で発生します。この問題を解決するには、データの各非同期リクエストの前に、ページ上の既存のフォーム項目をすべて削除するだけです。具体的な実装を参照してください:

リーリー

上記は、エディターが紹介した yii2 の Gridview と組み合わせたモーダル ポップアップ ウィンドウの使用方法のサンプル コードの全体の説明です。ご質問があれば、メッセージを残してください。編集者が時間内に返信します。また、Bangkejia ウェブサイトをサポートしてくださった皆様にも感謝いたします。