Dropdown option value - no less than

Question

I am working on a real estate website and require dropdown fields for minimum bedrooms, bathroom etcs using a simple html code:

 <select class="facetwp-dropdown" id="id_beds_min" name="beds_min"> <option disabled selected value>Beds</option> <option value="1">1+</option> <option value="2">2+</option> <option value="3">3+</option> <option value="4">4+</option> </select>

I know that the fields need conditions - ie that it cannot be less than 1, or 2 etc. But not quite sure on the coding.

I'm using a plugin called FacetWP to assist with the search fields.

Any assistance?

Answer 1

I would completely remove the options you want to disable:
Within the html code (in this code where <option value="1">1+</option> is), call a function in brackets: {this.renderNumberOfBedOptions(minNumberOfBedOptions, maxNumberOfBedOptions)}

Then, above the html code inside the javascript code:

    renderNumberOfBedOptions{minNumberOfBedOptions, maxNumberOfBedOptions) {
       let options;  
       for (let i = minNumberOfBedOptions; i < maxNumberOfBedOptions; i++) {
          options += <option value=i>i+</option>
       }
       return options;

Answer 2

Your html should be somthing like this:

<select class="facetwp-dropdown" id="id_beds_min" name="beds_min">
<option disabled selected value>Beds</option>

<?php 

for($i=$minbeds; $i<=maxbeds; $i++)
{

    echo "<option value=".$i.">".$i."+</option>";
}
?> 
  </select> 

What you do next in the server side is query with something like this:

$bedrooms_min = $_POST["beds_min"];
query = "select*  from houses where bedrooms >=".$bedrooms_min

and consider using mysqli prepared statements. if your html template contains no php code you can convert the loop to JavaScript after querying the minimum and maximum number of rooms from the back end but WordPress templates can contain php code anyway.