Syntax error, unrecognized expression: option[value=property name]

Question

I have a datalist which looks like this

<datalist id="properties">
       <option value="property name"></option>
       <option value="property"></option>
</datalist>

Now I'm using this code to find where values entered by the user is in the list:

var user_property = $('#user_property').val().toLowerCase(); // taken from input type with id user_property
var pro = $('#properties').find("option[value="+user_property.replace(' ','-')+"]");
if(pro != null && pro.length > 0)
{
    // run some code
}
else
{
    // show error popup
}

I am getting error in var pro = $('#properties').find("option[value="+user_property.replace(' ','-')+"]");

Error code says Syntax error, unrecognized expression: option[value=property name]

How to get rid of this error?

Answer 1

try adding quotes, as:

var pro = $('#properties').find("option[value='"+user_property.replace(' ','-')+"']");

or better break it down to:

var replaced = user_property.replace(' ','-');
var pro = $('#properties').find("option[value='"+replaced+"']");

if you want to check for text like "property name" then you could directly do:

var pro = $('#properties').find("option[value='"+user_property+"']");