$(document).ready(function() {
function validate() {
var d1 = document.getElementById("edit-submitted-23");
var d2 = document.getElementById("edit-submitted-24");
if (d1 == d2) {
alert("You have choosen the same value");
}
}
});
I am trying to check if selected values are same in different dropdowns with Javascript. However the code that I use gives no alert.
You are checking the elements directly, where you want to check values.
So your condition should be
if (d1.value == d2.value) {
}
dd2 -> d2
What your code does is compare two DOM references together. This will always give false as you are comparing different HTML elements. What you mean to do is to compare the elements’ values. Your code should be like this:
$( document ).ready(function() {
var d1 = document.getElementById("edit-submitted-23");
var d2 = document.getElementById("edit-submitted-24");
if (d1.value == d2.value)
{
alert("You have choosen the same value");
}
})<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="edit-submitted-23">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
<select id="edit-submitted-24">
<option>1</option>
<option>2</option>
<option>3</option>
</select>I should also note that your code defines a function validate() but doesn’t use it. You don’t need to define it. Or if you do, you need to call it afterwards:
$(document).ready(function(){
function validate(){
....
}
validate();
})
d1.value and d2.value? (Use console.log())validate(). Check the updates to my answer.validate() method outside of $(document).ready(). Then give both <select> elements onchange like this: <select onchange=validate()>.Since you are using JQuery, you can do check like this:
function validate() {
if($("#edit-submitted-23").val() === $("#edit-submitted-24").val()) {
alert('You have choosen the same value');
}
}
Assuming you are calling validate() on some event.
alert() when you call this function and not when page reloads. When are you calling this function???