首页 > 解决方案 > Django:在一个页面上提交两个表单并在第二个表单中使用来自第一个表单的数据

问题描述

所以目前我有一个网页,用户可以在其中选择他们想要的统计数据,然后生成一个疯狂行军括号。如果他们决定喜欢括号,他们可以命名并保存它。我想保存括号以及选择的统计数据。我的问题是我在一个页面上有两个表单,所以当用户按下保存按钮时,统计变量都是空的,因为它们的值是在另一个表单的请求中分配的。基本上第二种形式会清除第一种形式的所有数据,但我想在第二种形式中使用第一种形式的数据。这是我的代码。

HTML:

<form method="GET">
    {% csrf_token %}


<label for="stat1">Most Important Stat:</label>
<select name="stat1" id="stat1">
  <option value="Stat 1">Stat 1</option>
  <option value="Stat 2">Stat 2</option>
  <option value="Stat 3">Stat 3</option>
  <option value="Stat 4">Stat 4</option>
  <option value="Stat 5">stat 5</option>
</select>

<label for="stat2">Second Most Important Stat:</label>
<select name="stat2" id="stat2">
   <option value="Stat 1">Stat 1</option>
   <option value="Stat 2">Stat 2</option>
   <option value="Stat 3">Stat 3</option>
   <option value="Stat 4">Stat 4</option>
   <option value="Stat 5">stat 5</option>
</select>

<label for="stat3">Third Most Important Stat:</label>
<select name="stat3" id="stat3">
   <option value="Stat 1">Stat 1</option>
   <option value="Stat 2">Stat 2</option>
   <option value="Stat 3">Stat 3</option>
   <option value="Stat 4">Stat 4</option>
   <option value="Stat 5">stat 5</option>
</select>

 <label for="stat4">Fourth Most Important Stat:</label>
 <select name="stat4" id="stat4">
   <option value="Stat 1">Stat 1</option>
   <option value="Stat 2">Stat 2</option>
   <option value="Stat 3">Stat 3</option>
   <option value="Stat 4">Stat 4</option>
   <option value="Stat 5">stat 5</option>
 </select>

 <label for="stat5">Fifth Most Important Stat:</label>
 <select name="stat5" id="stat5">
    <option value="Stat 1">Stat 1</option>
    <option value="Stat 2">Stat 2</option>
    <option value="Stat 3">Stat 3</option>
    <option value="Stat 4">Stat 4</option>
    <option value="Stat 5">stat 5</option>
 </select>

 <button onclick="createBracket(request)" >Submit</button>
 </form>

 <form method="post">
  {% csrf_token %}
  <div class="txt_field">
    <input id="name" type="text" name="name" required>
    <label>Bracket Name</label>
  </div>

  <input type="Submit" value="Save Bracket">
 </form>

视图.py:

def createBracket(request, user_id):
   user = get_object_or_404(User, pk=user_id)


   # choosing the stats
   if request.method == 'GET' and 'stat1' in request.GET:
      stat1 = request.GET.get('stat1')
      stat2 = request.GET.get('stat2')
      stat3 = request.GET.get('stat3')
      stat4 = request.GET.get('stat4')
      stat5 = request.GET.get('stat5')

      ordered_stats = [stat1, stat2, stat3, stat4, stat5]
      # call some function and pass in stats

      # function returns a list of teams which is my "bracket"
      bracket = ["Virginia-Tech", "Colgate", "Arkansas", "Florida", "Drexel", "Illinois", "Utah St", "Texas Tech"]
      context = {'user': user, 'user_id': user_id, 'bracket': bracket}
   else:
      context = {'user': user, 'user_id': user_id, 'bracket': bracket}

   print(stat1)
   # naming and saving the bracket
   if request.method == 'POST' and 'name' in request.POST:
       save_form = SaveForm(request.POST)
       print("saved the form")
       if save_form.is_valid():
  
           database = Bracket.objects.create(
               bracket_name=save_form.cleaned_data['name'],
               user=user,
               bracket=bracket,
               stat1=stat1, # this won't work bc stat1 isn't assigned
               stat2=stat2,
               stat3=stat3,
               stat4=stat4,
               stat5=stat5,
           )
           database.save()
           context = {'user': user, 'user_id': user_id, 'bracket': bracket,
                       'save_form': save_form}

    else:
       save_form = SaveForm()
       context = {'user': user, 'user_id': user_id, 'bracket': bracket, 'save_form': save_form}

    return render(request, 'project/createBracket.html', context)

标签: pythonhtmldjangoformspython-requests-html

解决方案


因此,当 createBracket 在没有任何内容的情况下被调用时,您将显示一个完全空的表单。用户填写她的统计信息,按下顶部表单上的提交,再次返回相同的页面,显示她刚刚输入的统计信息以及您的括号。她选择括号,并为其命名,然后提交底部表格?为什么您需要提交的第一个表单来向她显示她刚刚输入的确切值?你能不能只显示一个填充了括号的空表单并在一个表单中完成整个事情?我的意思是我想你可以使用 JavaScript 来防止底部表单的默认值,并在发布之前获取你的顶部表单值,这将解决你的问题,但我不太理解需要两次提交。您没有对第一次提交的数据做任何事情。

编辑:实际上在 GET 提交时,您对统计数据做了什么?您没有将它们放回上下文中,也没有将它们用作初始表单字段值,所以它们只是丢失了?


推荐阅读