DCAT管理者にデータを追加するためにクリックでテーブルをカスタマイズする方法は？

クリックすると、DCAT管理者にデータを追加するテーブルをカスタマイズします

この記事では、DCAT管理者（Laravel-Admin）にカスタムテーブルを作成する方法について説明し、ユーザーがボタンをクリックしてデータを追加できるようにし、テーブルの数量と色の編集をサポートします。次の図は、ターゲット関数を示しています。

実装手順

1.テーブルを作成してボタンを追加します。

DCAT管理者で、 gridを使用してテーブルを作成し、テーブルツールバーにボタンを追加して、データアクションの追加をトリガーします。次のコードスニペットは、テーブルを作成してボタンを追加する方法を示しています。

 dcat \ admin \ gridを使用します。
dcat \ admin \ layout \ contentを使用します。

パブリック関数インデックス（コンテンツ$ content）
{
    $ contentを返します
         - >ヘッダー（ 'データ管理'）
         - >説明（ 'データの追加'）
         - > body（$ this-> grid（））;
}

保護された関数グリッド（）
{
    $ grid = new grid（new yourmodel（））;

    $ grid-> tools（function（grid \ tools $ tools）{
        $ tools-> append（new \ dcat \ admin \ grid \ tools \ button（ 'ad data'、 'btn-add-data'） - > class（ 'btn btn-primary'））;
    }）;

    //テーブル列定義$ grid-> column（ 'id'、 'id'）;
    $ grid-> column（ 'name'、 'name'）;
    $ grid-> column（ 'quanty'、 'Quants'） - > editable（）;
    $ grid-> column（ 'color'、 'color'） - > select（['red' => 'red'、 'blue' => 'blue' => 'green']）;

    $ gridを返します。
}

2。フロントエンドJavaScriptコード：

jQueryバインディングボタンを使用してイベントをクリックし、AJAXリクエストサーバーを介してデータを取得し、テーブルにデータを追加します。バックエンド処理インターフェイスアドレスの交換/admin/your-endpoint 、 #your-grid-id 。ユーザーエクスペリエンスを向上させるには、DOMを直接操作する代わりに、DCAT管理者が提供するテーブル操作方法を使用することをお勧めします。

 $（document）.on（ 'click'、 '.btn-add-data'、function（）{
    id = prompt（ "IDを入力してください"）;
    if（id）{
        $ .ajax（{
            url： '/admin/your-endpoint'、
            タイプ：「get」、
            データ：{id：id}、
            成功：function（data）{
                if（data）{
                    // DOMを直接操作する代わりにDCAT管理方法を使用して行を追加する
                    dcat.grid.appendrow（ '＃your-grid-id'、data）; //＃your-grid-idをテーブルIDとして置き換えます
                } それ以外 {
                    アラート（ 'データは見つかりません'）;
                }
            }、
            エラー：関数（エラー）{
                alert（ '要求が失敗しました：' error.responsetext）;
            }
        }）;
    }
}）;

3.バックエンドはajaxリクエストを処理します：

バックエンドコントローラーメソッドは、AJAX要求、IDに基づいてデータを照会し、JSONデータを返します。

 Illuminate \ http \ requestを使用します。

パブリック関数getDatum（リクエスト$ request）
{
    $ id = $ request-> input（ 'id'）;
    $ data = yourmodel :: find（$ id）;

    if（$ data）{
        return Response（） - > json（$ data）;
    } それ以外 {
        return Response（） - > json（null）;
    }
}

4。改善提案（DCAT管理者のテーブルAPIを使用）：

DCAT管理者の機能をより適切に統合するには、DCAT管理者が提供するAPIを使用して、DOMを直接操作するのではなく、テーブルを操作することをお勧めします。これにより、コードがDCAT管理者からの更新と互換性があり、メンテナンスが向上します。たとえば、 Dcat.grid.addRow()または同様の行を使用して行を追加することを検討する場合があります。これには、最も適切なAPIメソッドを決定するために、DCAT管理者のドキュメントへの参照が必要です。

上記の手順を通じて、DCAT管理者にカスタムクリックADDデータテーブルを作成できます。 YourModelモデル名に置き換え、実際の状況に従ってコードを調整することを忘れないでください。 DCAT管理者が提供するAPIを使用すると、コードをより簡潔にし、維持しやすく、フレームワークとの統合を改善することができます。

以上がDCAT管理者にデータを追加するためにクリックでテーブルをカスタマイズする方法は？の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。