Post Input OnChange с AJAX

Question

Только некоторые проблемы с устранением неполадок AJAX.

Контекст: Построение большого стола с входными данными, которые должны размещаться после их заполнения. Думал, что триггер onchange будет работать лучше всего.

Вопрос: Я не могу заставить javascript передавать значение ввода на лист .php.

---

header.php

$(document).ready(function(){ 
    $(".matchedit").onchange(function postinput(){ // Problem 1: change(
    var matchvalue = $(this).value; // Problem 2: $(this).val(); 
    $.ajax 
     ({ 
      url: 'matchedit-data.php', 
      data: {matchvalue: matchvalue}, 
      type: 'post' 
     }); 
    }); 
}); 

page.php

<tr> 
    <td> 
    <input name="grp1" type="text" class="matchedit" onchange="postinput()"> 
    </td> 
</tr> 

matchedit-data.php

$entry = $_POST['matchvalue']; 
$conn->query("UPDATE matches SET grp = '$entry' WHERE mid = 'm1'"); 

---

Заранее благодарен!

Answer 1

Для считывания значения обернутого ввода jQuery следует использовать метод .val(), здесь value здесь возвращает значение undefined. Также вы должны использовать метод .on('change') или change(), объект jQuery не имеет метода onchange.

$(document).ready(function(){ 
    $(".matchedit").on('change', function postinput(){ 
     var matchvalue = $(this).val(); // this.value 
     $.ajax({ 
      url: 'matchedit-data.php', 
      data: { matchvalue: matchvalue }, 
      type: 'post' 
     }).done(function(responseData) { 
      console.log('Done: ', responseData); 
     }).fail(function() { 
      console.log('Failed'); 
     }); 
    }); 
});