英文:
Why is the my form not submitting all the fields i filled and how do i fix it?
问题
在我的房地产Django Web应用程序中,我有一个表单,用户可以填写以列出其属性或获取服务。要填写的表单取决于所涉及属性的类型(单个或多个公寓属性),因此我使用Tailwindcss根据用户的选择来显示这些表单。
这个问题是,当我提交表单时,只有property_type
被提交到后端,而在任何表单上填写的内容都没有被提交。
如何修复这个问题?
英文:
On my real estate Django web app, I have a form which users fill to list their property or get services. The form to be filled differs depending on the type of property in question(Single or Multiple apartment properties) so I used Tailwindcss to display these forms depending on the user's choice
<form class="border-3 border-red-400 p-11 block space-y-4 justify-center w-screen h-screen items-center" action="{% url 'requestservice:req_service' %}" method="POST">
<input type="radio" id="single" value="SINGLE" class="peer/single" name="property_type" checked />
<label for="single" class="peer-checked/single:text-sky-500">Single Unit</label>
<input type="radio" id="multiple" value="MULTIPLE" class="peer/multiple" name="property_type" />
<label for="draft" class="peer-checked/multiple:text-sky-500">Multiple D. Unit</label>
<div class="hidden peer-checked/multiple:block bg-white px-2 py-1 w-full space-y-2 md:space-y-3 rounded-xl">
<!--
<h3> M.D.U Unit Form </h3>
-->
<div class="block">
<p class="font-medium text-gray-950 text-sm"> Name of property: </p>
<input type='text' class="w-full p-1 focus:border-1 focus:outline-yellow-300 border border-red-100 shadow-md shadow-red-100 rounded-lg " placeholder="Property name">
</div>
<div class="font-medium flex space-x-5">
<p class="font-medium text-sm"> Central Server Room Avaliable: </p>
<input type="radio">
</div>
<div class="block ">
<p class="font-medium text-sm"> Number of houses in MDU </p>
<input placeholder="Number of houses" class="w-full p-1 focus:border-1 focus:outline-yellow-300 border border-red-100 shadow-md shadow-red-100 rounded-lg" type="number">
</div>
</div>
<div class="hidden peer-checked/single:block bg-white px-2 py-1 space-y-2 w-full rounded-xl">
<!--
<h3> Single Unit Form </h3>
-->
<div class="block space-y-1">
<p class="font-medium"> Name of property: </p>
<input type='text' class="w-full p-1 focus:border-1 focus:outline-yellow-300 border border-red-100 shadow-md shadow-red-100 rounded-lg " placeholder="Property name">
</div>
</div>
<div class="flex justify-center">
<input type="submit" class="bg-red-500 font-medium p-1 text-white text-center rounded-lg" value="Request Service">
</div>
<!-- <div class="flex justify-between border border-red-500 ">
<div>
<input type="radio" id="single" name="property_type" value="SINGLE" class="peer/single" checked />
<label for="single" class="peer-checked/single:text-sky-500">Single Unit</label>
</div>
<div>
<input type="radio" id="multiple" name="property_type" value="MULTIPLE" class="peer/multiple"/>
<label for="multiple" class="peer-checked/multiple:text-sky-500">Multiple D. Unit</label>
</div>
</div>
<div class="peer-checked/single:border p-3 border-red-500 rounded-lg">
<label> Single Property Location </label>
<input class="p-2" name="your_location" type="text" placeholder="Type in a name">
</div>
<div class="hidden peer-checked/multiple:blockp-3 border border-red-500 rounded-lg">
<label> Multiple Property Name </label>
<input class="p-2" name="property_name" type="text" placeholder="Property Name">
</div>
<input class="p-2 bg-sky-600 rounded-md hover:bg-sky-800" type="submit" value="Submit Form"> -->
</form>
This works(kinda) but the problem is, when i submit the form, only the property_type
is submitted to the backend and what ever is filled in on either of the forms isn't.
How do i fix this.
答案1
得分: 2
因为只有 property_type
被提交到后端,这是唯一具有 name
属性的表单元素。表单值以键/值对形式提交,其中键是元素的 name
,值是元素的 value
。如果没有 name
,就没有东西可以包含 value
。
请为您的输入字段添加名称。例如:
<input type="text" name="property_name" class="w-full p-1 focus:border-1 focus:outline-yellow-300 border border-red-100 shadow-md shadow-red-100 rounded-lg" placeholder="Property name">
(注意:被注释掉的标记已经具有 name
属性,您可能只是忘记在更新的标记中包含它们。)
英文:
> only the property_type
is submitted to the backend
Because that's the only form element with a name
attribute. Form values are submitted as key/value pairs where the key is the element's name
and the value is the element's value
. Without a name
, there's nothing to include a value
.
Give your inputs names. For example:
<input type="text" name="property_name" class="w-full p-1 focus:border-1 focus:outline-yellow-300 border border-red-100 shadow-md shadow-red-100 rounded-lg " placeholder="Property name">
(Note: The commented out markup has name
attributes already, you may have just forgot to include them in the updated markup.)
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论