Question

I have an inline formset working in my app to add and remove campaigns, but there is a field “display” and if there are 100 registered display’s will be difficult to register 20 inlines. So I created a sidebar with jquery where I select the sector and shows the displays below. The idea is to click the Add button(Adicionar) and create an inline display with the field “display” filled.
How do I create an inline formset that the field “display” come filled with the selected display in the sidebar?

How the image is:
http://postimage.org/image/3qp6bq5f9/

In sidebar I have:

list.append('<ul><li><input class="list-display" type="hidden" value="'+d.pk+'">     '+d.fields['nome']+' | Janelas: '+d.fields['janelas']+'\
                <a class="btn btn-mini" onclick="addInlineFormset('+d.pk+');"     value="Adicionar"><i class="icon-plus-sign"></i> Adicionar</a></li></ul>');

The “d.pk” is the id of selected display.

I still trying create this inlines.
I put a include in form.html:

<div id="janela">
{% include "project/campanha/display_inline.html" %}    
</div>

This is the ajax:

function addJanela(id) {
var object_id = id;
var url = '/project/campanha/get_formInline/'+object_id+'/';
$.ajax({
    type: 'get',
    url: url, 
    success: function(formset){
        var janela = $('#janela');          
            janela.append(formset);
            return false;
   },
}); 
}

My views.py:

def get_formInline(request, object_id):
display = Display.objects.get(pk=object_id)
status = Status.objects.filter(nome__exact='Vendido')
initial=[{'postais' : 45, 'status': status,'display': display,}]
JanelaFormSet = inlineformset_factory(Campanha, Janela, extra=1)
formset = JanelaFormSet(initial=initial)    
return render_to_response('project/campanha/display_inline.html', {'formset': formset,}, context_instance=RequestContext(request))

But in submit save only the last inline. The source code of form.html:

<input type="hidden" name="janela_set-TOTAL_FORMS" value="1" id="id_janela_set-TOTAL_FORMS" /><input type="hidden" name="janela_set-INITIAL_FORMS" value="0" id="id_janela_set-INITIAL_FORMS" /><input type="hidden" name="janela_set-MAX_NUM_FORMS" id="id_janela_set-MAX_NUM_FORMS" />
<table border="0" cellpadding="0" cellspacing="0">
<tbody>

<input type="hidden" name="janela_set-0-id" id="id_janela_set-0-id" />
 <tr>
    <td>Postais: <input type="text" name="janela_set-0-postais" value="45" id="id_janela_set-0-postais" /></td>
    <td>Status: <select name="janela_set-0-status" id="id_janela_set-0-status">
<option value="" selected="selected">---------</option>
<option value="2">Girando</option>
<option value="1">Vendido</option>
</select></td>
    <td>Display: <select name="janela_set-0-display" id="id_janela_set-0-display">
<option value="" selected="selected">---------</option>
<option value="1">Shopping Point</option>
<option value="2">Restaurante</option>
<option value="3">Centro de Artes</option>
</select></td>
<td><input type="checkbox" name="janela_set-0-DELETE" id="id_janela_set-0-DELETE" /></td>

In image print show 3 inlines but in the source appears only 1 inline. =/

Anybody can help?
Thanks!

Answer 1

Solved with this code:

// Ajax function

 $("#add").live("click", function() {
var add = 'add';
var total_forms = $('#id_janela_set-TOTAL_FORMS').val();
var initial_forms = $('#id_janela_set-INITIAL_FORMS').val();
var max_forms = $('#id_janela_set-MAX_NUM_FORMS').val();
var display_id = $(this).val();
var url = '{% url "add_campanha" %}';   
$.ajax({
    type: 'post',
    url: url, 
    data: {
        'janela_set-TOTAL_FORMS': total_forms,
        'janela_set-INITIAL_FORMS': initial_forms,
        'janela_set-MAX_NUM_FORMS': max_forms,
        'add': add,
        'display_id': display_id,
        'csrfmiddlewaretoken':'{{ csrf_token }}',
    },
    success: function(data){
        //alert(data);
        var janela = $('#janela');  
        janela.html(data);
        //cloneMore('#form-campanha tbody tr', 'janela_set');
        console.log('Success!');
   },
}); 

});

Views:

if 'add' in request.POST:           
        cp = request.POST.copy()
        cp['janela_set-TOTAL_FORMS'] = int(cp['janela_set-TOTAL_FORMS'])+ 1
        formset = PrimaryFunctionFormSet(cp, prefix='janela_set')                
        return render_to_response('project/campanha/display_inline.html', {'formset':formset}, context_instance=RequestContext(request))

Template using a include html to render the inline:

<div id="janela">
{% include "project/campanha/display_inline.html" %}        
</div>

Include display.html template:

{{ formset.management_form }}
<table border="0" cellpadding="0" cellspacing="0">
<tbody>
{% for form in formset %}
{{ form.id }}
<tr>
   <td>Postais: {{ form.postais }}</td>
   <td>Status: {{ form.status }}</td>
   <td>Display: {{ form.display }}</td>
   {% if formset.can_delete %}
   <td>{{ form.DELETE }}</td>
   {% endif %}
</tr>
{% endfor %}
</tbody>
</table>

Another problem in append() the formset in this post:
https://stackoverflow.com/questions/10131257/django-and-append-jquery-with-inline-formset-problems