Button data-id değerini Modal içindeki değişkene atama - Sayfa 2

04-02-2019, 01:33:53

#10

PHP - WORDPRESS - YAZILIM

fatihbozkurt adlı üyeden alıntı: mesajı görüntüle

Tamam şimdi anladım dediğiniz gibi yaptım çalıştı çok teşekkür ederim. Kusura bakmayın biz böyle yolun başında olunca öğrenmemiz kolay olmuyor

est. sorun çözüldüyse ne mutlu iyi çalışnalar kolay gelsin 😊

04-02-2019, 14:14:30

#11

fatihbozkurt

Kimlik doğrulama veya yönetimden onay bekliyor.

metin_nn adlı üyeden alıntı: mesajı görüntüle

est. sorun çözüldüyse ne mutlu iyi çalışnalar kolay gelsin 😊

Şimdi farklı bir sıkıntı oluştu. Verileri ve Buttonları döngü içinde çekerek oluşturuyorum. Şu an yaptığımız sisteme göre tüm butonların id' si "düzenle" oldu. Ajax post işlemini buton id sine göre yaptığımız için tüm modallarda aynı çıkıyor çakışıyor.

Buton id değerinide veritabanından çeksem değişken olsa bu seferde ajax fonksiyonu içindede bu buton id değişkenini tanımlamak gerekecek.

Ayrıca ajax scripti içinde modal ismi olmadığı için başka modallarla da çakışıyor
Bu sorunu nasıl çözebiliriz?

Benim Kodum;

<?php
include("veritabani.php");
?>
<html>
  <head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="language" content="Tr">
    
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
  <link href="hummingbird-treeview.css" rel="stylesheet" type="text/css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>

  <title>Kayıtlar</title>
  
</head>
<body>

<div class="container">

 ÜRÜN EKLE - DÜZENLE 

 <div class="kolon6">
 <button onClick="location.href='rapor.php'" type="button">ÜRÜN Ekle</button> 
 </div> 	
  	<br/>
  	
    <div class="kolon5">
      <table border="1">
        <tr>
          <td colspan="4" align="center">ÜRÜNLER</td>
        </tr>
        <tr>
          <td width="25%">ADI</td>
          <td width="25%">MODELİ</td>
          <td width="25%">ÜCRET</td>
          <td width="25%">KONTROL</td>
        </tr>
    <?php
$sorgu = $baglanti->query("SELECT * FROM yeni where kod=4 ORDER BY adi asc");
if ($baglanti->errno > 0) {
    die("<b>Sorgu Hatası:</b> " . $baglanti->error);
}

while ($cikti = $sorgu->fetch_array()) {
	?>
        <tr>
          <td><?php echo $cikti["adi"]; ?></td>
          <td><?php echo $cikti["aciklama"]; ?></td>
          <td><?php echo $cikti["ucret"]; ?></td>
          <td><button type="button" id="duzenle" class="btn btn-primary btn-sm" data-id="<?php echo $cikti["id"]; ?>" data-toggle="modal" data-target="#myModal">Düzenle</button></td>
        </tr>
		
 
		<?php
}

$sorgu->close();
$baglanti->close();
		?>
      </table>



</div>

  

  <!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Ram Raporu Güncelleme</h4>
        </div>
        <div class="modal-body">

        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
      
    </div>
  </div>
  
 </div>

<script>
$("#duzenle").click(function(e) {
    var id= $(this).attr("data-id");
    $.ajax({
        type: "POST",
        url: "post.php",
        data: {
            id:  id,
        },
        success: function(result) {
              $('.modal-body').html(result);
        },
 
    });
});
</script>
</body>
</html>

fatihbozkurt adlı üyeden alıntı: mesajı görüntüle

Şimdi farklı bir sıkıntı oluştu. Verileri ve Buttonları döngü içinde çekerek oluşturuyorum. Şu an yaptığımız sisteme göre tüm butonların id' si "düzenle" oldu. Ajax post işlemini buton id sine göre yaptığımız için tüm modallarda aynı çıkıyor çakışıyor.

Buton id değerinide veritabanından çeksem değişken olsa bu seferde ajax fonksiyonu içindede bu buton id değişkenini tanımlamak gerekecek.

Ayrıca ajax scripti içinde modal ismi olmadığı için başka modallarla da çakışıyor
Bu sorunu nasıl çözebiliriz?

Benim Kodum;

<?php
include("veritabani.php");
?>
<html>
  <head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="language" content="Tr">
    
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
  <link href="hummingbird-treeview.css" rel="stylesheet" type="text/css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>

  <title>Kayıtlar</title>
  
</head>
<body>

<div class="container">

 ÜRÜN EKLE - DÜZENLE 

 <div class="kolon6">
 <button onClick="location.href='rapor.php'" type="button">ÜRÜN Ekle</button> 
 </div> 	
  	<br/>
  	
    <div class="kolon5">
      <table border="1">
        <tr>
          <td colspan="4" align="center">ÜRÜNLER</td>
        </tr>
        <tr>
          <td width="25%">ADI</td>
          <td width="25%">MODELİ</td>
          <td width="25%">ÜCRET</td>
          <td width="25%">KONTROL</td>
        </tr>
    <?php
$sorgu = $baglanti->query("SELECT * FROM yeni where kod=4 ORDER BY adi asc");
if ($baglanti->errno > 0) {
    die("<b>Sorgu Hatası:</b> " . $baglanti->error);
}

while ($cikti = $sorgu->fetch_array()) {
	?>
        <tr>
          <td><?php echo $cikti["adi"]; ?></td>
          <td><?php echo $cikti["aciklama"]; ?></td>
          <td><?php echo $cikti["ucret"]; ?></td>
          <td><button type="button" id="duzenle" class="btn btn-primary btn-sm" data-id="<?php echo $cikti["id"]; ?>" data-toggle="modal" data-target="#myModal">Düzenle</button></td>
        </tr>
		
 
		<?php
}

$sorgu->close();
$baglanti->close();
		?>
      </table>



</div>

  

  <!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Ram Raporu Güncelleme</h4>
        </div>
        <div class="modal-body">

        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
      
    </div>
  </div>
  
 </div>

<script>
$("#duzenle").click(function(e) {
    var id= $(this).attr("data-id");
    $.ajax({
        type: "POST",
        url: "post.php",
        data: {
            id:  id,
        },
        success: function(result) {
              $('.modal-body').html(result);
        },
 
    });
});
</script>
</body>
</html>

Sorunu mu verdiğiniz script kodunu aşağıdaki şekilde değiştirerek çözdüm. Teşekkürler.

<script>
$('#myModal').on('show.bs.modal', function(e) {

    //get data-id attribute of the clicked element
    var id = $(e.relatedTarget).data('id');
  
    $.ajax({
        type: "POST",
        url: "post.php",
        data: {
            id:  id,
        },
        success: function(result) {
              $('.modal-body').html(result);
        },
 
    });
});
</script>

26-02-2019, 00:04:45

#12

fatihbozkurt

metin_nn adlı üyeden alıntı: mesajı görüntüle

Bir kısım açıklama yapmış idim fakat sayfayı yenileyince silindi. Direk sayfa yapısına uygun örnek ile aşağıya ekliyorum.

1) Ajax Post Yöntemi ile.

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
    <title>Hello, world!</title>
</head>
<body>


<button type="button" id="duzenle" class="btn btn-primary btn-sm" data-id="1"  data-toggle="modal" data-target="#myModal">Düzenle</button>

<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal içeriği-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Modal Başlığı</h4>
</div>
<div class="modal-body">


</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Kapat</button>
</div>
</div>
</div>
</div>
    <!-- Optional JavaScript -->

    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>

<script>
$("#duzenle").click(function(e) {
    var id= $(this).attr("data-id");
    $.ajax({
        type: "POST",
        url: "post.php",
        data: {
            id:  id,
        },
        success: function(result) {
              $('.modal-body').html(result);
        },

    });
});
</script>

</body>
</html>

<?php
  $deger = $_POST['id'];
  echo $deger;
?>

Anlamadığınız yer olursa sorabilirsiniz.

Tekrar bişeyler sormak istiyorum. Verdiğiniz bu yöntemle işlem yaptığımda modalı kapattıktan sonra sayfamda javascript kullandığım diğer işlemler çalışmıyor. Sayfayı yenilemeden çalışmıyorlar. Bu sorunu nasıl çözebilirim?

26-02-2019, 10:03:52

#13

metin_nn

PHP - WORDPRESS - YAZILIM

fatihbozkurt adlı üyeden alıntı: mesajı görüntüle

Tekrar bişeyler sormak istiyorum. Verdiğiniz bu yöntemle işlem yaptığımda modalı kapattıktan sonra sayfamda javascript kullandığım diğer işlemler çalışmıyor. Sayfayı yenilemeden çalışmıyorlar. Bu sorunu nasıl çözebilirim?

muhtemelen javascript konumu ile alakalı bir durum bu hocam emin değilim neden böyle bir şeyin olabileceği konusunda, veyada ilgili dosyada yapılan bir hata sayfaya yansıyor javascriptleri engelliyor olabilir. isterseniz bir debug modunda birde, javascript konumlarını değişerek deneyebilirsiniz.