Блог

я застрял со странной проблемой. у меня есть выпадающий список, заполняющий значения через базу данных. после заполнения я добавляю новое значение. нет, я хочу вызывать функцию, когда пользователь выбирает это новое значение.

 if($('#ab option:selected').text() === "Other")
{
	$('#txtbox').show();
}  

 <select class="form-control col-md-7 col-xs-12" id="ab" >
      <option select = "selected" value = "" >Select county </option>
	 
      <?php
       $con=mysqli_connect("localhost","root","","db1");

//Check connection
if (mysqli_connect_errno()) {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
}  
      $sql = "select county from tbl WHERE Code = 'a'";
      $res = mysqli_query($con, $sql);
      if(mysqli_num_rows($res) > 0) {
        while($row = mysqli_fetch_object($res)) {
          echo "<option value='".$row->id."'>".$row->county."</option>";
		  
        }
		echo "<option value='".$row->id."'>Other";
      }
      ?>

    </select>  

я много чего перепробовал, но ничего не работает

Используйте обработчик событий изменения и переместите свой код в рамках обратного вызова.

 $('#ab').change(function(){
    if($(this).text() === "Other"){
        $('#txtbox').show();
    } else{ // add else part to hide the element
        $('#txtbox').hide();
    }
});
  

К вашему СВЕДЕНИЮ: Вы можете упростить свой код, используя toggle() метод.

 $('#ab').change(function(){
    $('#txtbox').toggle($(this).text() === "Other");
});
  

Вам не хватает закрывающего тега для последнего option в коде на стороне сервера.

 echo "<option value='".$row->id."'>Other</option>";
// -- here -----------------------------^^^^^^^^^^----
  

К вашему СВЕДЕНИЮ: для корректного запуска кода jQuery после загрузки всего кода переноса элемента в обработчик готовности документа.