Django内联formset（UI）删除/删除

Question

我正在尝试使用UI而不是使用内置inlineformset_factory形式的django来创建内联formset。在这里，我完成了add_view和edit_view。在编辑视图中，我可以更新父模型和子模型的现有记录，并可以向子模型添加新记录。但我无法从内联formset中删除子模型中的现有记录。在客户端，每件事情都很好。当我从UI中单击“删除”按钮时，javascript将删除该记录，但在服务器端，在edit_view中，#Delete Existing record块云采用删除/删除功能。我尝试了很多可能的方法，但我不能从客户端对删除的项目进行删除查询。

models.py

from django.db import models

class Category(models.Model):
    name        =   models.CharField(max_length=128)

    def __unicode__(self):
        return self.name

class Product(models.Model):
    category    =   models.ForeignKey(Category)
    name        =   models.CharField(max_length=128)
    price       =   models.CharField(max_length=128)

views.py

def add(request):
    context =  RequestContext(request)
    if request.method == 'POST':
        category = Category.objects.create(name = request.POST['category'])
        try:
            for n in range(1,7):
                product = Product.objects.create(category= category,name=request.POST['name_'+str(n)],price=request.POST['price_'+str(n)])
        except KeyError:
            pass
        return HttpResponseRedirect('/')
    return render_to_response('add.html',context)

def edit(request,pk):
    category = get_object_or_404(Category,id=pk)
    product = Product.objects.filter(category=category)
    product_count = product.count()
    context =  RequestContext(request)
    if request.method == 'POST':
        for c in Category.objects.filter(id = category.id):
            c.name = request.POST['category']
            c.save()
            try:
                #Update Existing record(child)
                for p,n in zip(Product.objects.filter(category = c),range(1,7)):
                    p.name = request.POST['name_'+str(n)]
                    p.price = request.POST['price_'+str(n)]
                    p.save()
            except KeyError:
                #Delete Existing record(child)
                try:
                    for d in range(1,7):
                        for i in Product.objects.all().filter(name=request.POST.get('name_'+str(d)),price=request.POST.get('price_'+str(d))):
                            print i.name

                except KeyError:
                    pass
            else:
                #Add new record(child)
                try:
                    for r in range(1,7):
                        product,created = Product.objects.update_or_create(category= category,name=request.POST['name_'+str(r)],price=request.POST['price_'+str(r)])
                except KeyError:
                    pass
        return HttpResponseRedirect('/')
    args = {'category':category,'product':product,'product_count':product_count}
    return render_to_response('edit.html',args,context)

add.html

<h1>Add</h1>
<script type="text/javascript">
var i = 1;
function addProduct(){
        if (i <= 5){
                i++;    
        var div = document.createElement('div');
        div.innerHTML = 'Name:<input type="text" name="name_'+i+'" >Price:<input type="text" name="price_'+i+'" ><input type="button" value="-" onclick="removeProduct(this)">';
        document.getElementById('products').appendChild(div);
        }
}

function removeProduct(div) {       
    document.getElementById('products').removeChild( div.parentNode );
        i--;
}
</script>

<form method="post" action="/add/">{% csrf_token %}
    <label>Category</label>
    <div>
    <input type="text" name="category">
    </div>
    <label>Product</label>
    <div id="products">
        <input type="button" id="add_product()" onClick="addProduct()" value="+" />(limit 6)<br>
        Name:<input type="text" name="name_1">Price:<input type="text" name="price_1">

    </div>
    <div>
        <input type="submit" value="Submit">
    </div>
</form>

edit.html

<h1>Edit</h1>
<script type="text/javascript">
var i = {{product_count}};

function addProduct(){
        if (i <= 5){
                i++;    
        var div = document.createElement('div');
        div.innerHTML = 'Name:<input type="text" name="name_'+i+'" >Price:<input type="text" name="price_'+i+'" ><input type="button" value="-" onclick="removeProduct(this)">';
        document.getElementById('products').appendChild(div);
        }
}

function removeProduct(div) {       
    document.getElementById('products').removeChild( div.parentNode );
        i--;
}
</script>

<form method="post" action="/edit/{{category.id}}/">{% csrf_token %}
    <label>Category</label>
    <div>
    <input type="text" name="category" value="{{category}}">
    </div>
    <label>Product</label>


    <div id="products">
        <input type="button" id="add_product()" onClick="addProduct()" value="+" />(limit 6)
        {% for list in product %}
        <div>
            Name:<input type="text" name="name_{{ forloop.counter }}" value="{{list.name}}">Price:<input type="text" name="price_{{ forloop.counter }}" value="{{list.price}}"><input type="button" value="-" onclick="removeProduct(this)">
        </div>
        {% endfor %}
    </div>
    <div>
        <input type="submit" value="Submit">
    </div>
</form>