我有一个表Product,该表显示一组产品的信息。
<table id="item_table" class="table table-sm table-hover table-bordered"> <thead class="thead-inverse"> <tr> <th colspan="2">Date</th> <th colspan="6">Product name</th> <th colspan="2">Category</th> <th colspan="2">Amount</th> </tr> </thead> <tbody> {% for item in product_list %} <tr> <td colspan="2">{{ item.date }}</td> <td id="item_name_format" colspan="6">{{ item.name }}</td> {% if item.category_id %} <td id="item_name_format" colspan="2">{{ item.category_id.level1_desc }}</td> {% endif %} <td id="item_amt_format" colspan="2">${{ item.amount|intcomma }}</td> </tr> {% endfor %} </tbody> </table>
我正在使用下面的Ajax调用您更新表。
$(document).ready(function(){ // Submit post on submit $('.item_num').on('click', function(event){ event.preventDefault(); var item_num = $(this).attr('id'); update_item(item_num); }); function update_item(item_num) { console.log(item_num) // sanity check $.ajax({ type: 'GET', url:'update_items', data: { 'item_num': item_num }, success: function(result){ console.log(result); ???$('item_table').product_list = result;??? }, ... more code
如何在我的Ajax调用中使用“结果”更新变量product_list?
这应该更新表吧?
谢谢
你不能这样。更好的方法是通过ajax加载html的那部分。
您的ajax视图:
def update_items(request): product_list = your_data return render(request, 'table_body.html', {'product_list':product_list})
您的主要html:
<tbody class="table_body"> {% include 'table_body.html' %} </tbody>
table_body.html:
{% for item in product_list %} <tr> <td colspan="2">{{ item.date }}</td> <td id="item_name_format" colspan="6">{{ item.name }}</td> {% if item.category_id %} <td id="item_name_format" colspan="2">{{ item.category_id.level1_desc }}</td> {% endif %} <td id="item_amt_format" colspan="2">${{ item.amount|intcomma }}</td> </tr> {% endfor %}
您的ajax看起来像这样:
function update_item(item_num) { console.log(item_num) // sanity check $('.table_body').html('').load( "{% url 'update_items' %}?item_num=" + item_num ); // <--- this code instead of $.ajax(lala)
你在这里使用这个load()