在AJAX调用之后如何更新django模板上下文变量?

时间:2016-02-02 23:47:52

标签: jquery ajax django django-templates

我有一个表格产品,显示一组产品的信息。

    <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

如何使用&#39;结果&#39;更新变量product_list?从我的Ajax电话?

这应该更新表格吗?

由于

2 个答案:

答案 0 :(得分:15)

你不能这样。更好的方法是通过ajax加载你的html部分。

你的ajax观点:

    public static string DecryptLikeSite(string base64EncodedCipherText, string key)
    {
        using (var alg = new RijndaelManaged())
        {
            alg.BlockSize = 256;
            alg.Key = System.Text.Encoding.ASCII.GetBytes(key).Take(32).ToArray();
            alg.Mode = CipherMode.ECB;
            alg.Padding = PaddingMode.Zeros;
            alg.IV = new byte[] { 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 };

            var cipherText = Convert.FromBase64String(base64EncodedCipherText);

            using (ICryptoTransform decryptor = alg.CreateDecryptor())
            {
                using (var ms = new MemoryStream(cipherText))
                {
                    using (var cs = new CryptoStream(ms, decryptor, CryptoStreamMode.Read))
                    {
                        using (var sr = new StreamReader(cs))
                        {
                            return sr.ReadToEnd().Replace("\0", string.Empty);
                        }
                    }
                }
            }
        }
    }

    public static void Test()
    {
        string key = "yecpPqAJ+PnBMtggWVz42WME3TjhG313OhvBuUJOFtc=";
        string expectedPlainText = "HappyCoding";

        string base64EncodedSiteCipherText = "Lox/sfjNyXOzP9ZE8Fjj9REcuB+iJ1EXXuNjf2du29c=";
        string plainText = DecryptLikeSite(base64EncodedSiteCipherText, key);

        bool success = expectedPlainText == plainText;
    }

你的主要HTML:

def update_items(request):
    product_list = your_data
    return render(request, 'table_body.html', {'product_list':product_list})

table_body.html:

<tbody class="table_body">
   {% include 'table_body.html' %}
</tbody>

你的ajax看起来像这样:

{% 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 %}

你在这里使用load()

答案 1 :(得分:0)

您首先需要为商品创建模型

然后在您的views.py home函数中,从数据库加载项目并将其传递给上下文

示例:

myProduct = Products.objects.all()
context = {'myList': myProduct}
return render(request, "home.html", context)

然后将此Java代码添加到您的Templete,并在用户要添加项目或将其从卡列表中删除时调用它

喜欢:

onClick="toggleCardItem({{item.id}})"

然后

function toggleCardItem(itemId){
     $.ajax({
        type: 'POST',
        url: 'client/add/card',
        data: {'id': itemId},
        success: function(res){
             location.reload();
        }
     })
}

python模板:

{% for item in myList %} etc.....

现在在您的views.py创建

@csrf_exempt
def add_to_card(request):
   if request.method == "POST":
       item_id = request.POST.get("id")
       key = request.session.session_key
       if key:
           find = Clients.objects.filter(session_key=key)
           if find.exists():
               find = find.get()
               card = find.card_list if find.card_list else "[]"
               card = eval(card)
               item_id = int(item_id)
               if item_id in card:
                   card.remove(item_id)
               else:
                   card.append(item_id)
               find.card_list = card
               find.save()
               return HttpResponse("Success")
           else:
               raise PermissionDenied("This page is private, you not allowed to entered!!!")
       else:
           raise PermissionDenied("This page is private, you not allowed to entered!!!")
   else:
       raise PermissionDenied("This page is private, you not allowed to entered!!!")

导入python库:

from django.views.decorators.csrf import csrf_protect, csrf_exempt

现在在url.py中添加

path("client/add/card", views.add_to_card, name="Add to Card"),