отправить значение флажка с помощью вызова ajax

Question

Мне нужно отправить значения флажков на странице на страницу php, которая обработает эти данные и вернет ответ в <div> названном результате.Он должен получать ответ каждый раз, когда флажок установлен или снят, поэтому вызов ajax должен работать «вживую» для всех флажков на странице.Я перепробовал все примеры, найденные на SO, но безуспешно, поэтому должно быть что-то не так в том, что я делаю, но я не могу найти что.

Это один из флажков (всефлажки похожи)

echo "<input type='checkbox' id='model' class='model' value='" . $row["model"] . "'>" . $row["model"] . "<br>"; 

Ниже приведен jquery, который я пробовал

$("checkbox").click(function() {
   if(this.checked){
        $.ajax({
            type: "POST",
            url: 'pfinder.php',
            data: $(this).attr('value'), 
            success: function(data) {
                $("#result").load(result);
        },
        });

    }
};

Я также пытался использовать только идентификатор одного флажка, просто чтобы проверить,но безуспешно

$("#model").click(function() {
       if(this.checked){
            $.ajax({
                type: "POST",
                url: 'pfinder.php',
                data: $(this).attr('value'), 
                success: function(data) {
                    $("#result").load(result);
                },
                });

            }
    };

И следующий файл pfinder.php, который обрабатывает данные

$model = $_POST["model"];
echo $model;

, очень простой, но до сих пор в * 1016 нет данных. Любой совет?

Answer 1

Я думаю, что вы хотите отправить значение флажка, если флажок установлен и если флажок не установлен, вы хотите отправить 0. Итак, вот код, который может быть полезен для вас

$(document).on("change", ".model", function () {

    let c = this.checked ? this.value : '0'; // $(this).val()

    if(c){

      //check if it alerts when check box is checked

      alert('checkbox is checked');

      // perform your ajax here
      $.ajax({
        type: "POST",
        url: 'pfinder.php',
        data: $(this).val(), 
        success: function(data) {
            //check if ajax is completed of no
            alert('ajax completed');
            $("#result").load(result);
         },
      });

    }else{

      //check if it alerts when check box is unchecked
      alert('checkbox is NOT checked');
    }

});

Answer 2

Вместо this.checked попробуйте $(this).prop("checked").

и измените $(this).attr('value') на $(this).val()

$(".model").click(function() {
   if($(this).prop("checked")){
        $.ajax({
            type: "POST",
            url: 'pfinder.php',
            data: $(this).val(), 
            success: function(data) {
                $("#result").load(result);
        },
        });

    }
};