0

I have a formset to update my models and I display forms from my formset based on the search query. I have an ajax keyup function to send post requests so I can generate search_results.html that I then pass to in search.html.

Now, if I generate the forms dynamically the submit button does not work. If I ditch the search and pass the content of search_results.html to search.html directly it does work.

I have two views, SearchReportView which supposed to be the main one, and SearchReports to handle generating the report. I guess I might just merge them at this point - it doesn't solve my problem though.

Also I had this working before when I used multiple forms but I had to switch to a formset.

body of search.html

<div class="container">

        <div class="navbar">
            <div class="navbarItem">
                <a href="{% url 'EnbListView' %}"><img src="{% static 'back.png' %}" width="20px" height="12px" \>Back</a>
            </div>
        </div>

    <div>
        <h3>Search:</h3>
        {% csrf_token %}
        <input type="text" id="search" name="search" />
                <span class="button-checkbox">
                <button id="mybutton" type="button" class="btn" data-color="primary">Recent</button>
                <input type="checkbox" class="hidden" name="reports_checkbox" checked />
                </span>
    </div>

        <div class="normalText" id="search-results"></div>

</div>

search_results.html

                    {% if reports_and_formset %}
                    <form action="/TP/auto/report/search/" method="post" enctype="multipart/form-data"> {% csrf_token %}
                    {{ formset.management_form }}
                    {% for x, form in reports_and_formset %}

                            <button type="submit" class="button" >Submit</button>
                            {{ form.checking_user }}
                            {{ form.comment }}
                            {% for hidden in form.hidden_fields %}
                                {{ hidden }}
                            {% endfor %}

                    {% endfor %}
                    </form>
                {% else %}
                    <tr> <td> <center>
                    No results found.
                    </center></td></tr>
                {% endif %}

views.py

class SearchReportView(FormView):

def post(self, request, *args, **kwargs):
    # form = ReportCommentForm(initial={'comment': ''})
    # context = {'form': form}

    if 'form-TOTAL_FORMS' in request.POST:

        single_day_enb_reports = SingleDayEnbReport.objects.all()

        report_form_set = modelformset_factory(SingleDayEnbReport, form=ReportCommentForm,
                                               max_num=single_day_enb_reports.count())

        formset = report_form_set(request.POST, queryset=single_day_enb_reports)

        formset.save()

        return HttpResponseRedirect('/TP/auto/report/search/report_search/')

# @requires_csrf_token
def get(self, request, *args, **kwargs):
    return render(request, 'app/search.html')


class SearchReports(View):

def get(self, request, *args, **kwargs):

    single_day_enb_reports = SingleDayEnbReport.objects.all()

    report_form_set = modelformset_factory(SingleDayEnbReport, form=ReportCommentForm, max_num=single_day_enb_reports.count())
    formset = report_form_set(queryset=single_day_enb_reports)

    single_day_enb_reports_and_formset = zip(single_day_enb_reports, formset)
    # context = {'single_day_enb_reports': single_day_enb_reports, 'formset': formset}
    context = {'reports_and_formset': single_day_enb_reports_and_formset, 'formset': formset}

    return render(request, 'app/search_results.html', context, context_instance=RequestContext(request))

@classmethod
def calculate_dates(self): #not important

def post(self, request, *args, **kwargs):

    if 'form-TOTAL_FORMS' in request.POST:

        single_day_enb_reports = SingleDayEnbReport.objects.all()

        report_form_set = modelformset_factory(SingleDayEnbReport, form=ReportCommentForm,
                                               max_num=single_day_enb_reports.count())

        formset = report_form_set(request.POST, queryset=single_day_enb_reports)

        # if formset.is_valid():
        formset.save()

        return HttpResponseRedirect('/TP/auto/report/search/report_search/')

    if 'button_state' in request.POST:
        search_text = request.POST['search_text']
        button_state = request.POST['button_state']

        if button_state == 'false':
            button_state = False
        else:
            button_state = True

        if button_state:
            now, fit_date = self.calculate_dates()
            single_day_enb_reports = SingleDayEnbReport.objects.all().filter(
                                                         Q(last_modification_date__range=[fit_date, now]) & (
                                                         Q(alarms__contains=search_text)|
                                                         Q(enb__contains=search_text)|
                                                         Q(creation_date__date__contains=search_text) |
                                                         Q(last_modification_date__date__contains=search_text)|
                                                         Q(comment__contains=search_text)|
                                                         Q(checking_user__name__contains=search_text)))
        else:
            single_day_enb_reports = SingleDayEnbReport.objects.all().filter(
                                                         Q(alarms__contains=search_text)|
                                                         Q(enb__contains=search_text)|
                                                         Q(creation_date__date__contains=search_text) |
                                                         Q(last_modification_date__date__contains=search_text)|
                                                         Q(comment__contains=search_text)|
                                                         Q(checking_user__name__contains=search_text))

        report_form_set = modelformset_factory(SingleDayEnbReport, form=ReportCommentForm,
                                                   max_num=single_day_enb_reports.count())
        formset = report_form_set(queryset=single_day_enb_reports)

        single_day_enb_reports_and_formset = zip(single_day_enb_reports, formset)

        context = {'reports_and_formset': single_day_enb_reports_and_formset, 'formset': formset}
        return render_to_response('app/search_results.html', context, context_instance=RequestContext(request))

ajax.js

$('#search').keyup(function(){

delay(function(){
    if($('input[name=reports_checkbox]:checked').val()) button_state = true
    else button_state = false


        $.ajax({
            type: "POST",
            url: "/TP/auto/report/search/report_search/",
            data: {
                'button_state' : button_state,
                'search_text' : $('#search').val(),
                'csrfmiddlewaretoken' : $("input[name=csrfmiddlewaretoken]").val()
                },
            success: searchSuccess,
            dataType: 'html'
        });
 }, 500 );

});
});

    function searchSuccess(data, textStatus, jqXHR){
    //generated data is put into search-results <div>field in search.html
    $('#search-results').html(data);
}
  • Read up on ***[Event delegation](http://learn.jquery.com/events/event-delegation/)*** – charlietfl Aug 01 '17 at 10:52
  • Thanks, I did. So there is no way to post the form without event handler? Is it somehow possible to get the post to generate without refering to every single field by it's id? – J. Podlaski Aug 01 '17 at 12:08
  • Not really clear what you are asking – charlietfl Aug 01 '17 at 12:25
  • Is it possible to use submit button without rewriting it's function in jQuery? – J. Podlaski Aug 01 '17 at 12:41
  • Use classes instead of id's when you have multiple forms. Within an event handler can traverse to current form. Really seems like you need to ask a more specific question – charlietfl Aug 01 '17 at 12:50
  • I guess doing the following will eventually work, thank you for pointing me in the right direction. Now I have to deal with csrf token. $(document).on('click','button', function(){ $('#myForm').trigger( "submit" ); console.log("form submitted!") // sanity check }); – J. Podlaski Aug 01 '17 at 13:13
  • just be aware you can't duplicate id's in a page... not entirely clear what you have going on – charlietfl Aug 01 '17 at 13:14

1 Answers1

0

Please change your this line

$('#search').keyup(function(){

with

$(document).on('keyup','#search', function(){
charlietfl
  • 170,828
  • 13
  • 121
  • 150
Nikhil G
  • 2,096
  • 14
  • 18
  • My ' $('#search').keyup(function(){ is inside of ' $(function () { ' . And the search works just fine, it's the formset submiting I can't figure out. – J. Podlaski Aug 01 '17 at 12:12