1

テンプレートに4列の製品テーブルがあり、テーブルの各アイテムには次のonclickようなアンカーがあります。

<div id="tablepro">
    <table>
        <tr>
        {% for product in cat.products.all %}
            {% if forloop.counter|divisibleby:4 %}
                </tr>
                <tr>
                    <td><center><a href="#" onclick="remove({{product.pk}});">delete</a></br><img style="width:200px;height:200px;" class="magnify" src="{{product.image.url}}" /></center></td>
            {% else %}
                    <td><center><a href="#" onclick="remove({{product.pk}});">delete</a></br><img style="width:200px;height:200px;" class="magnify" src="{{product.image.url}}" /></center></td>
            {% endif %}
        {% endfor %}
    </table>
</div>

私がremove function持っている：

function remove(id)
{
    var URL='{% url CompanyHub.views.catDetails company.webSite,cat.id %}';
    URL+='delpro/'+id+'/';
    $.ajax({
        url:URL,
        type:'POST',
        complete:function(){
            var str='<table><tr>';
            {% for product in cat.products.all %}
                {% if forloop.counter|divisibleby:4 %}
                    str+='</tr><tr>';
                    str+='<td><center><a href="#" onclick="remove({{product.pk}});">delete</a></br><img style="width:200px;height:200px;" class="magnify" src="{{product.image.url}}" /></center></td>';
                {% else %}
                    str+='<td><center><a href="#" onclick="remove({{product.pk}});">delete</a></br><img style="width:200px;height:200px;" class="magnify" src="{{product.image.url}}" /></center></td>';
                {% endif %}
            {% endfor %}
            str+='</table>';
            $('#tablepro').html(str);
        },
        error:function(){
            alert('Error');
        }
    });
}

でviews.py：

def deleteProduct(request,key,cat_id,pro_id):
    try:
        company=Company.objects.get(webSite__iexact=key)
    except Company.DoesNotExist:
        Http404
    cat=Category.objects.get(pk=cat_id)
    if pro_id:
        try:
            product=Product.objects.get(pk=pro_id)
            product.delete()
        except Product.DoesNotExist:
            Http404
    return render_to_response('CompanyHub/Company/%s/cat_details.html'%(company.theme),{'company':company,'cat':cat}, context_instance=RequestContext(request))

ご覧のとおり、リストから削除されましcat objectたproduct objectが、テンプレートでDivを更新できませんcat object。テンプレートタグで更新されていないようです。

任意の提案をいただければ幸いです

4

2 に答える 2

1

テンプレートはサーバー側でコンパイルされ、ブラウザはHTMLをレンダリングします。

ajax呼び出し後にdivを更新するには、メソッドでjavascriptコードを使用してdivを更新する必要がありますcomplete。サーバーサイドビューはJSON、XML、HTML、またはその他のデータ型を返すことができ、completeメソッドはそのデータをレンダリングする必要があります。completeサーバー側が部分的なhtml（つまりテーブルのみ）を返す場合のメソッドの例を次に示します。

complete:function(data) {
        $('#tablepro').html(data);
},
于 2012-04-11T06:30:14.717 に答える
1

テンプレートはサーバー側でコンパイルされ、結果の HTML がクライアントに渡されることに注意してください。これは、complete(ajax 呼び出しで) 関数内にあるテンプレート コードが常に同じであることを意味します。つまり、要素を削除する (そしてremove呼び出される) たびに、すべての元のカテゴリが再表示されます。ループ内で生成された HTML は、for非同期ではなく、サーバー側で 1 回作成されます

于 2012-04-11T06:20:58.903 に答える