Wednesday, 12 October 2016

Validate (Check) HTML Select option DropDownList using JavaScript and jQuery

JavaScript :

Select List:

<select id="ddlList">
    <option value=""></option>
    <option value="1">List 1</option>
    <option value="2">List 2</option>
    <option value="3">List 3</option>
</select>
<input type="submit" value="Validate" onclick="return Validate()" />
<script type="text/javascript">
    function Validate() {
        var ddlList= document.getElementById("ddlList");
        if (ddlList.value == "") {
            //If the "Please Select" option is selected display error.
            alert("Please select an option!");
            return false;
        }
        return true;
    }
</script>


jQuery :

Select List:

<select id="ddlList">
    <option value=""></option>
    <option value="1">List 1</option>
    <option value="2">List 2</option>
    <option value="3">List 3</option>
</select>
<input type="submit" id="btnSubmit" value="Validate" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        $("#btnSubmit").click(function () {
            var ddlList= $("#ddlList");
            if (ddlList.val() == "") {
                //If the "Please Select" option is selected display error.
                alert("Please select an option!");
                return false;
            }
            return true;
        });
    });
</script>


Validate (Check) HTML Select option  DropDownList using JavaScript and jQuery

No comments:

Post a Comment