簡體   English   中英

刷新django模板生成的<div>元素

[英]Refresh <div> element generated by a django template

如何刷新django模板中的某個元素?
例:

{% if object.some_m2m_field.all %}
    <h3>The stuff I want to refresh is below</h3>
    <div id="the-div-that-should-be-refreshed">
    {% for other_object in object.some_m2m_field.all %}
        <a href="www.example.com">{{ other_object.title }}</a>
        &nbsp;
    {% endfor %}
    </div>
{% endif %}

讓我們說頁面中的其他一些元素會觸發一個應該刷新上面div的javascript。 有沒有辦法讓django刷新模板中的這個特定元素?

如果沒有,我將不得不使用常規JS或jQuery方法對div進行修補,而不是使用django模板層的強大功能。 另外,上面的代碼是對實際模板的簡化,我使用了很多模板的功能,因此猴子修補生成的html將是一場噩夢......

您可以使用異步請求來填充div元素。 django使用模板引擎回答異步請求。

在這種情況下,您必須將div元素的模板代碼外包到單獨的模板文件中。

更新示例:

使用Javascript:
要異步刷新視圖,請使用JQuery作為示例:

$.ajax({
  url: '{% url myview %}',
  success: function(data) {
  $('#the-div-that-should-be-refreshed').html(data);
  }
});

異步查看:

def myview(request):
    object = ...
    return render_to_response('my_template.html', { 'object': object })

模板:

{% for other_object in object.some_m2m_field.all %}
    <a href="www.example.com">{{ other_object.title }}</a>
    &nbsp;
{% endfor %}

最好的祝福!

你可以看看例如。 這個Ajax與Django教程 無論如何,如上所述,無論是在普通請求還是在ajax請求中調用視圖,都可以使用django的模板引擎! 如果你必須更頻繁地使用帶有django的ajax,那么看看像dajax這樣的東西是有意義的 ,這是django的ajax庫(看看那里的教程)。

重新加載<div> Django 中的元素,但沒有發生刷新</div><div id="text_translate"><p>我正在從條形碼掃描儀將對象添加到我的數組列表中。 每次掃描條形碼掃描儀后都會添加數據,這取決於用戶掃描的速度。 為了顯示這些數據,我創建了一個頁面。 我不希望整個頁面刷新,而是應該顯示掃描代碼的特定 div。</p><p> 這是我到目前為止所做的</p><p>網址.py</p><pre> path('status', include('detect_barcodes.urls')),</pre><p> 視圖.py:</p><p> @ms_identity_web.login_required</p><pre> def detect(request): stream = CameraStream() success, frame = stream.camera.read() if success: status = True else: status = False bar_codes = stream.used_codes data = (",\n".join(bar_codes)) return render(request, 'detect_barcodes/detect.html', context={'data': data, 'cam_status': status})</pre><p> 模板文件(detect.html):(我想自動刷新 id="container" 的 div)</p><pre> &lt;div class="main-wrap"&gt; &lt;div class="container"&gt; {% if cam_status %} &lt;img src="{% url 'camera_feed' %}" style="width: 640px; height: 480px;"/&gt; {% else %} &lt;h3&gt;Camera stream status: Camera is either not accessible or busy&lt;/h3&gt; &lt;h5&gt;Things to check:&lt;/h5&gt; &lt;ul class="text-right list-inline"&gt; &lt;li&gt;USB connection?&lt;/li&gt; &lt;li&gt;Camera number in your.env file?&lt;/li&gt; &lt;li&gt;Camera is already in use?&lt;/li&gt; &lt;/ul&gt; {% endif %} &lt;/div&gt; &lt;div class="container" id="container"&gt; &lt;form action="/submit/" method="post"&gt; {% csrf_token %} Fill the Detail: &lt;br/&gt; &lt;textarea id="description" rows="17" cols="90" name="description" class="myForm"&gt; {{ data }} &lt;/textarea&gt; &lt;input type="submit" value="submit"/&gt; &lt;/form&gt; &lt;/div&gt; &lt;/div&gt;</pre><blockquote><p> 當我運行代碼並掃描時,沒有對 div 進行刷新</p></blockquote><p>我已經嘗試過使用 js 位</p><pre>&lt;script&gt; function refresh() { $.ajax({ url: "{% url 'detect_barcodes' %}", success: function (data) { $('#container').replaceWith($('#container', data)); // NOTE this } }); } var seconds = 3; // seconds, edit here setInterval(refresh(), seconds * 1000); &lt;/script&gt;</pre><p> 到目前為止,刷新 div 沒有運氣,即使更改了數組列表中的值,該值也不會顯示。 我最終手動重新加載整個頁面以顯示數據。</p></div>

[英]Reloading a <div> element in Django but no refresh happening

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 重新加載<div> Django 中的元素,但沒有發生刷新</div><div id="text_translate"><p>我正在從條形碼掃描儀將對象添加到我的數組列表中。 每次掃描條形碼掃描儀后都會添加數據,這取決於用戶掃描的速度。 為了顯示這些數據,我創建了一個頁面。 我不希望整個頁面刷新,而是應該顯示掃描代碼的特定 div。</p><p> 這是我到目前為止所做的</p><p>網址.py</p><pre> path('status', include('detect_barcodes.urls')),</pre><p> 視圖.py:</p><p> @ms_identity_web.login_required</p><pre> def detect(request): stream = CameraStream() success, frame = stream.camera.read() if success: status = True else: status = False bar_codes = stream.used_codes data = (",\n".join(bar_codes)) return render(request, 'detect_barcodes/detect.html', context={'data': data, 'cam_status': status})</pre><p> 模板文件(detect.html):(我想自動刷新 id="container" 的 div)</p><pre> &lt;div class="main-wrap"&gt; &lt;div class="container"&gt; {% if cam_status %} &lt;img src="{% url 'camera_feed' %}" style="width: 640px; height: 480px;"/&gt; {% else %} &lt;h3&gt;Camera stream status: Camera is either not accessible or busy&lt;/h3&gt; &lt;h5&gt;Things to check:&lt;/h5&gt; &lt;ul class="text-right list-inline"&gt; &lt;li&gt;USB connection?&lt;/li&gt; &lt;li&gt;Camera number in your.env file?&lt;/li&gt; &lt;li&gt;Camera is already in use?&lt;/li&gt; &lt;/ul&gt; {% endif %} &lt;/div&gt; &lt;div class="container" id="container"&gt; &lt;form action="/submit/" method="post"&gt; {% csrf_token %} Fill the Detail: &lt;br/&gt; &lt;textarea id="description" rows="17" cols="90" name="description" class="myForm"&gt; {{ data }} &lt;/textarea&gt; &lt;input type="submit" value="submit"/&gt; &lt;/form&gt; &lt;/div&gt; &lt;/div&gt;</pre><blockquote><p> 當我運行代碼並掃描時,沒有對 div 進行刷新</p></blockquote><p>我已經嘗試過使用 js 位</p><pre>&lt;script&gt; function refresh() { $.ajax({ url: "{% url 'detect_barcodes' %}", success: function (data) { $('#container').replaceWith($('#container', data)); // NOTE this } }); } var seconds = 3; // seconds, edit here setInterval(refresh(), seconds * 1000); &lt;/script&gt;</pre><p> 到目前為止,刷新 div 沒有運氣,即使更改了數組列表中的值,該值也不會顯示。 我最終手動重新加載整個頁面以顯示數據。</p></div> 如何在 Django 模板中使用 Jquery/Ajax 正確刷新 div Django - 使用Javascript刷新模板中的div的最佳方法? 刷新div ajax中的元素 如何刷新Django模板中的表格 選擇具有由模板生成的ID的元素 以設定的間隔刷新DIV元素 定期刷新Django模板中的占位符和canvas標簽 Django模板中動態生成表單的Javascript驗證 沒有刷新的Django Ajax Update Div
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM