cara edit dengan ajax javascript php

mohon bantuanya sedikit kawan" saya mengalamin kendala dalam edit nya,sudah 2hari googling masih blm dapat solusinya kawan

 $conn = mysqli_connect('localhost','root','','latihan_ajax');

 <?php
include 'config.php';
$sql = mysqli_query($conn,"SELECT * FROM latihan_satu");

?>

<!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.1.3/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css">
    <title>JS - Onclick</title>
  </head>
  <body>
    <div class="container mt-5 mb-5">
      <div class="row justify-content-center">
        <div class="col-8">
          <div class="card rounded-0">
            <div class="card-header font-weight-bold rounded-0"><h3 class="mb-0">Data Provinsi</h3></div>
            <div class="card-body p-0 rounded-0">
              <table class="table table-striped table-hover rounded-0 p-0 m-0">
                <thead>
                  <tr>
                    <th></th>
                    <th>NO</th>
                    <th>NAMA PROVINSI</th>
                  </tr>
                </thead>
                <tbody>
                  <?php $nomor = 1; while ($row = mysqli_fetch_array($sql)) { ?>
                    <tr id="tr<?php echo $row['id'] ?>">
                      <td class="pl-4">
                        <div class="btn-toolbar" role="toolbar">
                          <div class="btn-group" role="group">
                            <button type="button" class="btn btn-primary btn-sm rounded-0" onclick="lihat(<?php echo $row['id'] ?>,'<?php echo $row['city'] ?>');">lihat</button>
                            <button type="button" class="btn btn-warning btn-sm rounded-0" onclick="edit(<?php echo $row['id'] ?>,'<?php echo $row['city'] ?>');">ubah</button>
                            <button type="button" class="btn btn-danger btn-sm rounded-0" onclick="hapus(<?php echo $row['id'] ?>,'<?php echo $row['city'] ?>');">hapus</button>
                          </div>
                        </div>
                      </td>
                      <td><?php echo $nomor ?></td>
                      <td id="text<?php echo $row['id'] ?>"><?php echo $row['city'] ?></td>
                    </tr>
                  <?php $nomor++; } ?>
                </tbody>
              </table>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="modal fade" id="modal">
      <div class="modal-dialog" role="document">
        <div class="modal-content rounded-0">
          <div class="modal-header">
            <h4 class="modal-title">Modal title</h4>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">×</span>
              <span class="sr-only">Close</span>
            </button>
          </div>
          <div class="modal-body rounded-0">
            <p>One fine body…</p>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-secondary btn-sm rounded-0" data-dismiss="modal" id="close">Close</button>
          </div>
        </div>
      </div>
    </div>
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
    <script type="text/javascript">
      function lihat(id, nama_provinsi) {
        $("#modal").modal({
          show:true
        });

        $(".modal-title").text("#" + id);
        $(".modal-body").html("<p>" + nama_provinsi + "</p>");
      }

      function hapus(id, nama_provinsi) {
        $("#modal").modal({
          show:true
        });

        $(".modal-title").text("Data ID #" + id);
        $(".modal-body").html("<p> Apakah Anda yakin ingin menghapus data " + nama_provinsi + "?</p>");
        $('<button type="button" class="btn btn-success btn-sm rounded-0" data-dismiss="modal" id="yes" onclick="remove('+id+');">Ya Hapus Data Ini</button>').insertBefore('#close');
      }

      function edit(id, nama_provinsi) {
        var attr  = $(document.createElement("input")).attr({"type":"text","value":nama_provinsi, 'data-id':id});
        $('#text'+id).html(attr);
        $('#tr'+id).find('.btn-group').html('<button type="button" id="tombol_'+id+'" class="btn btn-success btn-sm rounded-0" onclick="change()">Save</button>');

        }

      $(document).ready(function() {
        $(".close, #close").on('click', function(event) {
          event.preventDefault();
          $("#yes").remove();
        });
      });
      function remove(id) {
        $.ajax({
          url: 'action.php',
          type: 'POST',
          data: {post_id: id, type: 'delete'},
          success: function(str) {
            $('#tr'+id).closest('tr').find('td').fadeOut(1000,
              function(){
                $('#tr'+id).parents('tr:first').remove();
              }
            );
            $("#yes").remove();
            $("#modal").modal('toggle');
          }
        });
      }
      function change(id, nama_provinsi) {
        $.ajax({
          url: 'action.php',
          type: 'POST',
          data: {city_name: name, delete_id: id, type:'update'},
            success: function(data){
              if(data == 'success'){
                alert("succes")
              }else{
                alert("fail")
              }
          }

        });
      }
    </script>
  </body>
</html>


<?php
include 'config.php';

if ( isset($_POST['type'])=='delete' ) {
    $id  = $_POST['post_id'];
    mysqli_query($conn,"DELETE FROM latihan_satu WHERE id= $id");
}else if(isset($_POST['type'])=='update'){
    $id  = $_POST['delete_id'];
    $name = $_POST['city_name'];
    mysqli_query($conn, "UPDATE latihan_satu SET city='$name' WHERE id=$id");
}else {
    header('location:latihan1.php');
}
?>

php javascript jquery

@cylops

25 Kontribusi 1 Poin

Diperbarui 6 tahun yang lalu

2 Jawaban:

coba ini <pre> include 'config.php';

if ( isset($_POST['type'])=='delete' ) { $id = $_POST['post_id']; if(mysqli_query($conn,"DELETE FROM latihan_satu WHERE id= $id")) echo "success"; else echo "fail"; }else if(isset($_POST['type'])=='update'){ $id = $_POST['delete_id']; $name = $_POST['city_name']; if(mysqli_query($conn, "UPDATE latihan_satu SET city='$name' WHERE id=$id")) echo "success"; else echo "fail"; }else { header('location:latihan1.php'); } </pre>

@dianarifr

642 Kontribusi 316 Poin

Dipost 6 tahun yang lalu

coba dilihat errornya menggunakan console.log

di scriptnya:

<pre> function change(id, nama_provinsi) { $.ajax({ url: 'action.php', type: 'POST', data: {city_name: name, delete_id: id, type:'update'}, success: function(data){
console.log(data) } });
}); </pre>

dan di phpnya :

<pre> include 'config.php';

if ( isset($_POST['type'])=='delete' ) { $id = $_POST['post_id']; if(mysqli_query($conn,"DELETE FROM latihan_satu WHERE id= $id")) echo "success"; else echo "fail"; }else if(isset($_POST['type'])=='update'){ $id = $_POST['delete_id']; $name = $_POST['city_name']; $edit = mysqli_query($conn, "UPDATE latihan_satu SET city='$name' WHERE id=$id"); if($edit) echo "success"; else var_dump($edit); }else { header('location:latihan1.php'); } </pre>

@mhdadil

105 Kontribusi 61 Poin

Dipost 6 tahun yang lalu

Kelas Premium! Belajar Javascript untuk website

cara edit dengan ajax javascript php

Kelas Premium!
Belajar Javascript untuk website