如何将PHP行记录插入AJAX网址

时间:2018-09-19 20:17:20

标签: javascript php jquery ajax

我可以在AJAX网址中插入update.php?id=" . $row["id"] . "吗? 我正在尝试通过表单进行异步sql行更新。我没有特定的ID,因为ID是在点击时调用的。

JS

  submit.on('click', function(e) {
            e.preventDefault();
            if(validate()) {
                $.ajax({
                    type: "POST",
                    url: 'update.php?id=" . $row["id"] . "',
                    data: form.serialize(),
                    dataType: "json"
                }).done(function(data) {
                    if(data.success) {
                        id.val('');
                        cas.val('');
                        info.html('Message sent!').css('color', 'green').slideDown();
                    } else {
                        info.html('Could not send mail! Sorry!').css('color', 'red').slideDown();
                    }
                });
            }
        });

PHP (位于update.php调用所在的位置)

$sql3 = "
SELECT id, potnik_id, ura, naslov
FROM prevoznik 
ORDER BY HOUR(ura), MINUTE(ura) ASC;
";
$result = $conn->query($sql3);
$potnik = $row["potnik"];
if ($result->num_rows > 0) {
    // output data of each row
    while($row = $result->fetch_assoc()) {

        //Spremenjena oblika datuma
        $date = date_create($row["ura"]);
        $ura_pobiranja = date_format($date,"H:i");
        echo "<div class=\"row list  divider-gray\">
                <div class=\"col-1 fs-09 fw-600\">" . $row["id"] . " </div>
                  <div class=\"col-3 flex-vcenter-items fw-600 fs-09\">" . $row["naslov"] . " </div>
                <div class=\"col-1 flex-vcenter-items fw-600 fs-09\">$ura_pobiranja</div>
            ";

        if ($row["naslov"] !== null) {
            echo " <div class=\"col-6 flex-vcenter-items fs-1\">Nastavi uro<form id='form' action='update.php?id=" . $row["id"] . "' method='POST'><input id='id' name='potnik' value='".$row["id"]."' type='hidden' /> <input id='cas' class=\"form-control fancy-border\" type=\"text\" name=\"posodobljeni_cas\"/><input id='submit' type='submit' value='Posodobi'>    <label id=\"info\"></label></form></div>";
            echo " </div>";
        }
        else {
            echo " </div>";
        }

    }
} else {
    echo "<div class=\"col flex-vcenter-items fw-100 fs-1\"><i class=\"far fa-frown-open pr-3\"></i>Nimaš še nobenih opravil
                                    </div>";
}

2 个答案:

答案 0 :(得分:2)

首先,您将需要修复许多HTML。您为各种HTML元素有许多重复的ID属性。这将导致许多JavaScript问题,并且HTML的语法不正确。

  $html = ""
  $id = $row['id'];
  if ($row["naslov"] !== null) {
    $html .= "<div class='col-6 flex-vcenter-items fs-1'>\r\n";
    $html .= "\tNastavi uro\r\n";
    $html .= "\t<form id='form-$id' action='update.php?id=$id' method='POST' data-id='$id'>\r\n";
    $html .= "\t\t<input id='cas-$id' class='form-control fancy-border' type='text' name='posodobljeni_cas' />\r\n";
    $html .= "\t\t<input id='submit-$id' type='submit' value='Posodobi'>    <label id='info-$id'></label>\r\n";
    $html .= "\t</form>\r\n</div>\r\n";
    $html .= "</div>";
    echo $html;
  } else {
    echo " </div>";
  }

您可以在这里看到很多工作。首先,我们创建一个$html$id变量,以简化工作。现在,当我们将字符串数据输入到$html变量中时,如果我们使用"(双引号)进行换行,则可以直接在字符串中使用$id。我们还将使用'(单引号)包装所有HTML元素属性。

为您的jQuery尝试一下:

$(function(){
  $("form[id|='form']").on('submit', function(e) {
    e.preventDefault();
    var form = $(this);
    var id = form.data("id");
    var cas = $("inptu[id|='cas']", form);
    var info = $("input[id|='info']", form);
    if(validate()) {
      $.ajax({
       type: "POST",
       url: form.attr("action"),
       data: form.serialize(),
       dataType: "json"
     }).done(function(data) {
       if(data.success) {
         id.val('');
         cas.val('');
         info.html('Message sent!').css('color', 'green').slideDown();
       } else {
         info.html('Could not send mail! Sorry!').css('color', 'red').slideDown();
       }
     });
   }
 });
});

有关选择器的更多信息:https://api.jquery.com/attribute-contains-prefix-selector/

由于您没有提供测试区域,因此无法测试。希望对您有所帮助。

答案 1 :(得分:0)

您可以分配PHP $ row ['id'];变量添加到本地JS变量并将其附加到URL,如下所示-

submit.on('click', function(e) {
                    e.preventDefault();
                    if(validate()) {
                       var id=<?=$row['id'];?>; 
                        $.ajax({
                            type: "POST",                                
                            url: 'update.php?id='+id,
                            data: form.serialize(),
                            dataType: "json"
                        }).done(function(data) {
                            if(data.success) {
                                id.val('');
                                cas.val('');
                                info.html('Message sent!').css('color', 'green').slideDown();
                            } else {
                                info.html('Could not send mail! Sorry!').css('color', 'red').slideDown();
                            }
                        });
                    }
                });