2

前回の質問で大成功だったので、別の質問に挑戦してみようと思いました。

私が働いている会社、印刷施設の「ダッシュボード」を構築しています。このダッシュボードには、現在進行中のすべてのジョブ、完了したジョブなどが一覧表示されます (これにより、そこにいる全員の生活が本当に良くなります)。

PHP クエリを使用して MySQL データベースからすべての顧客情報を取得し、PHP の while ループを使用して DataTable に表示します。各行の最後に編集ボタンがあり、モーダル ボックスが表示され、プリンターが情報を入力してデータベースを更新できるようになります。

これは機能していましたが、私は考え始めました...ほんの一握りの顧客だけがプラグインされていればすべて問題ありませんが、1,000人以上の顧客がいると、それぞれに（PHPのwhileループからの）モーダルボックスが与えられます.

リンクがクリックされたときに正確な顧客データをプルしてボックスを起動する単一のモーダルボックスコードをページに配置することが可能である場合、誰かが私に説明できますか.

モーダルを起動するボタン (これは PHP の while ループにあります):

<a class=\"btn btn-info\" data-toggle=\"modal\" data-target=\"#modal_id\"
href=\"display=" . $row['id'] . "\">
<i class=\"icon-question-sign icon-white\"></i>  
</a>

モーダル コード自体 (PHP の while ループではありません):

<div class="modal hide fade" id="modal_id">
   <div class="modal-header">
       <button type="button" class="close" data-dismiss="modal">×</button>
       <h3>Project Details</h3>
   </div>
   <div class="modal-body">

       ID is <?php echo $display ?>

   </div>
   <div class="modal-footer">
       <a href="#" class="btn btn-primary" data-dismiss="modal">Save Changes</a>
       <a href="#" class="btn" data-dismiss="modal">Close</a>
   </div>
</div>

内部のテキストは次のとおりです: ID is The variable isn't being passed through the buttons href.

解決策はありますか？

4

2 に答える 2

1

最も簡単なアプローチは AJAX だと思います。

  1. 関連するプロジェクト情報を表示する ID を渡すことができるエンドポイントを作成します (yoursite/projects/5 のようなものは、ID が 5 のプロジェクトに関するデータを返します)。
  2. AJAX を使用して ID をそのエンドポイントに送信し、ユーザー データを取得します
  3. 表示されているデータをモーダルに入れます。

リンクをボタンに変更する

<button class="project-button btn btn-info" data-toggle="modal" data-target="#modal_id" data-project-id="<?=$row['id']?>">
  <i class="icon-question-sign icon-white"></i>  
</button>

AJAX 呼び出しの例

var modal_body = $('#modal_id .modal-body');
$('.project_button').on('click', function() {
  var project_id = $(this).data('projectId');
  $.get('/project/', { id: project_id }, function(data) {
    // Populate modal
    modal_body.html(data);
  }
}

明らかに、返されて表示される html を作成する別のページを作成する必要があります。データがモーダルに読み込まれている間に読み込みアニメーションを表示するなど、他にもできることがあります。しかし、これはあなたにとって良い出発点になるはずです。

于 2013-03-14T01:37:49.697 に答える
0

最良の方法は、を使用して、選択した別のページに移動AJAXできるようにすることですid

ここで同じ問題が完全な説明とともに解決されていることがわかりました: http://thecomputerstudents.com/web/using-bootstrap-modal-ajax-import-data-mysql/

于 2014-12-21T16:50:32.697 に答える