viewから受け取った辞書を、HTML内でそのまま使いたい

Djangoのテンプレート関数を使って、viewから受けた値をHTMLで使っていますが、辞書の扱い方で困っています。

具体的には、受け取った辞書をHTML内のJSでそのまま辞書型の変数として扱いたいのですが、文字化けが起こりうまくいきません。

実際のコードは下記のようなものです。

python
1class Home(View):
2    def get(self, request, *args, **kwargs):
3        context = {}
4        context[“jisho”] = {
5            “one”: “いち”,
6            “two”: “に”,
7        }
8        return render(request, home.html, context)

html
1<script>
2    $(function () {
3        const jisho = {{ jisho }} // ここへ期待通りの辞書が入らない
4    })
5    $(“#sentaku”).change(function () {
6        alert(jisho[$(this).val()])
7    })
8</script>
9<select id=“sentaku”>
10    <option value=“one”>ichi</option>
11    <option value=“two”>ni</option>
12</select>

一度、

html
1let jisho = {}
2jisho[“one”] = {{ jisho.one }}
3jisho[“two”] = {{ jisho.two }}

のように分解して作り直すしか方法は無さそうでしょうか。

どうぞよろしくお願い致します。

m.ts10806

2020/12/28 21:37

djangoのことはよく分かりませんが「文字化け」がどういう出力なのか提示されたほうが良いように思います。オブジェクト（JSON含め）使っている場合、実際は文字化けではないということもあり得ますので。

行動規範の内容に同意します

回答1件

提示されたHTMLはそれで全てでしょうか？
html、head、meta、bodyタグなどはきちんと記載はありますでしょうか？
あと、テキストのエンコーディングはutf-8？
ブラウザによっては文字化けします。たしかFirefoxだったかな？

あと、DjangoからHTMLのView（JS）に値を引き渡したい場合、通常、JSONに変換してください。
Django(python)が出力する"文字列"をJavaScriptで認識するためには何かしらの変換が必要です（言語がそもそも違うので）
言語問わずやり取りしたいのであればxml、jsonなどがありますが、jsonのほうが軽量でやり取りしやすいのでオススメです。

JSONへの変換の仕方に関しては以下のを参考にしてみてください。
https://qiita.com/Morio/items/7538a939cc441367070d

投稿2020/12/29 00:48