Django - フィールドをドロップダウンでタグに変換

Question

私の形式のdjangoには、package_includesというフィールドとpriceというフィールドがあります。今、package_includesの内容は単なるテキストです。だから私は "紙、接着剤、光り輝く"を入力した場合、私はそれを入力したとおりに正確に表示され、何も変更することはできません。しかし、テキストを個々のタグのように動作させたい - >How I want tags to look

個々のアイテム（EX： "paper"、 "glue"、または "glitter"）のいずれかをクリックすると、ドロップダウンすると、追加の$ 2.00のために余分なキラキラを加えることができます。

また、テキストの最後に「追加」と表示されるタグが必要です。この機能を使用すると、この特定のパッケージに含まれていないアイテムを追加できます。たとえば、$ 5のクレヨン、$ 2.50のハイライターなどを追加できるはずです。

私はプログラミングに慣れていないし、djangoのフィールドにこのようなテキストに関数を追加する方法を完全に理解していません。ご協力いただきありがとうございます！

Answer 1

あなたの質問に対する答えは、残念ながら、0から完全な実際の例に進む方法のステップバイステップの指示ではなく、正しい方向のポインタだけです。

必要なものは、CSS（あなたが望む視覚効果を作り出す）とJavaScript（ドロップダウン機能を扱うもので、おそらくjQueryに基づいた独自のスクリプトでなければなりません）によって実現されます。 Djangoは静的なCSSとスクリプトファイルを提供し、実際のページでそれらを正しいテンプレートに入れたときに参照するだけで、あなたが望むものはインターネットブラウザ内で生きていく（実行する）必要があります。ブラウザでページソースを開く場合は、このためのHTMLコードとして表示されますすべては以下の通りです

：

ここ

は似た何かをセキレイ管理の一例です

<div class="field-content"> 
    <div class="input "> 
      <input id="id_tags" name="tags" type="text" value="&quot;hello world&quot;, blog" /><script>initTagField("id_tags", "/admin/tag-autocomplete/");</script> 
     <span></span> 
    </div> 
</div> 

FireBug、ブラウザの開発ツール、またはWeb Developerエクステンションでビジュアルスタイルを適用してページを開くと、次のように分解されます：

あなたが気付いた場合、フォーム入力要素に適用されるスタイルがdisplay: none;です。あなたが見ているのは、実際にはスタイル付けされた順序付けられていないリスト要素の直後です。スクリプトでそれらを使用できるようにするには、JS関数内からそれらのコンテンツにアクセスできる必要があります。 1つの戦略は、すべての可視の<li>要素にid属性を割り当てることです。カウンターベースのものでもかまいません（例：id="shopping-cart-item-0"、id="shopping-cart-item-1"など）。もう1つの方法は、<div class="input">要素にidを割り当て、関数内ではすべて<li>のDOM子孫を取得することです。あなたのために何が良いのか。次に、スクリプト内のリスト要素のラベル（内部テキスト）を解析して、扱っているアイテムのタイプを取得し、次に割引価格を見つけて適用します。

Djangoのためにtaggitや類似のパッケージを使用するアプリケーションを見つけ、それをテストアプリケーションにインストールしてください。次に、あなたのブラウザや好みのWeb開発拡張機能を使って、CSSを使って遊び、さまざまなオプションがあなたの必要とする視覚的な側面にどのように影響するかを見てみましょう。それに慣れたら、jQueryを使ってドロップダウンメニューを構築する方法を見てください。 jQueryサイトには、このトピックに関する十分なチュートリアルがあると思います。