javascript dropdown validation

Question

I need to alert if you haven't selected anything and couldn't get it to work. It needs to show what is where wrong and alert with a window.

<!DOCTYPE html>
<html>
<head>
<select id="ddlView">
<option value="0">Select</option>
<option value="1">test1</option>
<option value="2">test2</option>
<option value="3">test3</option>
</select>  
<input type="button" onclick="myFunction()" value="select" />

<script>
function Validate()
{
var e = document.getElementById("ddlView");
var strUser = e.options[e.selectedIndex].value;

var strUser1 = e.options[e.selectedIndex].text;
if(strUser==0)
{
alert("Please select a user");
}
}
</td></head>

</html>

DiverseAndRemote.com · Accepted Answer · 2013-03-12 17:38:27Z

I think you have multiple problems here.

You need to add a body tag
Set the correct function name in your button.
you need a closing script tag

Give this a try:

<!DOCTYPE html>
<html>
    <body>
        <select id="ddlView">
            <option value="0">Select</option>
            <option value="1">test1</option>
            <option value="2">test2</option>
            <option value="3">test3</option>
        </select>  
        <input type="button" onclick="Validate()" value="select" />

        <script type="text/javascript">
            function Validate()
            {
                var e = document.getElementById("ddlView");
                var strUser = e.options[e.selectedIndex].value;

                var strUser1 = e.options[e.selectedIndex].text;
                if(strUser==0)
                {
                    alert("Please select a user");
                }
            }
        </script>
    </body>
</html>

pavan kumar · Accepted Answer · 2018-11-28 07:44:30Z

2

This is not you asked for but you can still consider what i did. Have an option with value 0 which is going to be the default option of the dropdown and add required attribute to the select element. Once this select element is in a form and is submitted ,HTML is automatically going to take over the validation part.

<select required>
<option value="">Select</option>
<option value="1">Option1</option>
</select>

answered Nov 28, 2018 at 7:44

pavan kumar

4085 silver badges19 bronze badges

Comments

Jean-François Fabre · Accepted Answer · 2021-05-31 20:41:04Z

1

<body>
<div>
    <span>Select the course : </span>
    <select id="ddlView">
        <option value="0">Select</option>
        <option value="1">Java Script</option>
        <option value="2">CSS</option>
        <option value="3">JQuery</option>
        <option value="3">HTML</option>
        <option value="3">C#</option>
    </select>
</div>
<br >
<input type="button" class="btn" value="Submit" id="btnSubmit" onclick="ddlValidate();" />

<script type="text/javascript">
    function ddlValidate() {
        var e = document.getElementById("ddlView");
        var optionSelIndex = e.options[e.selectedIndex].value;
        var optionSelectedText = e.options[e.selectedIndex].text;
        if (optionSelIndex == 0) {
            alert("Please select a Course");
        }
        else {
            alert("Success !! You have selected Course : " + optionSelectedText); ;
        }
    }
</script>

edited May 31, 2021 at 20:41

Jean-François Fabre♦

141k24 gold badges179 silver badges246 bronze badges

answered Apr 22, 2015 at 8:49

Barath Kumar

4393 silver badges7 bronze badges

1 Comment

Politank-Z Over a year ago

More explanation of how your code differs from OP and why that makes it work may be useful.

tuomastik · Accepted Answer · 2019-04-05 12:33:24Z

0

That has to be in your form processing script, you can just add it to the top of your code and check if it has been submitted.

// Place this atop of your script.
if(isset($_POST)) {
    if($_POST['member_id']) {
        // Your codes here
    }
}

edited Apr 5, 2019 at 12:33

tuomastik

4,9856 gold badges46 silver badges52 bronze badges

answered Apr 5, 2019 at 12:14

Pravesh

355 bronze badges

1 Comment

zedling Over a year ago

there is no mention of PHP in the question (or tags or in the provided code)

Aruna Prabhath · Accepted Answer · 2022-11-09 06:06:19Z

0

call this function at a button click(OnClientClick=" return Validate()") you have to list an item for the 0'th positions(ddlView.Items.Insert(0, new ListItem("Select...", "0"));)

function Validate(){
    var region = document.getElementById('<%=ddlView.ClientID%>').value;
                   if (region == 0) {
                       alert("Please select a user");
                       return false;
                   }
                }

answered Nov 9, 2022 at 6:06

Aruna Prabhath

2423 silver badges11 bronze badges

Comments

Tarek Mia · Accepted Answer · 2023-03-29 10:08:39Z

0

Nowadays, I do not believe it is necessary to alert. You can simply use the required HTML attribute in the select tag and make selected one option by default, disable it, set the value='', and set the button type=submit. In this case, the form won't be submitted if there is no selection by the user.

<form>
  <label for="ddlView">Select an Option</label>
  <select id="ddlView" required>
    <option selected disabled value="">Select</option>
    <option value="1">test1</option>
    <option value="2">test2</option>
    <option value="3">test3</option>
  </select>
  <button type="submit">Submit</button>
</form>

answered Mar 29, 2023 at 10:08

Tarek Mia

1011 silver badge5 bronze badges

Collectives™ on Stack Overflow

javascript dropdown validation

6 Answers 6

Comments

Comments

1 Comment

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

Comments

1 Comment

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related