Postingan lainnya

Edit data dengan ajax

Halo, Saya ingin mengedit data status di yang tersambung ke database.. dengan menggunakan ajax agar data pada tampilan web dan di database nya ikut berubah.. nah saat saya mencoba membuatnya, data nya tidak mau berubah dan muncul error "undefined isi_komen" padahal sudah saya cek dan tidak ada yg keliru.. kira" solusinya bagaimana ya? Terima kasih

Kode Timeline.php

<?php
require_once("auth.php");
//include "koneksi.php";

?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="icon" type="image/png" href="Assets/icon.png">
    <link rel="stylesheet" type="text/css" href="Assets/timeline.css">
    <title>Timeline HeadBook</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
    <script type="text/javascript" src="Assets/jquery.js" ></script>

    <link rel="stylesheet" href="css/bootstrap.min.css" />
</head>
<body class="bg-light">

  <div class="container mt-5" style="height:100%;">
    <div class="row">
    <div class="col-md-4">

    <div class="card">
        <div class="card-body text-center">

        <img class="img img-responsive rounded-circle mb-3" width="160" src="Assets/<?php echo $_SESSION['user'][7] ?>" />

        <h3><?php echo $_SESSION['user'][1]." ".$_SESSION['user'][2] ?></h3>
        <p><?php echo $_SESSION['user'][3] ?></p>

        <p><a href="logout.php">Logout</a></p>
        </div>
        </div>
        </div>

      <div class="col-md-8">

          <form action="" method="post" >
          <div class="form-group">
          <textarea type="text" name="Nama" style="display:none;"><?php echo $_SESSION['user'][3] ?> </textarea>
          <textarea class="form-control" placeholder="Apa yang kamu pikirkan?" name="status"></textarea>
          <br>
          <button type="submit" class="btn btn-danger" name="tombol">Bagikan</button>

          </div>


      <?php
  require_once("config.php");
  if(isset($_POST['tombol'])){
  $email = $_REQUEST['Nama'];
  $status = $_REQUEST['status'];
  $conn = mysqli_connect($db_host, $db_user, $db_pass, $db_name) or die ("Koneksi gagal");
  $mysqli = "INSERT INTO timeline (Email, Status) VALUES ('$email', '$status')";
  $result = mysqli_query($conn, $mysqli);
  //$rows = $result->fetch(PDO::FETCH_NUM);
  //$_SESSION['user1'] = $rows;
//echo "<script>history.back()</script>";
  } ?>
    <div>
      <?php
 $conn = mysqli_connect($db_host, $db_user, $db_pass, $db_name) or die ("Koneksi gagal");
$select = mysqli_query($conn, "SELECT * FROM timeline ORDER BY id DESC");

  while($stat = mysqli_fetch_array($select)){ ?>
      <?php $str = $stat['id']; ?>
 <div class='' id='komentar_<?=$str;?>' data-id='<?=$str;?>'>
      <?php

      echo  "
  <div class='card mb-3'  id='komentar_$str' data-id='$str'>
  <div class='card-body' data-id='$str'>
  <div class='row' style='background-color:#9F3' data-id='$str'>
  <div class='media' data-id='$str'>
  <img src='Assets/default.svg' class='media-object img-rounded' width='50' height='50' alt='Sample Image' data-id='$str'>
  <div class='media-body' data-id='$str'>
  <h4 data-id='$str' class='media-heading'><small>".$stat['Email'].' | '.$stat['Waktu'].
    "<i></i></small></h4>
    <br><hr>
    <p class='komentar_text' data-id='$str'>".$stat['Status']."</p>
    </div>
     </div>
  <div class='row' data-id='$str'>

       </div>
       </div>
             <input type='submit' value='Edit' data-id='$str' class='edit_komentar'>

            <button type='button' class='hapus_komentar' data-id='$str'>Hapus</button>

            </div>
            </div>
            </div>
			<br>
    "

  ;}



   ?>
      </div>

  <?php mysqli_close($conn);
  ?>
  <script type="text/javascript">
   $(document).on('click','.hapus_komentar',function( event ){
     event.preventDefault();
        var id = $(this).attr('data-id');
        $.ajax({
          method: "POST",
          url: "Hapus.php",
          data: { id_komen:id , type:"delete"},
          success: function(data){
          $('#komentar_'+id).fadeOut();
         }
        });
      });


      $(document).on('click','.komentar_text',function(){
        var id = $(this).attr('data-id');
        var textbox = $(document.createElement('textarea')).attr('id','textarea_'+id);
        $(this).replaceWith(textbox);
      });

      $(document).on('click','.edit_komentar',function(){
        var id = $(this).attr('data-id');
        var isi = $('#textarea_'+id).val();
        var text = $(document.createElement('p')).attr({
                                'id':'textarea_'+id,
                                'class':'komentar_text',
                                'data-id':id
                      }).text(isi);
        $.ajax({
          method: "POST",
          url: "Edit.php",
          data: { isi_komen:isi, id_komen:id , type:"update"},
          success: function(data){
            console.log(data);
            if(data == '0'){
              alert("anda harus login!");
            }else if(data == '1'){
              $('#textarea_'+id).replaceWith(text);
            }
          }
        });
      });
   </script>

            </div>


      </form>
      </div>

      </div>
      </div>

</body>
</html>

Kode Edit.php

<?php
  require_once("config.php");

if($_POST['type'] == 'update'){
  $query = "UPDATE timeline SET id=1 , Status='".$_POST['isi_komen'].
            "' WHERE id=".$_POST['id_komen'];
var_dump($_POST);
  die($query);
  if(mysqli_query($link, $query)){
    echo "1";
  }else{
    echo "-1";
  }
}
?>

Kode config.php

<?php

$db_host = "localhost";
$db_user = "root";
$db_pass = "";
$db_name = "headbook";

try {
    //create PDO connection
    $db = new PDO("mysql:host=$db_host;dbname=$db_name", $db_user, $db_pass);
} catch(PDOException $e) {
    //show error
    die("Terjadi masalah: " . $e->getMessage());
}

ajax php database

@Alam99

13 Kontribusi 0 Poin

Diperbarui 5 tahun yang lalu

1 Jawaban:

Jawaban Terpilih

Ganti data diajax jd text <pre> data: {isi_komen:text} </pre>

@bosque

187 Kontribusi 104 Poin

Dipost 5 tahun yang lalu

Tanggapan

muncul error JQuery: 'Uncaught TypeError: Illegal invocation' itu gimana bang??

@Alam99

kamu perbaiki dulu sintaksny, diajaxnya sdh benar data : isi_komen:isi. hasilnya undefined krn sintaks kamu ada yg salah.. coba perhatikan tanda kutipnya. bagian editny ganti jadi button bkn submit

@bosque

Terima Kasih

@Alam99