Published October 31, 2019 by RIT with 0 comment

CARA OPER ID PADA MODAL BOOTSTRAP

Assalamualaikum warohmatullohi wabarokatuh.
Wa alaikum salam warohmatullohi wabarokatuh.

Berikut adalah cara oper id pada modal bootstrap, sebelum melanjutkan membaca, diharapkan telah mengerti tentang
  • koneksi database pada php
  • memahami script js dan jQuery
  • fungsi pada require_once
baik langsung saja, berikut scriptnya.

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<?php 
require_once'../hefo/header.php'; //pada require_once adalah tempat menampung css js bootstrap dan jquery serta koneksi db
 ?>
 
<!-- Trigger the modal with a button -->
<button type="button" class="btn btn-success openBtn" data-id='36'>Open Modal</button>
 
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">
        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Modal with Dynamic Content</h4>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </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>
 
<script>
$('.openBtn').on('click',function(){
    var id_tugas = $(this).attr('data-id');
    $('.modal-body').load('modal.php?id='+id_tugas,function(){
        $('#myModal').modal({show:true});
    });
});
</script>

?
1
2
3
4
5
6
7
8
<?php 
require_once"../core/init.php";
$id_t = $_GET["id"];
$a = mysqli_fetch_array( jel_ed($id_t) );
?>
 
<input type='text' value='<?php echo $a['id_t'];  ?>' readonly>
<input type='text' value='<?php echo $a['knt_t'];  ?>' readonly>



Terima Kasih.
Thank's.

Tag :
CRUD MODAL PHP | MEMBUAT CRUD PHP DENGAN MODAL BOOTSTRAP | CARA MEMBUAT EDIT DENGAN MODAL BOOTSTRAP | CARA OPER DATA ID PADA MODAL BOOTSTRAP | HOW TO REMOTE MODAL IN ANOTHER PAGE | HOW TO REMOTE MODAL BOOTSTRAP ANOTHER PAGE

Baca Juga :

Read More

, , ,

      edit
Published August 15, 2019 by RIT with 0 comment

CRUD AJAX PADA PHP


Assalamualaikum warohmatullohi wabarokatuh.
Wa alaikum salam warohmatullohi wabarokatuh.

kali ini akan berbagi script crud ( C.R.U.D ) AJAX dengan Jquery menggunakan PHP dan MySqli

Ajax crud ( C.R.U.D ) ada 2 yang bisa digunakan yaitu Ajax native (murni javascript) yang disertai dengan xml didalam jadi jika kita membuat script secara native kita harus membuat koneksi khusus untuk Ajax native ini. Dan yang kedua adalah Ajax dengan menggunakan library Jquery, dengan Ajax Jquery, script menjadi rapi dan mudah dibaca, JQuery adalah library menggunakan bahasa javascript yang memiliki fungsi-fungsi siap pakai, yang di dikembangkan oleh Jhon Resig untuk kali pertamanya di tahun 2006. kalian bisa download Jquery di situs resminya.


Ajax singkatan dari Asynchronous JavaScript and XML. Dasarnya Ajax menggunakan XMLHttpRequest Object JavaScript untuk membuat request ke server secara asynchronous atau melakukan refresh halaman website tanpa menekan tombol refresh pada browser.

Berikut adalah daftar script AJAX JQuery CRUD C.R.U.D dengan PHP :
untuk memulai tutorial CRUD C.R.U.D dengan PHP dan MySqli, kalian harus download jquery nya terlebih dahulu disini.

script ajax Create/insert dengan JQuery menggunakan php dan mysqli
script ajax Read/Select dengan JQuery menggunakan php dan mysqli
script ajax Update dan edit dengan JQuery menggunakan php dan mysqli
script ajax Delete dengan JQuery menggunakan php dan mysqli

Thank's
Terima Kasih.

Tag :
Cara crud | cara membuat crud | CRUD AJAX JQUERY | Cara membuat CRUD dengan ajax menggunakan php | membuat crud ajax php

Baca juga :
Read More

, ,

      edit
Published July 18, 2019 by RIT with 0 comment

CARA MENAMPILKAN GAMBAR DARI DATABASE KE MODAL BOOTSTRAP

Assalamualaikum warohmatullohi wabarokatuh.
Wa alaikum salam warohmatullohi wabarokatuh.

Episode ini akan berbagi script koding MENAMPILKAN GAMBAR DARI DATABASE ke modal Bootstrap sesuai dengan id.
-Disaat user klik tombol lihat/tombol detail
-Muncul Pop Up Modal yang berisi infomrasi tentang user yang ingin dilihat


-Buatlah folder didalam htdocs dengan nama modal_bootstrap
-Buatlah 2 file php. index.php dan form_edit_modal.php
-lalu Buatlah folder dengan nama img didalam folder modal_bootstrap
-seperti gambar di bawah ini struktur foldernya

-siapkan gambar atau foto yg bereksitensi PNG atau JPG.
-Dan simpan gambar tersebut kedalam folder img yang telah dibuat tadi
-sehingga seperti gambar di bawah ini.


-buatlah database test.selain itu bebas
-buatlah table pada database seperti gambar di bawah ini.


?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE html>
<html>
<head>
    <title></title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.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>
 
</head>
<body>
 
<?php 
    $koneksi = mysqli_connect('localhost','root','','test'); 
    $query   = "SELECT * FROM user";
    $query2   = mysqli_query($koneksi, $query);
?>
<br>
<br>
<br>
    <table border="1" width="100%">
        <tr>
            <td>id_db</td>
            <td>nama</td>
            <td>operation</td>
        </tr>
    <?php while ($row = mysqli_fetch_array($query2)){ ?>
        <tr>
        <td><?php echo $row['userid']; ?></td>
            <td><?php echo $row['firstname']; ?></td>
            <td>
          <a href="#id<?php echo $row['userid']; ?>" data-toggle="modal" class="btn btn-primary"><span class="glyphicon glyphicon-eye-open"></span> Lihat</a>
      <?php include('form_edit_modal.php'); ?>
        </td>
      </tr>
    <?php } ?>
    </table>
 
</body>
</html>
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
  <!-- Modal -->
  <div class="modal fade" id="id<?php echo $id=$row['userid'];  ?>" role="dialog">
          <?php 
            // $koneksi = mysqli_connect('localhost','root','','test'); 
              $q_modal   = "SELECT * FROM user WHERE userid = $id";
              $q_modal2  = mysqli_query($koneksi, $q_modal);
              $row2       = mysqli_fetch_array($q_modal2);
               
          ?>
 
    <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"><?php echo $row2["firstname"]; ?></h4>
        </div>
        <div class="modal-body">
          <img src="<?php echo $row2['picture']; ?>" width='50%' height='50%'><br>
          id  = <?php echo $row2["userid"]; ?><br>
          nama depan = <?php echo $row2["firstname"]; ?><br>
          nama belakang = <?php echo $row2["lastname"]; ?><br>
          alamat = <?php echo $row2["address"]; ?>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
       
    </div>
  </div>
   
</div>

Dan hasilnya akan seperti gambar dibawah ini.



Muncul modal saat klik tombol lihat.


Terima Kasih.
Thank's.

SOURCE : https://www.sourcecodester.com/php/11629/phpmysqli-crud-operation-bootstrapmodal.html

Tag :
cara oper data pada modal bootstrap | oper data pada modal | menampilkan gambar pada modal | how to passing data to modal in bootstrap |

Baca Juga :
  • LINK 1
  • LINK 2

Read More

, ,

      edit
Published July 16, 2019 by RIT with 0 comment

HOW TO UPDATE/EDIT AJAX IN PHP

CARA INSERT PHP dengan ajax Jquery

Assalamualaikum warohmatullohi wabarokatuh,
Wa alaikum salam warohmatullohi wabarokatuh.

Di episode sebelumnya memberikan koding cara menampilkan data pada php dengan dengan ajax Jquery,

dan pada episode kali ini akan memberikan kepada pembaca berupa koding edit data pada php dengan menggunakan ajax Jquery,

disaat user ingin mengubah data maka, user klik / menekan tombol edit yang ada pada tabel,

lalu user melihat data yang lama pada kolom input, setelah isi data yang terbaru, user klik tombol simpan / tombl update untuk memperbarui data yang lama atau data yang salah.

berikut script edit data pada php dengan ajax Jquery.


?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?php 
$koneksi = mysqli_connect('localhost','root','','test'); 
 
$q  = 'SELECT * FROM tb_siswa';
$q2 = mysqli_query($koneksi, $q);
 
?>
 
<table border="1" >
    <tr bgcolor="yellow" align="center">
        <td>NAME</td>
        <td>OPERATION</td>
    </tr>
 
<?php while ( $row = mysqli_fetch_array($q2)) { ?>
    <tr>
        <td><?php echo $row['nama']; ?></td>
        <td><button><a href="update_ajax_form.php?id=<?php echo $row['id']; ?>">edit</a></button></td>
    </tr>
<?php } ?>
 
</table>

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<?php 
$koneksi = mysqli_connect('localhost','root','','test');
$id = $_GET['id'];
$qu = "SELECT * FROM tb_siswa WHERE id='$id'";
$reu =mysqli_query($koneksi, $qu);
$row =mysqli_fetch_array($reu);
?>
<script type="text/javascript" src="jquery.js"></script>
 
<form method='POST' class='formUpdate'>
 
  <input type='text' name="nama" value='<?php echo $row['nama']; ?>'>
  <input type='hidden' name="id" value='<?php echo $row['id']; ?>'>
  <input type='submit'  class='btn_update' value='update'>
 
</form>
 
<script type="text/javascript">
  $(document).ready(function(){
    $(".btn_update").click(function(id){
           var data = $('.formUpdate').serialize();
            $.ajax({
              type: 'POST',
              data: data,
              url: "update_proses.php",
              success: function(){
                location.href="index.php";
              } 
          });       
      });
  });
</script>

?
1
2
3
4
5
6
7
8
9
<?php
$koneksi = mysqli_connect('localhost','root','','test'); 
 
$id   = $_POST['id'];
$nama = $_POST['nama'];
$query    = "UPDATE tb_siswa SET nama='$nama' WHERE id='$id'";
$query2   = mysqli_query($koneksi,$query);
return $query2;
 ?>



berikut hasil dari koding diatas :




pada gambar ini saat user memilih data yg ingin di edit / update, makan akan tampil nama yg ingin di edit atau rubah.



user menambahkan tulisan update di akhir namanya, lalu tekan atau klik tombol update untuk memperbarui datanya



dan hasilnya adalah pada nama yg barusan telah di edit akan bertambah tulisan update sesuai yg di tulis sebelumnya, bisa dilihat pada gambar yg berkotak warna merah


Terima Kasih.
Thank's

BACA JUGA :


TAGS :
CARA UPDATE DAN EDIT DATA DENGAN AJAX JQUERY | CARA UPDATE FORM DENGAN AJAX | SCRIPT UPDATE AJAX PHP | CARA UPDATE AJAX DENGAN JQUERY | CARA UPDATE PHP DENGAN AJAX | CARA AJAX UPDATE DENGAN PHP | CARA AJAX UPDATE DENGAN JQUERY | HOW TO UPDATE PHP WITH AJAX

Read More

, , ,

      edit
Published July 05, 2019 by RIT with 0 comment

HOW TO CREATE DATABASE IN PHPMYADMIN

Assalamualaikum Warohmatullohi wabarokatuh
Wa alaikumsalam warohmatullohi wabarokatuh

CARA MEMBUAT DATABASE DI PHPMYADMIN
 How to create database in php myadmin
Buka XAMPP, bisa lihat disini cara membuka XAMPP nya.
setelah terbuka tampilan nya akan seperti ini.

Klik atau pilih tombol start yang lurus dengan tulisan APACHE dan MYSQL
jika sudah di klik tampilannya akan seperti gambar di bawah ini.

lalu buka browser terserah chrome, mozilla(firefox),dll
dan tulis / ketik alamat localhost/ di bar url ,lalu tekan enter
lalu pilih menu phpMyadmin.
Tampilan akan seperti gambar di bawah ini.

Setelah pilih menu PhpMyadmin maka tampilan akan seperti ini.

lalu pilih atau klik baru seperti di gambar bawah ini. untuk membuat database baru.

isi kan nama database nya, saya memberikan nama db_tutorial
lalu pilih/ klik tombol buat.

setelah pilih dan klik tombol buat, tampilan akan seperti ini,
lalu buat table nya. Bisa anda lihat disini Cara membuat table di database.


Terima Kasih
Thank's

cara membuat database di phpMyadmin | cara membuat database di php myadmin |

cara membuka xampp cara membuat table di database

Read More
      edit
Published July 03, 2019 by RIT with 0 comment

HOW TO LOAD DATA USING AJAX IN PHP

Assalamualaikum warohmatullohi wabarokatuh,
Wa alaikum salama warohmatullohi wabarokatuh,

cara menampilkan data dari database dengan ajax
load data php with ajax jquery

1 - buatlah file index.php
2 - buat file lagi dengan nama read_proses.php
3 - copy script dibawah ini sesuaikan dengan file index.php dan read_proses.php

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<script type="text/javascript" src="jquery.js"></script>
 
    <div class="data_kita">
        <!-- DISINI AKAN MENAMPILKAN DATA DARI DB MYSQL -->
    </div>
 
<script type="text/javascript">
  $(document).ready(function(){
        app = {
            show: function(){
                $(".data_kita").load("read_proses.php",{type: 'view'}, function(response){
                    $('.data_kita').html(response);
                });
            }
        }
        app.show()
 
          });
 
</script>
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?php 
 
$koneksi = mysqli_connect('localhost','root','','test'); 
$q  = 'SELECT * FROM tb_siswa';
$q2 = mysqli_query($koneksi, $q);
 
?>
 
<table border="1" class="data_kita">
    <tr bgcolor="yellow" align="center">
        <td>id</td>
        <td>NAME</td>
    </tr>
 
<?php while ( $row = mysqli_fetch_array($q2)) { ?>
    <tr>
        <td><?= $row['id']; ?></td>
        <td><?= $row['nama']; ?></td>
    </tr>
 
<?php } ?>
</table>

Terima Kasih
Thank's

TAG TAGS :
cara menampilkan data dari database dengan ajax | menampilkan data dari database | menampilkan data dengan ajax di php | Menampilkan Data dari Database dengan AJAX jQuery | load data with ajax | load data from database without refresh page | ajax retrieve data from database | HOW TO LOAD DATA USING AJAX IN PHP


BACA JUGA :

SOURCE :
https://kursuswebdesign.org/cara-menampilkan-data-dari-database-dengan-ajax-jquery

Read More

, , ,

      edit
Published June 30, 2019 by RIT with 0 comment

HOW TO INSERT AJAX IN PHP

Assalamualaikum warohmatullohi wabarokatuh,
Wa alaikum salama warohmatullohi wabarokatuh,

cara input data dengan ajax
how to insert ajax in php

1 - buatlah file index.php
2 - buat file lagi dengan nama create_proses.php
3 - copy script dibawah ini sesuaikan dengan file index.php dan create_proses.php

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<?php 
$koneksi = mysqli_connect('localhost','root','','test');
?>
<script type="text/javascript" src="jquery.js"></script>
 
<!-- form untuk menambah data -->
<form method='post' class='form-input'>
    <input type='text' name='nama' >
    <input type='submit' class='save' value='submit'>
</form>
 
<!-- script menampilkkan data -->
<?php 
$q  = 'SELECT * FROM tb_siswa';
$q2 = mysqli_query($koneksi, $q);
 
?>
 
<table border="1" >
    <tr bgcolor="yellow" align="center">
        <td>NAME</td>
    </tr>
 
<?php while ( $row = mysqli_fetch_array($q2)) { ?>
    <tr>
        <td><?php echo $row['nama']; ?></td>
    </tr>
<?php } ?>
 
</table>
 
<!-- script jquery ajax input data -->
<script type="text/javascript">
  $(document).ready(function(){
      $(".save").click(function(id){
        
           var data = $('.form-input').serialize();
           var notif = alert('insert success ... !!!');
        
            $.ajax({
              type: 'POST',
              url: "create_proses.php",
              cache: false,
              data: data,
              success: function(notif){
                  location.reload();
                }
            });
          });
      });
</script>

?
1
2
3
4
5
6
7
<?php 
require_once 'index.php';
$nama   = $_POST['nama'];
$query  = "INSERT INTO tb_siswa (nama) VALUES ('$nama')";
$query2 = mysqli_query($koneksi,$query);
return $query2;
 ?>



berikut adalah hasil dari script ajax php.


Terima Kasih
Thank's

TAG TAGS :
how to insert ajax php | cara input data dengan ajax | cara insert data dengan ajax php | cara menampilkan data tanpa refresh | input data ke database tanpa refresh | script sederhana crud ajax php | script simple crud ajax php | script crud php | script crud php ajax | download script ajax | scripts ajax jquery | script ajax jquery | how to insert ajax in php | how to insert ajax in html | script insert php ajax | how to insert ajax loader | how to insert data using ajax in php | how to insert using ajax in php | how to add ajax in php | PHP Ajax Scripts | Free PHP Ajax Scripts | PHP Ajax Downloads |


BACA JUGA :

Read More

, , , ,

      edit
Subscribe to: Comments (Atom)