Search input not rendering- no errors - stuck

Kanatbek-AKA · May 27, 2023, 11:53pm

Hi all,

Can someone please help me to understand what wrong is with the code below? Actually it is working, but if I try to render the second db QuesAnswer searching for/by question, it is not displaying or throwing an error. Although by debugging or using shell I see there is the expected output to display on front-end.

Here is my view.py

class MainPageView(TemplateView):
    model= Definitions
    # template_name = "encyclopedia/draft.html"

    def get(self, request):
        # Get inputs value
        queryOne = request.GET.get('QuizOne')
        queryTwo = request.GET.get('QuizTwo')
        queryThree = request.GET.get('QuizThree')
        #
        if queryOne:
            def_output = Definitions.objects.filter(
                Q(term__icontains=queryOne) | Q(term__contains=queryOne)
                )
            ques_output = QuesAnswer.objects.values().filter(
                Q(question__icontains=queryOne) | Q(question__contains=queryOne)
                )
            # print(ques_output)
            return render(request, 'encyclopedia/draft.html', {'def_object': def_output, "ques_object": ques_output})
        elif queryTwo:
            def_output = Definitions.objects.filter(
                Q(term__icontains=queryTwo) | Q(term__contains=queryTwo)
                )
            ques_output = QuesAnswer.objects.values().filter(
                Q(question__icontains=queryTwo) | Q(question__contains=queryTwo)
                )
            # print(ques_output)
            return render(request, 'encyclopedia/draft.html', {'def_object2': def_output, "ques_object2": ques_output})
        elif queryThree:
            def_output = Definitions.objects.filter(
                Q(term__icontains=queryThree) | Q(term__contains=queryThree)
                )
            ques_output = QuesAnswer.objects.values().filter(
                Q(question__icontains=queryThree) | Q(question__contains=queryThree)
                )
            # print(ques_output)
            return render(request, 'encyclopedia/draft.html', {'def_object3': def_output, "ques_object3": ques_output})

        return render(request, 'encyclopedia/draft.html', {})

Models.py

class Definitions(models.Model):
    # user = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
    term = models.CharField(null=False, blank=False, max_length=10, validators=[MinLengthValidator(limit_value=2, message="Hehe, the minimum required character is 2. Look at the example.")])
    definition = models.CharField(null=False, blank=False, max_length=1500, validators=[MinLengthValidator(limit_value=100, message="Term defition should contain minimum 100 characters.")])
    
    def __str__(self) -> str:
        return self.term
    
    
class QuesAnswer(models.Model):
    # user = models.ForeignKey(settings.AUTH_USER_MODEl, on_delete=models.CASCADE)
    question = models.CharField(max_length=500, null=False, blank=False)
    
    A="don't know"
    B='need time'
    C='reading book'
    D='any answer'
    QUESTION_CHOICE = [
        ("select", 'Choose one...'),
        (A, "Don\'t know"),
        (B, 'Need time'),
        (C, 'Reading book'),
        (D, 'Any answer')]
    
    choices = models.CharField(
            max_length=100, choices=QUESTION_CHOICE, blank=True, default='select')
    
    answer = models.CharField(max_length=1, null=False, blank=False)
    explanation = models.TextField()
    
    def __str__(self) -> str:
        return self.question

draft.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

         <div class="term_search">
          <div class="srch" id="srch">
            <h3 class="h3">Quick search</h3>
            <div class="srch_input">
              <form action="{% url 'encyclopedia:index' %}" method="get" class="fsearch" id="formOne">
                  {% csrf_token %}
                  <i>for question/term:</i>
                  <input
                    type="text"
                    name="QuizOne"
                    placeholder="e.g iod or what is battery?"
                    class="w-50 rounded"
                    minlength="2"
                    size="150"
                    maxlength="150"
                    required
                  />
                  <button id="btnOne" class="btn btn-info">Find</button>
                  <!-- default name for the context in ListView  -->
                  {% for word in def_object %}
                  {% for qword in ques_object %}
                     {% if word.term %}
                     <div class="srch_output" >
                      <div>
                        {{ word.id }}.&nbsp; {{ word.term }} <br />
                        Definition: &nbsp; {{ word.definition }}
                      </div>  
                    </div>
                    {% if qword.question %}
                    <div class="srch_output" >
                      <div>
                        {{ qword.id }}.&nbsp; {{ qword.question }} <br />
                        Answer choice: &nbsp; {{ qword.answer}} - {{ qword.choices }} <br />
                        Explanation:&nbsp; {{ qword.explanation}}
                      </div>  
                    </div>
                    {% else %}
                    <div class="srch_output" >
                      <div>
                          Please search for a term to get definition or for a question to get answer and right choice to understand.
                      </div>  
                    </div>
                    {% endif %}

                    {% else %}
                    <div class="srch_output" >
                      <div>
                          Please search for a term to get definition or for a question to get answer and right choice to understand.
                      </div>  
                    </div>
                    {% endif %}
                    {% endfor %}
                  {% endfor %}
                </form>
              </div>
            </div>
        </div>


         <div class="term_search">
          <div class="srch" id="srch">
            <h3 class="h3">Quick search</h3>
            <div class="srch_input">
              <form action="{% url 'encyclopedia:index' %}" method="get" class="fsearch" id="formTwo">
                  {% csrf_token %}
                  <i>for question/term:</i>
                  <input
                    type="text"
                    name="QuizTwo"
                    placeholder="e.g ip or what is ip?"
                    class="w-50 rounded"
                    minlength="2"
                    size="150"
                    maxlength="150"
                    required
                  />
                  <button id="btnTwo" class="btn btn-info">Find</button>
                  <!-- default name for the context in ListView  -->
                  {% for iod in def_object2 %}
                  {% for qiod in ques_object2 %}
                     {% if word.term %}
                     <div class="srch_output" >
                      <div>
                        {{ iod.id }}.&nbsp; {{ iod.term }} <br />
                        Definition: &nbsp; {{ iod.definition }}
                      </div>  
                    </div>
                    {% if qiod.question %}
                    <div class="srch_output" >
                      <div>
                        {{ qiod.id }}.&nbsp; {{ qiod.question }} <br />
                        Answer choice: &nbsp; {{ qiod.answer}} - {{ qiod.choices }} <br />
                        Explanation:&nbsp; {{ qiod.explanation}}
                      </div>  
                    </div>
                    {% else %}
                    <div class="srch_output" >
                      <div>
                          Please search for a term to get definition or for a question to get answer and right choice to understand.
                      </div>  
                    </div>
                    {% endif %}

                    {% else %}
                    <div class="srch_output" >
                      <div>
                          Please search for a term to get definition or for a question to get answer and right choice to understand.
                      </div>  
                    </div>
                    {% endif %}
                    {% endfor %}
                  {% endfor %}
                </form>
              </div>
            </div>
        </div>

         <div class="term_search">
          <div class="srch" id="srch">
            <h3 class="h3">Quick search</h3>
            <div class="srch_input">
              <form action="{% url 'encyclopedia:index' %}" method="get" class="fsearch" id="formThree">
                  {% csrf_token %}
                  <i>for question/term:</i>
                  <input
                    type="text"
                    name="QuizThree"
                    placeholder="e.g it or what is it?"
                    class="w-50 rounded"
                    minlength="2"
                    size="150"
                    maxlength="150"
                    required
                  />
                  <button id="btnThree" class="btn btn-info">Find</button>
                  <!-- default name for the context in ListView  -->
                  {% for ict in def_object3 %}
                  {% for qict in ques_object3 %}
                     {% if word.term %}
                     <div class="srch_output" >
                      <div>
                        {{ ict.id }}.&nbsp; {{ ict.term }} <br />
                        Definition: &nbsp; {{ ict.definition }}
                      </div>  
                    </div>
                    {% if qict.question %}
                    <div class="srch_output" >
                      <div>
                        {{ qict.id }}.&nbsp; {{ qict.question }} <br />
                        Answer choice: &nbsp; {{ qict.answer}} - {{ qict.choices }} <br />
                        Explanation:&nbsp; {{ qict.explanation}}
                      </div>  
                    </div>
                    {% else %}
                    <div class="srch_output" >
                      <div>
                          Please search for a term to get definition or for a question to get answer and right choice to understand.
                      </div>  
                    </div>
                    {% endif %}

                    {% else %}
                    <div class="srch_output" >
                      <div>
                          Please search for a term to get definition or for a question to get answer and right choice to understand.
                      </div>  
                    </div>
                    {% endif %}
                    {% endfor %}
                  {% endfor %}
                </form>
              </div>
            </div>
        </div>
</body>
</html>

The only problem is that if I search by question to get the explanation, answer etc, it does not render anything on front-end.

By the way, buttons are disabled here.

Thanks in advvance.

Kind regards,
Kanatbek

cehceh · May 28, 2023, 8:46am

Why the buttons are disabled, search input needs a search button to be clicked, So if disabled you will get NOTHING

Kanatbek-AKA · May 28, 2023, 1:14pm

Hi cehceh,

Buttons in this sample code do not do anything therefore they are disabled. By the way, thanks for noticing it.

Kind regards,
Kanatbek

cehceh · May 28, 2023, 1:27pm

You are welcome

Another thing I can notice “ques_output” will produce a dictionary because you use .values()
Try to remove it and look if it works .

Kanatbek-AKA · May 28, 2023, 1:30pm

I tried it by removing values() as well as tried by adding f-string e.g. Q(question__icontains = f’{queryOne}’ - both failed - no errors and renders.

cehceh · May 28, 2023, 4:32pm

Try to make a context variable then pass it to the last render

if ('QuizOne' in request.GET) and request.GET['QuizOne'].strip():
...
context = {'def_object': def_output, "ques_object": ques_output}

elif queryTwo:
...
context = {'def_object2': def_output, "ques_object2": ques_output}

As the following

return render(request, 'encyclopedia/draft.html', context=({} | context))

I think your variables didn’t pass to the templates

Also try this for all queryOne , Tow and Three

if ('QuizOne' in request.GET) and request.GET['QuizOne'].strip():

Hope this helps

Kanatbek-AKA · May 29, 2023, 1:07am

Thanks cehceh for the effort and your answers,

I used your suggestion and the result is the same, searching for term renders the output, but not for questions. I think I am going to convert values() dict output to string to display.

Kind regards,
Kanatbek

cehceh · May 29, 2023, 5:05am

Okay, I wish to fix your issue and find what you are looking for.

But for debugging

Use (print()) in your views.py to know if your variables produce values or return empty
Also print the passing variables in your templates directly without nested for loop

In order to see what is going on .

Good luck

Topic		Replies	Views
Django form not rendering in html Using Django	2	1301	September 1, 2020
Tutorial 3 template logic puzzle Using Django	3	790	August 11, 2020
Whats wrong with my search string? I am not getting proper data Mystery Errors	1	481	April 14, 2022
Views not rendering properly Using Django	1	972	November 5, 2020
Search Bar returns SQL on the GET query Templates & Frontend	1	378	October 21, 2022

Search input not rendering- no errors - stuck

Related topics