提交带有禁用输入的表单

提交带有禁用输入的表单

问题描述:

I'm wondering if I can get some assistance. I have a form that I want to submit data to a database. However, I am getting an issue doing so with the following code. The select inputs are set to disabled so if nothing is selected then the form doesn't submit those fields (fields by default are still submitted blank.

<div class="form-group">
        <label for="title">
                Title
                    <span class="asteriskField">
                          *
                     </span>
        </label>
        <select id="inputtitle" name="title" class="form-control" onchange="updateReview('title');" tabindex=1 />
                    <option value="" selected disabled>Please select</option>
                    <option value="Master">Master</option>
                    <option value="Mr">Mr</option>
                    <option value="Mrs">Mrs</option>
                    <option value="Miss">Miss</option>
                    <option value="Ms">Ms</option>
                    <option value="Rev.">Rev.</option>
        </select>
</div>

Thank you.

我想知道我是否能得到一些帮助。 我有一个表单,我想将数据提交到数据库。 但是,我在使用以下代码时遇到了问题。 选择输入设置为禁用,因此如果未选择任何内容,则表单不会提交这些字段(默认情况下字段仍为空白。 p>

 &lt; div class =“  form-group“&gt; 
&lt; label for =”title“&gt; 
 Title 
&lt; span class =”asteriskField“&gt; 
 * 
&lt; / span&gt; 
&lt; / label&gt;  
&lt; select id =“inputtitle”name =“title”class =“form-control”onchange =“updateReview('title');”tabindex = 1 /&gt; 
&lt; option value =“”选择禁用&gt  ;请选择&lt; / option&gt; 
&lt; option value =“Master”&gt; Master&lt; / option&gt; 
&lt; option value =“Mr”&gt; Mr&lt; / option&gt; 
&lt; option value =“Mrs  “&gt; Mrs&lt; / option&gt; 
&lt; option value =”Miss“&gt; Miss&lt; / option&gt; 
&lt; option value =”Ms“&gt; Ms&lt; / option&gt; 
&lt; option value =”  REV“&GT;再 v。&lt; / option&gt; 
&lt; / select&gt; 
&lt; / div&gt; 
  code>  pre> 
 
 

谢谢。 p> div>

Using disabled on option in selectbox isn't good solution, because it does not force user to select option. If he does not click on selectbox, blank value will be posted.

To force user to select option use required on selectbox, and also leave default option disabled, so he will have to choose one option.

use Form OnSubmit event and create formdata manually in javascript with the fields you want to send to server based on conditions.

This is simply the way forms work in HTML. When you submit a form, all the input fields are retrieved and sent to the designated action. However, selectboxes that were not selected are not part of the post.

If you want to send a list of all select boxes (including the ones that are unselected), a common trick is to create a hidden input with the same value for each selectbox. This way you get a list of all the selected fields, as well as the entire list of selectable fields.

It's a wrong behavior, you should validate if nothing it's selected with javascript or some backend code before any query into DB. Don't use disabled in fields that you want, in some way, retrieve some kind of data, because you're changing the intrinsic behavior of the element, confusing the next guy that will work with your code.

If nothing is selected you can return false into your backend with some error message or just disable the visualization of submit button with javascript.

EDIT: The solution from @Autista_z is good about

To force user to select option use required on selectbox, and also leave default option disabled, so he will have to choose one option.

I just want to empathize: don't let the backend without that validation too, double validation (front/back) is a must.