I need help on adding a search button to an input field

35 views
Skip to first unread message

Nanjuki Saidat

unread,
Apr 3, 2019, 6:18:22 PM4/3/19
to django...@googlegroups.com
Hi everyone,
I want to add a search button to an input search field , if there is anyone who knows 
how to add a button to the field in crispy form's input field. Please help me out 

Mohammad Etemaddar

unread,
Apr 3, 2019, 7:05:11 PM4/3/19
to Django users
You can use FieldWithButtons in form helper's layout:
https://django-crispy-forms.readthedocs.io/en/d-0/layouts.html

Anirudh Jain

unread,
Apr 3, 2019, 7:05:15 PM4/3/19
to django...@googlegroups.com
You can include the following code in the end

ButtonHolder(
Submit('submit', 'Update', css_class='btn btn-theme small')
)

Take care of proper indentation.

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users...@googlegroups.com.
To post to this group, send email to django...@googlegroups.com.
Visit this group at https://groups.google.com/group/django-users.
To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/CAHrBrjDW%2Bn-oHwdiYRpw%3DdS8HA%2BAH%2Bne3_kjmxz-UHYqPhX9ow%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

Nanjuki Saidat

unread,
Apr 4, 2019, 6:47:46 AM4/4/19
to django...@googlegroups.com

Am not getting you well, please elaborate more

On 3 Apr 2019 22:04, "Anirudh Jain" <anirudha...@gmail.com> wrote:
You can include the following code in the end

ButtonHolder(
Submit('submit', 'Update', css_class='btn btn-theme small')
)

Take care of proper indentation.

On Wed, 3 Apr 2019, 23:48 Nanjuki Saidat, <saidat...@gmail.com> wrote:
Hi everyone,
I want to add a search button to an input search field , if there is anyone who knows 
how to add a button to the field in crispy form's input field. Please help me out 

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users+unsubscribe@googlegroups.com.

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users+unsubscribe@googlegroups.com.

To post to this group, send email to django...@googlegroups.com.
Visit this group at https://groups.google.com/group/django-users.

Nanjuki Saidat

unread,
Apr 10, 2019, 5:30:47 PM4/10/19
to django...@googlegroups.com
hello @mohammad, the link you gave me didnt help me can you have a look at ma code and what i want to achieve so that you get away of helping thanks. 
The first pick shows the outcome of the link you sent me but actually i want it to appear as in the second picture, i want a search button inside an input field not a submit button

On Wed, 3 Apr 2019 at 22:05, Mohammad Etemaddar <mohammad....@gmail.com> wrote:
You can use FieldWithButtons in form helper's layout:
https://django-crispy-forms.readthedocs.io/en/d-0/layouts.html

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users...@googlegroups.com.

To post to this group, send email to django...@googlegroups.com.
Visit this group at https://groups.google.com/group/django-users.
butt0n.png
second.png
code.png

Nanjuki Saidat

unread,
Apr 10, 2019, 5:41:23 PM4/10/19
to django...@googlegroups.com
this one still did the same thing which i didnt mean me i meant an search button in an input field

Nanjuki Saidat

unread,
Apr 10, 2019, 5:44:59 PM4/10/19
to django...@googlegroups.com
Please any one to help me out.thanks

Joel Mathew

unread,
Apr 10, 2019, 5:58:37 PM4/10/19
to django...@googlegroups.com
Use bootstrap's input-group-append
Sincerely yours,

 Joel G Mathew



Nanjuki Saidat

unread,
Apr 11, 2019, 12:51:04 AM4/11/19
to django...@googlegroups.com
hello@joel, how do i use it as in what to import and so on do you have some link or example and show me coz i tried inserting some inputs but when i tried to build the docker didnt meaning i was missing some bootstrap packages to import. can you please tell me how to do it.Thanks

Nanjuki Saidat

unread,
Apr 11, 2019, 1:59:02 AM4/11/19
to django...@googlegroups.com
i tried but still i get an error, here is my code:

######## the beginning of the code

# -*- coding: utf-8 -*-
from __future__ import unicode_literals

import logging
from datetime import timedelta
from django.db import models
from crispy_forms.layout import Div

from crispy_forms.helper import FormHelper
from crispy_forms.layout import Submit, Layout, Fieldset, ButtonHolder, HTML
from django import forms
from django.conf import settings
from django.urls import reverse
from django.db.models import Q
from django.utils import timezone

from .models import Message, strip_email

logger = logging.getLogger(__name__)


def validate_email(email):
    timeframe = timezone.now() - timedelta(hours=24)
    stripped_email = strip_email(email)
    recent_message_count = Message.objects.filter(Q(sender_email_stripped=stripped_email) | Q(recipient_email_stripped=stripped_email), created__gte=timeframe).count()
    if recent_message_count > settings.MAX_MESSAGES:
        raise forms.ValidationError("We can't send emails to this address at this time. You can try again in 24 hours.")


class MessageSendForm(forms.ModelForm):
    # hp = forms.CharField(label="do not fill", required=False)
    fasid = forms.CharField(label="FAS Username", required=False)

    class Meta:
        model = Message
        fields = ['recipient_name', 'recipient_email', 'message',
                  'sender_named', 'sender_approved_public', 'sender_approved_public_named']

    def __init__(self, *args, **kwargs):
        self.user = kwargs.pop('user')
        super(MessageSendForm, self).__init__(*args, **kwargs)
        self.helper = FormHelper()
        self.helper.form_class = 'form-horizontal'
        self.helper.label_class = 'col-md-3'
        self.helper.field_class = 'col-md-8'

        self.fields['recipient_name'].label = 'Name'
        self.fields['recipient_email'].label = 'Email'
        self.fields['recipient_email'].validators = [validate_email]
        self.fields['message'].help_text = 'Writer\'s block? Check out our <a href="%s">message inspiration</a>.' % reverse('messaging:inspiration')
        self.fields['sender_named'].label = 'I agree to share my name and email address with the recipient.'
        self.fields['sender_approved_public'].label = "I agree to publish this message and display it publicly in the Happiness Archive."
        self.fields['sender_approved_public_named'].label = "... and I agree to display our names publicly too."
        self.fields['sender_approved_public_named'].help_text = "Note: We only publish information if both the sender and the recipients agree."

        self.helper.layout = Layout(
            # Fieldset('This Happiness Packet is from...', 'sender_name', 'sender_email', 'hp'),
            Fieldset("Search for a FAS Username", 'fasid' ),
            #ButtonHolder(
            #      Submit('submit', 'Submit', css_class='button white')
          
            #),

I AM TRYING TO INSERT HTML CODE WITH BOOTSTRAP IN MY CRISPY FORM BUT AM GETTING AN ERROR AND THIS IS THE SOURCE OF THE ERROR , can anyone help me where am going wrong because am trying to add a search button in an input field .
            HTML("<div class="input-group mb-3">"
                  " <input type="text" class="form-control" placeholder="1000" aria-label="Amount (rounded to the nearest dollar)" aria-describedby="basic-addon">"
                   "<div class="input-group-append">"
                   "<span class="input-group-text" id="basic-addon">.00</span>"
                   "</div>"
                   "</div>"),
THIS IS THE END OF HTML CODE I HAVE ADDED.
            Fieldset("Send this Happiness Packet to...", 'recipient_name', 'recipient_email'),
            Fieldset("Your message is...", 'message'),
            Fieldset("Privacy and permissions", 'sender_named', 'sender_approved_public', 'sender_approved_public_named'),
            HTML("<br>"),
            Submit('submit', 'Send some happiness', css_class='btn-lg centered'),
        )

    def clean(self):
        super(MessageSendForm, self).clean()
        # if self.cleaned_data.get('hp'):
        #     raise forms.ValidationError('')
        if self.cleaned_data.get('sender_approved_public_named') and not self.cleaned_data.get('sender_approved_public'):
            self.add_error('sender_approved_public_named', "If you want us to publish the message including your names, "
                                                           "you must also check 'I agree to publish this message and"
                                                           "display it publicly in the Happiness Archive'")
        validate_email(self.user.email)

class MessageRecipientForm(forms.ModelForm):
    class Meta:
        model = Message
        fields = ['recipient_approved_public', 'recipient_approved_public_named']

    def __init__(self, *args, **kwargs):
        super(MessageRecipientForm, self).__init__(*args, **kwargs)
        self.helper = FormHelper()
        self.helper.form_class = 'form-horizontal'
        self.helper.label_class = 'col-md-3'
        self.helper.field_class = 'col-md-8'

        self.fields['recipient_approved_public'].label = "I agree to publish this message and display it publicly in the Happiness Archive."
        self.fields['recipient_approved_public_named'].label = "... and I agree to display our names publicly too."
        self.fields['recipient_approved_public_named'].help_text = "Note: We only publish information if both the sender and the recipients agree."

        self.helper.layout = Layout(
            Fieldset("Privacy and permissions", 'recipient_approved_public', 'recipient_approved_public_named'),
            HTML("<br>"),
            Submit('submit', 'Save privacy choices', css_class='btn-lg centered'),
        )

    def clean(self):
        super(MessageRecipientForm, self).clean()
        if self.cleaned_data.get('recipient_approved_public_named') and not self.cleaned_data.get('recipient_approved_public'):
            self.add_error('recipient_approved_public_named', "If you want us to publish the message including your "
                                                              "names, you must also check 'I agree to publish this "
                                                              "message and display it publicly in the Happiness "
                                                              "Archive.'")


##### end of the code.
the error i have got after running my docker-compose up is ;
boots.png
Reply all
Reply to author
Forward
0 new messages