Django和JQuery：提示時顯示錶單

我目前正在使用Django和JQuery設計一個收件人網站。我擁有存儲在數據庫中的成分和配方說明以及適當的Django視圖。下面是一個例子截圖：Django和JQuery：提示時顯示錶單

Example recipe

我想給用戶選項編輯配方的成分。當用戶點擊「編輯」按鈕時，我想用剩餘的文本替換文本，並在表格中預先填入當前配料成分。事情是這樣的：

Example recipe with first item editing

什麼是添加/刪除這些文字輸入區域的最佳方式？目前，我正在使用樣式元素display: none和display: initial完成工作。有沒有更好的辦法？

2015-01-09 Peaches491

我覺得這個問題很廣泛。有很多移動部件。對於初學者，通過檢查模板中的「{％user.is_authenticated％}」隱藏編輯按鈕。接下來，點擊按鈕（編輯），通過ajax。如果您發現自己陷入困境，可能是您可以編輯問題，併發布您面臨的更具體的問題。 – karthikr

是的。我確實做得很一般。我會盡力削減它。 – Peaches491

您可以檢查用戶是否已通過身份驗證。如果用戶被認證，則設置變量True，如果不是，則設置False。

# views.py 

def my_view(request): 
    if user.is_authenticated(): 
     auth_user = True 
    else: 
     auth_user = False 
    # other code ... 
    return render(... {'auth_user': auth_user, ...})

然後在您的模板中，根據變量auth_user渲染窗體。

{% if auth_user %} 
    Display the form 
{% else %} 
    Display something else 
{% endif %}

來源

2015-01-09 16:46:34 xyres

謝謝你的迴應！不過，我剛剛編輯了縮小這個問題的帖子。不幸的是，您的回覆回答了我已經刪除的問題的部分 – Peaches491

我最終將您的答案納入了我一直在做的事情。 – Peaches491

所以，我想我找到了正確的解決方案，這是xyres'的答案，我已經試圖做的組合。這裏是我的最終結果一些示例代碼：

<h1>{{ recipe.name }}</h1> 

<ul> 
    {% for item in recipe.line_items.all %} 
     <li> 
      <span id="item{{forloop.counter}}_hide">{{ item.full_name }}</span> 
      {% if user_auth %} 
      <form id="item{{forloop.counter}}_show" 
{#     action="{% url 'line_item:edit' %}"#} 
        class="hide-initial" 
        style="display: inline"> 
      {% csrf_token %} 
       <input type="text" name="amount" size="2" value="{{ item.amount }}"/> 
       <input type="text" name="unit" size="4" value="{{ item.unit }}"/> 
       <input type="text" name="name" size="10" value="{{ item.ingredient_adjective }}"/> 
       <input type="text" name="name" size="10" value="{{ item.ingredient_name }}"/> 
       <br> 
       <input type="submit" name="submit" value="Submit"> 
       <input type="button" name="cancel" value="Cancel" 
         onclick="myFunction('item'+{{forloop.counter}}, true)"> 
      </form> 
      <button id="item{{forloop.counter}}_hide" onclick="myFunction('item'+{{forloop.counter}})">Edit</button> 
      {% endif %} 
     </li> 
    {% empty %} 
     <li>No ingredients required!</li> 
    {% endfor %} 
    {% if user_auth %} 
     <button>Add Ingredient</button> 
    {% endif %} 
</ul>

此模板，伴隨着的JavaScript以下位將允許用戶切換形式的知名度，分別爲每個不同的成分。

$(".hide-initial").css("display", "none"); 

function myFunction(inp, reverse) { 
    var show_elements = $("#" + inp + "_show"); 
    var hide_elements = $("#" + inp + "_hide"); 
    if(!reverse) { 
     show_elements.css("display", "initial"); 
     hide_elements.css("display", "none"); 
    } else { 
     hide_elements.css("display", "initial"); 
     show_elements.css("display", "none"); 
    } 
}

來源

2015-01-09 18:48:33 Peaches491

Django和JQuery：提示時顯示錶單

回答

相關問題