Aula 33 – Loja Online – Django – Search view

toticavalcanti

Aula 33 – Loja Online – Django – Search view

Search view

Voltar para página principal do blog

Todas as aulas desse curso

Aula 32 Aula 34

Se gostarem do conteúdo dêem um joinha 👍 na página do Código Fluente no
Facebook

Esse é o link do código fluente no Pinterest

Meus links de afiliados:

Hostinger

Digital Ocean

One.com

Melhore seu NETWORKING

Participe de comunidades de desenvolvedores:

Fiquem a vontade para me adicionar ao linkedin.

E também para me seguir no GITHUB.

Ah, se puder, clica na estrela nos meus repositórios pra dá uma força ao meu perfil no GITHUB

Código final da aula:

https://github.com/toticavalcanti/django_ecommerce/tree/search_view

Componente Search

A primeira coisa que precisamos fazer é criar uma view que vai lidar com a busca, isto é, com a search.

Há uma grande chance que nosso componente search, ou seja, nossa search function, precise ser mais robusta.

Você pode querer pesquisar coisas que vão além da pesquisa de seus produtos.

Mão na massa! 🚀

Então agora nós iremos criar o nosso component search.

Dentro da pasta do projeto, no diretório onde tá o manage.py, digite o seguinte comando:

python manage.py startapp search

Veja que o django criou automaticamente, uma pasta search com um monte de coisas dentro.

É a pasta do nosso componente search, assim como componente product tem a sua.

Agora em settings.py, vamos declarar nosso componente search.

src/e_commerce/settings.py

"""
Django settings for e_commerce project.

Generated by 'django-admin startproject' using Django 2.1.4.

For more information on this file, see
https://docs.djangoproject.com/en/2.1/topics/settings/

For the full list of settings and their values, see
https://docs.djangoproject.com/en/2.1/ref/settings/
"""

import os

# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))


# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/2.1/howto/deployment/checklist/

# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = 'xjmv-0^l__duq4-xp54m94bsf02lx4&1xka_ykd_(7(5#9^1o^'

# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True

ALLOWED_HOSTS = []


# Application definition

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',

    #our apps
    'products',
    'search',
]

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

ROOT_URLCONF = 'e_commerce.urls'

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'templates')],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

WSGI_APPLICATION = 'e_commerce.wsgi.application'


# Database
# https://docs.djangoproject.com/en/2.1/ref/settings/#databases

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.sqlite3',
        'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
    }
}


# Password validation
# https://docs.djangoproject.com/en/2.1/ref/settings/#auth-password-validators

AUTH_PASSWORD_VALIDATORS = [
    {
        'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
    },
]


# Internationalization
# https://docs.djangoproject.com/en/2.1/topics/i18n/

LANGUAGE_CODE = 'en-us'

TIME_ZONE = 'UTC'

USE_I18N = True

USE_L10N = True

USE_TZ = True


# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/2.1/howto/static-files/

STATIC_URL = '/static/'

STATICFILES_DIRS = [
     os.path.join(BASE_DIR, "static_local")
]

STATIC_ROOT = os.path.join(os.path.dirname(BASE_DIR), "static_cdn", "static_root")

MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(os.path.dirname(BASE_DIR), "static_cdn", "media_root")

Vamos colocar o caminho do nosso recurso search lá no src/e_commerce/urls.py

src/e_commerce/urls.py

from django.conf import settings
from django.conf.urls.static import static

from django.contrib import admin
from django.urls import path, include
from django.views.generic import TemplateView

from .views import (home_page, 
                    about_page, 
                    contact_page, 
                    login_page, 
                    logout_page,
                    register_page
)

urlpatterns = [
    path('', home_page, name='home'),
    path('about/', about_page, name='about'),
    path('contact/', contact_page, name='contact'),
    path('login/', login_page, name='login'),
    path('logout/', logout_page, name='logout'),
    path('register/', register_page, name='register'),
    path('bootstrap/', TemplateView.as_view(template_name='bootstrap/example.html')),
    path('products/', include("products.urls", namespace="products")),
    path('search/', include("search.urls", namespace="search")),
    path('admin/', admin.site.urls),
]

if settings.DEBUG:
    urlpatterns = urlpatterns + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
    urlpatterns = urlpatterns + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

E vamos criar um arquivo chamado urls.py dentro da pasta do nosso componente novo, o search.

Então crie o src/search/urls.py e coloque o conteúdo abaixo.

src/search/urls.py

from django.urls import path

app_name = "search"

from products.views import (
                        ProductListView, 
                    )
urlpatterns = [
    path('', ProductListView.as_view(), name='list'),
]

Abra agora o view.py dentro da pasta search e coloque o conteúdo abaixo.

src/search/view.py


from django.shortcuts import render
from django.views.generic import ListView
from products.models import Product

class SearchProductView(ListView):
    template_name = "products/list.html"
    def get_queryset(self, *args, **kargs):
        request = self.request
        return Product.objects.all()

Veja o resultado:

http://127.0.0.1:8000/search

Agora modifique o src/search/url.py

src/search/urls.py

from django.urls import path

app_name = "search"

from .views import (
                        SearchProductView, 
                    )

urlpatterns = [
    path('', SearchProductView.as_view(), name='list'),
]

Veja o resultado:

http://127.0.0.1:8000/search

Veja que o resultado foi a lista de produtos.

Faça um pequeno teste usando filter, como na minha base eu tenho Camiseta branca e Camiseta preta, vou fazer o teste com esses produtos.

No mesmo arquivo, o view.py dentro da pasta search e coloque o conteúdo abaixo.

src/search/view.py

from django.shortcuts import render
from django.views.generic import ListView
from products.models import Product

class SearchProductView(ListView):
    template_name = "products/list.html"
    def get_queryset(self, *args, **kargs):
        request = self.request
        return Product.objects.filter(title__icontains = 'Camiseta')

Veja o resultado:

http://127.0.0.1:8000/search

Faça o testes trocando Camiseta com o C maiúsculo, por camiseta, com o c minúsculo.

Perceba que continua funcionando.

Para o icontains, tanto faz maiúsculo ou minúsculo.

Equivale em SQL a:

SELECT * FROM products WHERE title ILIKE ‘%Camiseta%’;

Vamos testar agora usando o iexact.

Ele também é case-insensitive, ou seja, pra ele tanto faz maiúsculo ou minúsculo.

src/search/view.py

from django.shortcuts import render
from django.views.generic import ListView
from products.models import Product

class SearchProductView(ListView):
    template_name = "products/list.html"
    def get_queryset(self, *args, **kargs):
        request = self.request
        return Product.objects.filter(title__iexact = 'Camiseta')

Veja o resultado:

http://127.0.0.1:8000/search

Equivale em SQL a:

SELECT * FROM products WHERE title ILIKE ‘Camiseta’;

Vamos pegar a query digitada pelo usuário.

E colocar o valor default para query como Camiseta.

Faça as modificações abaixo.

src/search/view.py

from django.shortcuts import render
from django.views.generic import ListView
from products.models import Product

class SearchProductView(ListView):
    template_name = "products/list.html"
    def get_queryset(self, *args, **kargs):
        request = self.request
        print('Solicitação', request)
        result = request.GET
        print('Resultado: ', result)
        query = result.get('q', 'Tênis') # result['q']
        print('Consulta', query)
        if query is not None:
            return Product.objects.filter(title__icontains = query)
        return Product.objects.none()

Veja o resultado:

http://127.0.0.1:8000/search

Vamos trocar o valor padrão de Camiseta, como fizemos acima, pelo campo featured (destaque) que é um campo boleano em nossos produtos.

Então, quando não for passada nenhuma consulta, o search vai mostrar os produtos em destaque.

Vamos ao código!

src/search/view.py

from django.shortcuts import render
from django.views.generic import ListView
from products.models import Product

class SearchProductView(ListView):
    template_name = "products/list.html"
    def get_queryset(self, *args, **kargs):
        request = self.request
        print('Solicitação', request)
        result = request.GET
        print('Resultado:', result)
        query = result.get('q', None) # result['q']
        print('Consulta', query)
        if query is not None:
            return Product.objects.filter(title__iexact = query)
        return Product.objects.featured()

Veja o resultado:

http://127.0.0.1:8000/search

Código final da aula:

https://github.com/toticavalcanti/django_ecommerce/tree/search_view

Se gostarem do conteúdo dêem um joinha 👍 na página do Código Fluente no
Facebook

Link do código fluente no Pinterest

Obrigado, até a próxima e bons estudos. 😉

Category: Django, Loja virtual - Ecommerce, Programação Web

Aula 33 – Loja Online – Django – Search view

Aula 33 – Loja Online – Django – Search view

Se gostarem do conteúdo dêem um joinha 👍 na página do Código Fluente no Facebook

Esse é o link do código fluente no Pinterest

Meus links de afiliados:

Melhore seu NETWORKING

Participe de comunidades de desenvolvedores:

Fiquem a vontade para me adicionar ao linkedin.

E também para me seguir no GITHUB.

Ah, se puder, clica na estrela nos meus repositórios pra dá uma força ao meu perfil no GITHUB

Código final da aula:

Componente Search

Mão na massa! 🚀

Veja que o django criou automaticamente, uma pasta search com um monte de coisas dentro.

Agora em settings.py, vamos declarar nosso componente search.

src/e_commerce/settings.py

Vamos colocar o caminho do nosso recurso search lá no src/e_commerce/urls.py

src/e_commerce/urls.py

src/search/urls.py

src/search/view.py

Veja o resultado:

Agora modifique o src/search/url.py

src/search/urls.py

Veja o resultado:

src/search/view.py

Veja o resultado:

Equivale em SQL a:

src/search/view.py

Veja o resultado:

Equivale em SQL a:

src/search/view.py

Veja o resultado:

Vamos ao código!

src/search/view.py

Veja o resultado:

É isso pessoal, nos vemos na próxima!

Código final da aula:

Se gostarem do conteúdo dêem um joinha 👍 na página do Código Fluente no Facebook

Link do código fluente no Pinterest

Novamente deixo meus link de afiliados:

Obrigado, até a próxima e bons estudos. 😉

About The Author

Aula 09 – Golang para Web – Tratamento de erros

Aula 01 – React – Introdução

Related Videos

Se gostarem do conteúdo dêem um joinha 👍 na página do Código Fluente no
Facebook

Se gostarem do conteúdo dêem um joinha 👍 na página do Código Fluente no
Facebook