选择所需的属性[重复]

Question

如何使选择表单成为必需？我尝试输入“必需”，但它不起作用。

<div class="form-group">
    <label for="sel2">How many years have you been trading *</label>
    <select  class="form-control" id="sel2" required>
        <option>Please select one</option>
        <option>Start Up</option>
        <option value="1-2">1-3</option>
        <option value="3-4">3-4</option>
        <option value="5more">5 or more</option>
     </select>
</div>

还有这个，我刚从一个网站上得到这个，我下载了 zip 文件，但我需要添加一个必需的属性

<div class="form-group">
    <label>Country *</label><br>
    <div id="basic" data-input-name="country" required></div>
</div>


 <script>
$('#basic').flagStrap();

$('#origin').flagStrap({
    placeholder: {
        value: "",
        text: "Country of origin"
    }
});

$('#options').flagStrap({
    countries: {
        "AU": "Australia",
        "GB": "United Kingdom",
        "US": "United States"
    },
    buttonSize: "btn-sm",
    buttonType: "btn-info",
    labelMargin: "10px",
    scrollable: false,
    scrollableHeight: "350px"
});

$('#advanced').flagStrap({
    buttonSize: "btn-lg",
    buttonType: "btn-primary",
    labelMargin: "20px",
    scrollable: false,
    scrollableHeight: "350px",
    onSelect: function (value, element) {
        alert(value);
        console.log(element);
    }
});
</script>

Answer 1

这里没有要求，因为您没有在所有选项中设置值。在前两个选项中设置值：

<link href="view/css/flags.css" rel="stylesheet">

<select  class="form-control" id="sel2" required>
       <option value="">Please select one</option>
       <option  value="startup">Start Up</option>
       <option value="1-2">1-3</option>
       <option value="3-4">3-4</option>
       <option value="5more">5 or more</option>
 </select>

<script>
$('#basic').flagStrap();

$('#origin').flagStrap({
    placeholder: {
        value: "",
        text: "Country of origin"
    }
});

$('#options').flagStrap({
    countries: {
        "AU": "Australia",
        "GB": "United Kingdom",
        "US": "United States"
    },
    buttonSize: "btn-sm",
    buttonType: "btn-info",
    labelMargin: "10px",
    scrollable: false,
    scrollableHeight: "350px"
});

$('#advanced').flagStrap({
    buttonSize: "btn-lg",
    buttonType: "btn-primary",
    labelMargin: "20px",
    scrollable: false,
    scrollableHeight: "350px",
    onSelect: function (value, element) {
        alert(value);
        console.log(element);
    }
});
</script>