Ajax双重表单,首先是select而不是经典表单

时间:2017-11-15 23:32:50

标签: javascript php jquery ajax forms

所以我在前端有一个表单。和进程文件中的第二个表单。 第一种形式我用产品信息调用第二种形式。

FIRST FORM

      $izmena_proizvoda = $conn->query("SELECT * FROM proizvodi");
      $izmena_proizvoda->execute();
      echo '<form method="POST">';
      echo '<select class="form-control" name="izmena_proizvoda" id="izaberi_proizvod" onchange="izmena_proizvoda_ajax(this.value);">';
      echo '<option>Izaberite proizvod</option>';
            while($izmena_proizvoda_o=$izmena_proizvoda->fetch()){
                echo '<option value="'.$izmena_proizvoda_o['id_sata'].'">';
                echo $izmena_proizvoda_o['nazivsata'];
                echo '</option>';
            }
      echo '</select>';
      echo '</form>';

这个表格的ajax

    function izmena_proizvoda_ajax(val){
    $.ajax({
        url: "../sadrzaj/stranice/izmenaproizvoda.php",
        type: 'POST',
        data: {
            izmena_proizvoda:val
        },
        success: function (response) {
            document.getElementById("izmena_proizvoda_prikaz").innerHTML = response;
            console.log(response)

        }
    });
}

在流程文件中我有这个。

if(isset($_POST['izmena_proizvoda'])){
$izmena_proizvoda_forma = $conn->prepare("SELECT * FROM proizvodi WHERE id_sata = :id_sata");
$izmena_proizvoda_forma->bindParam(':id_sata', $_POST['izmena_proizvoda'], PDO::PARAM_INT);
$izmena_proizvoda_forma->execute();
echo '<hr>';
echo '<form method="post" action="#" id="izmena_proizvoda_update_form" class="ajax" >';
while($izmena_proizvoda_forma_o=$izmena_proizvoda_forma->fetch()){
    echo'        
              <input type="hidden" name="slika_za_brisanje" value="'.$izmena_proizvoda_forma_o['slika'].'">       
              <input type="hidden" name="id_izmena" value="'.$izmena_proizvoda_forma_o['id_sata'].'">
              <label for="naslov_izmena">Naziv sata</label>
              <input type="text" id="naslov_izmena" name="naslov_izmena" class="form-control" value="'.$izmena_proizvoda_forma_o['nazivsata'].'">
              <label for="cena_izmena">Cena</label>
              <input id="cena_izmena" type="text" name="cena_izmena" class="form-control" value="'.$izmena_proizvoda_forma_o['cenasata'].'"><br>
              <label for="vodootpornost">Vodootpornost</label>
              <input id="vodootpornost" type="text" name="vodootpornost" class="form-control" value="'.$izmena_proizvoda_forma_o['vodootpornost'].'"><br>
              <label for="zalihe">Zalihe</label>
              <input id="zalihe" type="text" name="zalihe" class="form-control" value="'.$izmena_proizvoda_forma_o['zalihe'].'"><br>
              <label for="pol">Pol sata</label>
              <input id="pol" type="text" name="pol" class="form-control" value="'.$izmena_proizvoda_forma_o['pol'].'"><br>
              <label for="opissata_izmena"></label>';
    echo '  <textarea id="opissata_izmena" rows="10" name="opissata_izmena">'.$izmena_proizvoda_forma_o['opissata'].'</textarea><br>';

    echo '<input type="submit" name="izmena_proizvoda_potvrda" value="Sacuvaj izmene" class="btn btn-info">';
}
echo '</form>';
}

所以当我在前端这样做的时候。工作良好。但是当我尝试为form2做另一个ajax时,我遇到了问题。我不知道如何为另一种形式运行ajax。 我尝试将ajax代码放在forntend页面但是没有用。我也尝试将ajax放在表单下面的进程文件中。一起打电话。也没有叉。 我如何从ajax 1中为ajax 2做一些触发器,如

Ajax1:嘿ajax2我做我的工作。你现在有一个表格。当用户点击提交时,做你的工作并且不要翻页。

抱歉,我的英语不好。

2 个答案:

答案 0 :(得分:0)

您摆脱了.squeeze处理程序,保留了onchange标记并将事件处理程序附加到所有表单而不是特定表单。然后使用<form>引用生成提交事件的表单的值。

$(this)

答案 1 :(得分:0)

您需要其他方式将事件分配给新的HTML元素 这样就可以将事件分配给任何动态HTML元素。

$(function() {

  //Assign event to input submit with name izmena_proizvoda_potvrda
  $(document).on('click', 'input[name=izmena_proizvoda_potvrda]',
    function(e) {
      e.preventDefault();
      //Ajax request

    }); //end function()

})