0

シンプルな買い物リスト Web アプリケーションを構築しようとして、Python、Django、Javascript、および jQuery を学んでいます。私のアプローチが正しいかどうか、経験豊富な開発者から聞きたいです。

機能性: Web ページに食品のリストが表示されます。特定の食品をクリックすると、食材のリストが表示されるようにしたい (これが私の買い物リストになります)。別の食べ物をクリックすると、買い物リストに食材が追加されます。

私のアプローチ: django で簡単なページを作成しました。データベースに入力されたすべての食品のリストを表示できます。ここで必要なのは、食品をクリックして材料のリストを作成することです。

最初のページの読み込み時にデータベースから成分のリストを読み込むが、css でそれらを非表示にすることを考えていました。食品をクリックすると、jquery/css を使用して食品に関連付けられた食材を再表示します。

このアプローチは、私にはかなり不器用に思えます。上記のテクノロジを使用してショッピング リスト アプリケーションを作成する方法についてアドバイスをいただけますか? 私のアプローチは正しいですか？

4

2 に答える 2

3

これが私がそれを行う方法です。ただし、この質問に対する正解はないことに注意してください。

食べ物をクリックしたページを呼び出しましょうindex.php。

indexでは、クリックできるすべての食品と、ID「材料」を持つ空の div があります。<div id="ingredients"></div>

食品がクリックされると、 で jQuery ハンドラーが呼び出されますmain.js。

onClick ハンドラは次のようになります。

  • 現在選択されている食品を追跡する
  • json またはその他の形式のリストをget_ingredients.phpAJAX 経由でページに送信します。
  • (このページは、「Ingedients」セクションに表示したい HTML を返します)
  • AJAX 呼び出しによって返された html を使用して、成分 div のコンテンツを設定します。

より明示的には、次のようにget_ingredients.phpなります。

  • (AJAX 経由で) 送信された食品の GET/POST リストを解析します。index
  • データベースにクエリを実行して、選択した食品に必要な材料を確認します
  • ユーザー向けページの "ingredients" div に配置するクエリ結果に対応する HTML を作成します。
  • // echo/ etcを介して「表示」します。これは実際には AJAX で表示されるのではなく、AJAX 応答として送信されます。printprintf

このように、選択した食品を追跡するだけでよく、食品が選択および選択解除されたときに個々の材料の量を加算/減算する必要はありません。

これには、「すでに知っている」もの、つまり以前に選択された食品の成分を再送信するという欠点がありますが、そうでなければ必要な多くの作業が不要になります。

于 2012-06-16T18:14:25.453 に答える
0

@jedwards のコメントは正しいです。最初にすべてのアイテムのすべてをロードする代わりに(最初のページのロードが遅くなる可能性があります)。サーバーにコールバックし、データベース内のオブジェクトの名前またはIDを渡し、その成分を返すオンクリックイベントを実行してから、成分を含むdivにそれらを入力する必要があります。jqueryajax

于 2012-06-16T18:11:05.390 に答える