【Leaflet.js】オリジナルのアイコン画像を使用して、地図上に表示させる【飲食店のマッピングであれば食べ物の画像を使って視認性UP】
- 作成日時:
- 最終更新日時:
- Categories: サーバーサイド
- Tags: JavaScript leaflet.js マッピング Django
django
【Django】ユーザーモデルと1対多のリレーションを組む方法【カスタムユーザーモデル不使用】
認証にはallauthを使用する。 コードは40分Djangoの簡易掲示板を元に作成する。forms.pyを実装させている。 Userモデルと1対多のリレーションを組み、誰が投稿したのかわかるようにする。 models.py from django.db import models from django.contrib.auth.models import User class Topic(models.Model): comment = models.CharField(verbose_name="コメント",max_length=2000) user = models.ForeignKey(User, verbose_name="投稿 ...【Django】簡易掲示板に折りたたみ式サイドバーを実装させる【extends】
【Python】requestsライブラリを使用して、DjangoにPOSTメソッドのHTTPリクエストを送信する(管理サイトへのログイン)【セッションを維持してCSRF問題の対策】
【Django】Ajaxを使ってOSMとLeaflet.jsでマーカーを配置させる
Djangoで1対多のリレーションを構築する【カテゴリ指定、コメントの返信などに】【ForeignKey】
DjangoでOpenStreetMap(OSM)とleaflet.jsを使ってマッピングアプリを作る
DjangoのMessageFrameworkで投稿とエラーをフロント側に表示する
MessageFrameworkを使ってHelloWorldを表示させる。 元になるコードは40分Djangoにforms.pyを追加した状態から流用している。 まず、views.pyにて、公式からコードを拝借して追加した。 from django.shortcuts import render,redirect from django.views import View from .models import Topic from .forms import TopicForm #↓追加 from django.contrib import messages class IndexView(View): def get(self, request, *args, **kwargs): #↓追加 messages.add_message(request, messages.INFO, 'Hello world.') topics = Topic.objects.all() context = { "topics":topics } return render(request,"bbs/index.html",context) def post(self, request, *args, **kwargs): form = TopicForm(request.POST) if form.is_valid(): form.save() return redirect("bbs:index") index = IndexView.as_view() HTML側でメッセージを表示させるにはこうする。 <!DOCTYPE ...DjangoでAjax(jQuery)を実装、送信と同時に投稿内容を確認する
【Django】formタグを使ってHTTPリクエストのGETメソッド、POSTメソッドを送信する
前提 DjangoでHelloWorld【HttpResponse及びレンダリング】ができた状態を前提として話を進める。 HTTPリクエストのGETメソッドの送信方法 用途は主に、検索がある。 まずindex.html <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"> </head> <body> <main class="container"> <form action="" method="GET"> <input type="text" name="search" value="{{ request.GET.search }}" placeholder="キーワード"> <input type="submit" value="検索"> </form> </main> </body> </html> form ...