Как прикрутить ajax к такому select?

Question

[paulvales]

Здравствуйте,
В заказнике в поле статут есть выпадающий список(выводятся циклом while), пробую сделать при нажатии на определенный статус -его смена.
вот такой select выводится в цикле php:

<form action="" method="POST" name="sta" id="sta">
 <div class="input-field col s12">
    <select name="stat">
      <option data-txt1="0" data-txt2="'.$row["id"].'" class="cyan val" value="0"'.$s0.'>Новый</option>
      <option data-txt1="1" data-txt2="'.$row["id"].'" class="blue lighten-2 val" value="1"'.$s1.'>Оплачен</option>
      <option  data-txt1="2" data-txt2="'.$row["id"].'" class="orange val" value="2"'.$s2.'>Отправлен</option>
      <option data-txt1="3" data-txt2="'.$row["id"].'" class="light-green accent-3 val" value="3"'.$s3.'>Успешно</option>
      <option data-txt1="4" data-txt2="'.$row["id"].'" class="red darken-1 val" value="4"'.$s4.'>Отмена</option>
    </select>
    <label>Статус</label>
  </div>
<input type="hidden" value="'.$row["id"].'" name="id">
  </form>

ajax

$(document).ready(function(){
    $('.val').click(function(e){
        e.preventDefault();
        var stat=$(this).data('txt1');
        var idd=$(this).data('txt2');
 $.ajax({      
          type: 'POST',
          url: 'stat.php',
          data: { 'stat':stat, 'idd': idd };
,
success:  function(data) {
alert(stat+idd);
      $('#result').html(data);
          },
      complete: function() {
   
    },
          error:  function(xhr, str){
                alert('Возникла ошибка: ' + xhr.responseCode);
            }
       
        }) ;


  
    });
});

PHP

include('bd.php');
$stat=$_POST["stat"];
$id=$_POST["idd"];

echo"UPDATE `order` SET stat='$stat' WHERE id='$id'";

Какие другие способы есть? или как подправить этот?

Comments

[Алексей Уколов]

Ваш вопрос в чем конкретно? В вашем варианте что-то не работает?

[paulvales]

Алексей Уколов: да,не реагирует

Answer 1

[Дмитрий Ковальский]

Лучше привязывать событие не на клик по option, а на change select.
Примерно так :

$("[name='stat']").change(function(){
$(this).val() - выбранное значение.
или $("[name='stat'] :selected") - выбранный option
})

Comments

[paulvales]

а если мне нужно передать выбранное значение и ИД?

[Дмитрий Ковальский]

paulvales: дописку к коду сделал.

[Виталий Инчин ☢]

paulvales: this.id

[paulvales]

Виталий Инчин: я про ИД который в data-txt2="'.$row["id"].'"

[Дмитрий Ковальский]

paulvales: $("[name='stat'] :selected").data('txt2') - так к примеру

[paulvales]

Дмитрий Ковальский: почемуто ваш вариант с $("[name='stat']").change(function(){ не работает,я кинул alert для проверки и ничего