Ajaxダブルフォーム、選択して古典的なフォームの最初のフォーム

Question

したがって、私はフロントエンドに1つのフォームを持っています。また、プロセスファイルの2番目の形式。 最初のフォームでは、製品情報を含む2番目のフォームが呼び出されます。プロセスファイルで、このフォーム

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) 

     } 
    }); 
} 

ため

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私はこの1つを持っています。

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を実行することができないか分からない。 forntendページにajaxコードを入れようとしましたが、didntの作業をしました。また、フォームの下にプロセスファイルにajaxを置くことを試みました。両方を一緒に呼び出すフォークもなかった。 どのように私はajax 1のようないくつかのトリガーを作ることができます。

Ajax1：やあ、ajax2私は自分の仕事をします。あなたは今、フォームを持っています。ユーザーがサブミットをクリックすると、あなたの仕事を行い、ページをリフレッシュしません。

申し訳ありません、私の悪い英語です。

Answer 1

onchangeハンドラを削除し、<form>タグを保持し、特定のフォームではなくすべてのフォームにイベントハンドラを添付します。次に、$(this)を使用して、送信イベントを生成するフォームの値を参照します。

Answer 2

新しい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() 

})