Search code examples
javascriptjqueryhtmlransack

How can i remove option selection without value?

I'm facing issues trying to remove the option or hide the first option value from a ransack code.

Could you please help me to face this issue?

I have this HTML CODE

<select id="q_c_0_a_0_name">
 <option value></option>
 <option value="lastanem1">First Lastname</option>
 <option value="lastname2">Second Lastname</option>
 ...
 <option value="xxxxxxxxx">Other value</option>
</select>

I'm trying to remove option or hide the first option because Ransack gem is generating the following HTML code:

<select id="q_c_0_a_0_name">
 <option value="name">     Filter by Name</option>
 <option value="lastanem1">Filter by First Lastname</option>
 <option value="lastname2">Filter by Second Lastname</option>
 ...
 <option value="xxxxxxxxx">Filter by Other value</option>
</select>

I tried this JQuery code:

$(function(){
  $("#q_c_0_a_0_name option[value=]").style.display = "none";
});

Also tried this JQuery code:

$(function(){
  $("#q_c_0_a_0_name option[value=""]").style.display = "none";
});
Solution

  • Using :first / :first-child

    $("#q_c_0_a_0_name option:first").remove();
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select id="q_c_0_a_0_name">
 <option value></option>
 <option value="lastanem1">First Lastname</option>
 <option value="lastname2">Second Lastname</option>
 <option value="xxxxxxxxx">Other value</option>
</select>