Как пометить клонированную форму из inline как удаленную, чтобы Django знал, что сохранять, а что нет

views.py:

def device_add(request):
    if request.method == "POST":
        device_frm = DeviceForm(request.POST) 
        dd_form = DeviceDetailForm(request.POST)
        
        di_formset = inlineformset_factory(Device, DeviceInterface, fields=('moduletype', 'firstportid', 'lastportid'),widgets={  'firstportid':TextInput(attrs={'placeholder': 'e.g. TenGigabitEthernet1/0/1'}), 'lastportid':TextInput(attrs={'placeholder':'eg. TenGigabitEthernet1/0/48'})},extra=1,max_num=3, can_delete=False)
        di_form=di_formset(request.POST)
        if device_frm.is_valid():
        # Create and save the device
        # new_device here is the newly created Device object
            new_device = device_frm.save()
            if dd_form.is_valid():
                # Create an unsaved instance of device detail
                deviceD = dd_form.save(commit=False)
                # Set the device we just created above as this device detail's device
                deviceD.DD2DKEY = new_device              
                deviceD.save()
                if di_form.is_valid():
                    deviceI=di_form.save(commit=False) 
                    print(deviceI)
                    for instances in deviceI:          
                        instances.I2DKEY=new_device
                        instances.save()
                    return render(request, 'interface/device_added.html',{'devices':Device.objects.all()})
                return render(request,'interface/device_add.html',{'form':device_frm, 'dd_form': dd_form, 'di_form':di_form})
            return render(request,'interface/device_add.html',{'form':device_frm, 'dd_form': dd_form, 'di_form':di_form})
        return render(request,'interface/device_add.html',{'form':device_frm, 'dd_form': dd_form, 'di_form':di_form})
    else:
        device_frm = DeviceForm()
        dd_form = DeviceDetailForm()
        di_formset = inlineformset_factory(Device, DeviceInterface, fields=('moduletype', 'firstportid', 'lastportid'), widgets={  'firstportid':TextInput(attrs={'placeholder': 'e.g. TenGigabitEthernet1/0/1'}), 'lastportid':TextInput(attrs={'placeholder':'eg. TenGigabitEthernet1/0/48'})},extra=1, max_num=3, can_delete=False)
        di_form=di_formset(queryset = DeviceInterface.objects.none())
        return render(request,'interface/device_add.html',{'form':device_frm, 'dd_form': dd_form, 'di_form':di_form})

HTML:

Сценарий:

let changeFlag=0;
let maxrow = $('#id_deviceinterface_set-MAX_NUM_FORMS').attr('value');
let totalForms = $('#id_deviceinterface_set-TOTAL_FORMS').val();
console.log(maxrow)
console.log(totalForms)
$('#deleteConfirmation').modal('hide');
function portidChange(val) {
    changeFlag = 1;
    if (val =="")
    changeFlag = 0;
    
}
$('#addrow').click(function () {      
    let totalForms = $('#id_deviceinterface_set-TOTAL_FORMS').val();
    console.log(totalForms)        
    $('#empty-form #removerow').css('display','block');       
    let wholerowclone = $('#empty-form').clone();        
    $('#morerows').append(wholerowclone.html().replace(/__prefix__/g, totalForms));
    $('#id_form-TOTAL_FORMS').attr('value', (parseInt (totalForms))+1);  
    changeFlag=0;    
    if(totalForms==maxrow) {            
        $('#addrow').attr("disabled", true);
        $('#addrow').attr("class","btn btn-rounded btn-danger");
        $('#addrow i').attr("class","");
        $('#addrow').html("Reached max limit");
    }      
})
$(document).on('click', '#removerow', function () {
    let totalForms = $('#id_deviceinterface_set-TOTAL_FORMS').val();
    console.log(totalForms + " total forms");
    let actualformcount = totalForms-1;        
    if(changeFlag==1) {
        console.log("changeFlag=1");
        $('#removerow').attr('data-target', '#deleteConfirmation')           
        $('#deleteConfirmation').modal('show');
        $('#removerowConfirmed').click(function () {
            console.log("clicked")
            $('#removerow').closest('#morerows.row').remove();
            $('#deleteConfirmation').modal('hide');
            if(actualformcount < maxrow) {
                $('#addrow').attr("disabled", false)
                $('#addrow').attr("class","btn btn-outline-success btn-rounded")
                $('#addrow i').attr("class","dripicons-plus")
                $('#addrow').html("+") 
            }  
        })
    }
    else {
        console.log("ChangeFlag 0");
        $('#id_deviceinterface_set-TOTAL_FORMS').attr('value', (parseInt (totalForms))-1);
        $(this).closest('#morerows .row').remove();
        if(actualformcount < maxrow){
            $('#addrow').attr("disabled", false)
            $('#addrow').attr("class","btn btn-outline-success btn-rounded")
            $('#addrow i').attr("class","dripicons-plus")
            $('#addrow').html("+")
        } 
    }         
});

У меня есть набор кодов, предназначенный для управления количеством форм, создаваемых inline с помощью кнопки. Все работает отлично. Но когда дело доходит до сохранения, если я хочу что-то удалить. Я могу удалить только последний клонированный ряд, а все остальные данные, которые не удалены, сохраняются. Но если я удаляю клонированный ряд, который находится в середине, сохраненные данные идут вразнос. Например, мой код позволяет клонировать 3 раза. Таким образом, клон + оригинал = 4. Если я удалю ряд в середине. Скажем, ряд 1 (1-й клон). Он сохраняет оригинал (правильно), никогда не сохраняет 1-й клон (правильно), сохраняет 3-й ряд (правильно) и каким-то образом данные последнего ряда теряются. Может ли кто-нибудь посоветовать мне, что делать? Я застрял здесь уже 3 дня.

Вернуться на верх