概要
Djangoで、銀行からの借入金を管理するアプリを作っており、オートコンプリート機能について質問です。
新しい借り入れを登録するときに、Bankというテーブルから銀行を選択できるようにしたいです。
Bankには、三菱東京銀行、三井住友銀行、みずほ銀行、りそな銀行、埼玉りそな銀行など、全国の金融機関名が登録済みです。
例えば、「りそな」と入力した時点で、「りそな銀行」「埼玉りそな銀行」が候補として選択可能になるようなイメージです。
現在のコード
python
1(models.py) 2 3class Bank(models.Model): 4 name = models.CharField("金融機関名", max_length=31) 5 code = models.CharField('金融機関コード(4桁)', max_length=4) 6 7 8class Debt(models.Model): 9 bank = models.ForeignKey(Bank, on_delete=models.PROTECT) 10 date_issue = models.DateField("実行日", default=datetime.now) 11 principal = models.PositiveIntegerField("元本(円)", help_text="単位は日本円")
python
1(views.py) 2 3class DebtCreateView(CreateView): 4 model = Debt 5 form_class = DebtForm 6 success_url = reverse_lazy('myapp:debt_list') 7 8 def post(self, request): 9 form = DebtForm(request.POST) 10 if form.is_valid(): 11 debt = form.save(commit=False) 12 debt.company = request.user.profile.company 13 messages.success(request, '新しい借入を登録しました。') 14 debt.save() 15 form.save_m2m() 16 return redirect('myapp:debt_list') 17 else: 18 messages.error(request, 'エラーがあります。') 19 return redirect('myapp:debt_create') 20 21 return render(request, 'myapp/debt_list.html', {'form': form})
python
1(forms.py) 2 3class DebtForm(forms.ModelForm): 4 class Meta: 5 model = Debt 6 fields = ('bank', 'date_issue', 'principal') 7 8 def __init__(self, *args, **kwargs): 9 super().__init__(*args, **kwargs) 10 for field in self.fields.values(): 11 field.widget.attrs['class'] = 'form-control'
html
1(debt_form.html) 2form部分のみ抜粋 3 4<form action="" method="POST"> 5 {{ form.non_field_errors }} 6 <div class="form-row"> 7 <div class="form-group col-md-4"> 8 <label>金融機関名</label> 9 {{ form.bank }}{{ form.bank.errors }} 10 </div> 11 <div class="form-group col-md-3"> 12 <label>融資実行日</label> 13 {{ form.date_issue }} 14 </div> 15 <div class="form-group col-md-2"> 16 <label>元本</label> 17 {{ form.principal }} 18 </div> 19 </div> 20 {% csrf_token %} 21 <button type="submit" class="btn btn-primary" >保存</button> 22</form>
試したこと
jQueryを使うとうまくいくと思い、次のようにやってみました。
html
1<label for="tags">金融機関名</label> 2<input type="text" id="tags" name="bank"> 3 4 5<script> 6$( function() { 7 var availableTags = [ 8 "三菱東京銀行", // 実際には銀行のリストをセットする 9 "三井住友銀行", 10 "みずほ銀行", 11 "りそな銀行", 12 "埼玉りそな銀行", 13 "その他" 14 ]; 15 $( "#tags" ).autocomplete({ 16 source: availableTags 17 }); 18} ); 19</script>
これだと値は引っ張れるものの、{{ form.bank }}
の値としてセットされず、データベースへの登録が出来ませんでした。
ご教授の程、よろしくお願いいたします。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/07/04 23:36 編集
2019/07/05 01:40