v2.5.2
Giriş yap

Javascript İçinde PHP Foreach Kullanımı

resat
599 defa görüntülendi
4

Arkadaşlar merhaba, günlerdir uğraşıyorum fakat başarılı olamadım bir türlü. Bir formum var ve ekle butonuna bastığımda yeni satır ekleyip bunları veritabanına kayıt edebiliyorum. Fakat foreach ile eklenen satırlara veri çekemiyorum. Javascript içinde nasıl kullanacağım foreach kısmını yardımcı olur musunuz. 

        <div class="container pt-5">
      <div id="show_alert"></div>
      <button id="ekle" class="btn btn-success w-100 mb-3 add_item_btn">Ekle</button>
      <form action="#" method="POST" id="add_form">
        <div id="show_item">
          <div class="row mb-3">

            <div class="col-md-3">
              <select name="stok_urun" class="form-select" data-search="on" required>
                <option></option>
                <?php foreach ($urunsor as $cek): ?>
                  <option value="<?=$cek['id']?>"><?=$cek['ad']?></option>
                <?php endforeach ?>
              </select>
            </div>
            <div class="col-md-3">
              <input type="text" class="form-control" name="product_name[]" placeholder="Adınız Soyadınız" required>
            </div>

            <div class="col-md-2">
              <input type="number" class="form-control" name="product_price[]" placeholder="Fiyat" required>
            </div>

            <div class="col-md-2">
              <input type="number" class="form-control" name="product_qty[]" placeholder="Miktar" required>
            </div>

            <div class="col-md-2">
              <button class="btn btn-danger w-100 remove_item_btn">Sil</button>
            </div>
          </div>


          <input type="submit" class="btn btn-success w-100 mb-3" id="add_btn" value="Kaydet">
        </form>
      </div>


      <script src="jquery.min.js"></script>
      <script>
        $(document).ready(function(){

        //Ekleme İşlemi//
        $(".add_item_btn").click(function(e){
          e.preventDefault();
          $("#show_item").prepend(`<div class="row mb-3 append_item">

            <div class="col-md-3">
              <select name="stok_urun" class="form-select" data-search="on" required>
                <option></option>
                <?php foreach ($urunsor as $cek): ?>
                  <option value="<?=$cek['id']?>"><?=$cek['ad']?></option>
                <?php endforeach ?>
              </select>
            </div>


            <div class="col-md-3">
            <input type="text" class="form-control" name="product_name[]" placeholder="Adınız Soyadınız" required>
            </div>

            <div class="col-md-2">
            <input type="number" class="form-control" name="product_price[]" placeholder="Fiyat" required>
            </div>

            <div class="col-md-2">
            <input type="number" class="form-control" name="product_qty[]" placeholder="Miktar" required>
            </div>

            <div class="col-md-2">
            <button id="cikar" class="btn btn-danger w-100 remove_item_btn">Sil</button>
            </div>
            </div>`);
        });
        
        //Silme İşlemi//
        $(document).on('click', '.remove_item_btn', function(e) {
          e.preventDefault();
          let row_item=$(this).parent().parent();
          $(row_item).remove();
        });

        //Ajax Post İşlemi//
        $("#add_form").submit(function(e){
          e.preventDefault();
          $("#add_btn").val('Ekleniyor...');
          $.ajax({
            url:"action.php",
            method:"post",
            data: $(this).serialize(),
            success: function(response){
              $("#add_btn").val('Ekle');
              $("#add_form")[0].reset();
              $(".append_item").remove();
              $("#show_alert").html(`<div class="alert alert-success">${response}</div>`)
            }
          });
        });
      });
    </script>
php javascript
Cevap yaz
Cevaplar (4)
trsherlock
831 gün önce

Ben Pdo kullanan birisi değilim algılamam zaman aldı biraz. :)
Script içinde foreach öncesi tekrar istek attırmak gerekiyor.
Veya mysqli_query() kullanımında while ile döngüye soktuğumuzda her satırı tek tek yakalayıp bir değişkene atıyoruz. Örnek: $rows[] = $row
Sonra değişkeni istediğimiz yerde döngüye sokuyuyoruz.
Pdo ile çekilen veriler de aynı şekilde foreach ile her satır tek tek yakalanıyor ve anlık yazdırılıyor bir daha da kullanılmıyor.

// Bu pek sağlıklı değil her seferinde veritabanına istek atacak. Yeni değerlerin eklenme ihtimali varsa kullanılabilir.
<?php $urunsor = $db->query("SELECT * FROM urunler ORDER BY id DESC", PDO::FETCH_ASSOC);?>
<?php foreach ($urunsor as $cek): ?>
    <option value="<?=$cek['id']?>"><?=$cek['ad']?></option>
<?php endforeach ?>

<?php>
foreach($urunsor as $cek) {
    $urunler[] = $cek;
}
?>
<?php foreach ($urunler as $cek): ?>
    <option value="<?=$cek['id']?>"><?=$cek['ad']?></option>
<?php endforeach ?>
0
#010885
resat
831 gün önce

@trsherlock teşekkürler hocam

1
#010886
resat
831 gün önce

@trsherlock hocam tam olarak kodlarım bu şekilde. Herhangi bir hatada almıyorum direk boş olarak dönüyor. Sanırım js kısmında foreach kullanımım yanlış

<?php
require_once 'inc/db.php';
 
//Ürünler Sorgusu//
$urunsor = $db->query("SELECT * FROM urunler ORDER BY id DESC", PDO::FETCH_ASSOC);
?>
<!doctype html>
  <html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
    <title>Hello, world!</title>
  </head>
  <body>

    <div class="container pt-5">
      <div id="show_alert"></div>
      <button id="ekle" class="btn btn-success w-100 mb-3 add_item_btn">Ekle</button>
      <form action="#" method="POST" id="add_form">
        <div id="show_item">
          <div class="row mb-3">

            <div class="col-md-3">
              <select name="stok_urun" class="form-select" data-search="on" required>
                <option></option>
                <?php foreach ($urunsor as $cek): ?>
                  <option value="<?=$cek['id']?>"><?=$cek['ad']?></option>
                <?php endforeach ?>
              </select>
            </div>
            <div class="col-md-3">
              <input type="text" class="form-control" name="product_name[]" placeholder="Adınız Soyadınız" required>
            </div>

            <div class="col-md-2">
              <input type="number" class="form-control" name="product_price[]" placeholder="Fiyat" required>
            </div>

            <div class="col-md-2">
              <input type="number" class="form-control" name="product_qty[]" placeholder="Miktar" required>
            </div>

            <div class="col-md-2">
              <button class="btn btn-danger w-100 remove_item_btn">Sil</button>
            </div>
          </div>


          <input type="submit" class="btn btn-success w-100 mb-3" id="add_btn" value="Kaydet">
        </form>
      </div>


      <script src="jquery.min.js"></script>
      <script>
        $(document).ready(function(){

        //Ekleme İşlemi//
        $(".add_item_btn").click(function(e){
          e.preventDefault();
          $("#show_item").prepend(`<div class="row mb-3 append_item">

            <div class="col-md-3">
              <select name="stok_urun" class="form-select" data-search="on" required>
                <option></option>
                <?php foreach ($urunsor as $cek): ?>
                  <option value="<?=$cek['id']?>"><?=$cek['ad']?></option>
                <?php endforeach ?>
              </select>
            </div>


            <div class="col-md-3">
            <input type="text" class="form-control" name="product_name[]" placeholder="Adınız Soyadınız" required>
            </div>

            <div class="col-md-2">
            <input type="number" class="form-control" name="product_price[]" placeholder="Fiyat" required>
            </div>

            <div class="col-md-2">
            <input type="number" class="form-control" name="product_qty[]" placeholder="Miktar" required>
            </div>

            <div class="col-md-2">
            <button id="cikar" class="btn btn-danger w-100 remove_item_btn">Sil</button>
            </div>
            </div>`);
        });
        
        //Silme İşlemi//
        $(document).on('click', '.remove_item_btn', function(e) {
          e.preventDefault();
          let row_item=$(this).parent().parent();
          $(row_item).remove();
        });

        //Ajax Post İşlemi//
        $("#add_form").submit(function(e){
          e.preventDefault();
          $("#add_btn").val('Ekleniyor...');
          $.ajax({
            url:"action.php",
            method:"post",
            data: $(this).serialize(),
            success: function(response){
              $("#add_btn").val('Ekle');
              $("#add_form")[0].reset();
              $(".append_item").remove();
              $("#show_alert").html(`<div class="alert alert-success">${response}</div>`)
            }
          });
        });
      });
    </script>
    
  </body>
  </html>
0
#010881
trsherlock
831 gün önce

Kodların tamamını görmediğim için net bir yorum yapamam tahmin yürüterek bir örnek hazırladım.
Görseldeki gibi açılır kutu boş geliyorsa $urunsor değişkeni aşağıdaki gibi bir fonksiyonun içinde olursa değişkene ulaşılamadığı için option etiketleri oluşmayacaktır.
Select etiketini incele bir php uyarısı var mı kontrol et. Tahmin ettiğim gibi bir durumsa ikinci örnekteki gibi bir uyarı alırsın.

<body>
    <?php
        function iller() {
            $iller = [
                [
                    "key"=> "06",
                    "text"=> "Ankara"
                ],
                [
                    "key"=> "08",
                    "text"=> "Artvin"
                ],
                [
                    "key"=> "35",
                    "text"=> "İzmir"
                ]
            ];
            ?>   
        <div>
            <select>
                <option></option>
                <?php foreach ($iller as $val): ?>
                    <option value="<?=$val['key']?>"><?=$val['text']?></option>
                <?php endforeach ?>
            </select>
        </div>
    <?php
        };
        iller();
    ?>
    <script>
        $("div").append(`<select>
        <option></option>
            <?php foreach ($iller as $val): ?>
                <option value="<?=$val['key']?>"><?=$val['text']?></option>
            <?php endforeach ?>
        </select>`)
    </script>
</body>

Alınan uyarı:

<select>
    <option></option>
    Notice:  Undefined variable: degisken in D:laragonwwwreamworksZirveExp	est.php on line 44
    Warning:  Invalid argument supplied for foreach() in D:laragonwwwreamworksZirveExp	est.php on line 44
</select>


<script>
    $("div").append(`<select>
        <option></option>
        <br />
        <b>Notice</b>:  Undefined variable: degisken in <b>D:\laragon\www\freamworks\ZirveExp\test.php</b> on line <b>44</b><br />
        <br />
        <b>Warning</b>:  Invalid argument supplied for foreach() in <b>D:\laragon\www\freamworks\ZirveExp\test.php</b> on line <b>44</b><br />
        </select>`)
</script>
0
#010880