Belajar CRUD Dengan jQuery EasyUI Part 3

Hallo Sahabat, selamat datang kembali dalam website Dumetschool, Website yang akan membantu kalian seputar pemograman. Dalam kesempatan kali ini kita akan melanjutkan tentang Belajar CRUD Dengan jQuery EasyUI Part 3. Dan sampai pada tahap ini kita sudah belajar menambahkan serta menampilkan data. Lalu selanjutnya kita akan membuat proses update dan delete data. Bagaimana proses membuatnya yuk mari langsung saja simak langkah-langkah berikut ini:Langkah pertama sahabat bisa menambahkan script fungsi seperti dibawah:

function editUser(){<br />
            var row = $(‘#dg’).datagrid(‘getSelected’);<br />
            if (row){<br />
                $(‘#dlg’).dialog(‘open’).dialog(‘setTitle’,’Edit Data’);<br />
                $(‘#fm’).form(‘load’,row);<br />
                url = ‘update_user.php?id=’+row.id;<br />
            }<br />
        }

function editUser(){

var row = $(‘#dg’).datagrid(‘getSelected’);

if (row){

$(‘#dlg’).dialog(‘open’).dialog(‘setTitle’,‘Edit Data’);

$(‘#fm’).form(‘load’,row);

url = ‘update_user.php?id=’+row.id;

}

Jika sudah buat sebuah file dengan nama = update_user.php berikut code perintah query update sql nya:

<?php</p>
<p>$id = intval($_REQUEST[‘id’]);<br />
$nis = htmlspecialchars($_REQUEST[‘nis’]);<br />
$nama = htmlspecialchars($_REQUEST[‘nama’]);<br />
$alamat = htmlspecialchars($_REQUEST[‘alamat’]);<br />
$telp = htmlspecialchars($_REQUEST[‘telpon’]);</p>
<p>include ‘conn.php’;</p>
<p>$sql = “update data_siswa set nis=’$nis’,nama=’$nama’,alamat=’$alamat’,telpon=’$telp’ where id=$id”;<br />
$result = @mysql_query($sql);<br />
if ($result){<br />
	echo json_encode(array(<br />
		‘id’ => $id,<br />
		‘nis’ => $nis,<br />
		‘nama’ => $nama,<br />
		‘alamat’ => $alamat,<br />
		‘telpon’ => $telp<br />
	));<br />
} else {<br />
	echo json_encode(array(‘errorMsg’=>’Some errors occured.’));<br />
}<br />
?>

<?php

$id = intval($_REQUEST[‘id’]);

$nis = htmlspecialchars($_REQUEST[‘nis’]);

$nama = htmlspecialchars($_REQUEST[‘nama’]);

$alamat = htmlspecialchars($_REQUEST[‘alamat’]);

$telp = htmlspecialchars($_REQUEST[‘telpon’]);

include ‘conn.php’;

$sql = “update data_siswa set nis=’$nis’,nama=’$nama’,alamat=’$alamat’,telpon=’$telp’ where id=$id”;

$result = @mysql_query($sql);

if ($result){

echo json_encode(array(

‘id’ => $id,

‘nis’ => $nis,

‘nama’ => $nama,

‘alamat’ => $alamat,

‘telpon’ => $telp

));

} else {

echo json_encode(array(‘errorMsg’=>‘Some errors occured.’));

}

Jika sudah coba lakukan edit dengan klik salah satu data lalu tekan button edit data,Â apabila benar maka akan muncul data pada form modal popup seperti tampilan berikut ini:

Baiklah sekarang saat kita membuat proses delete data ,coba sahabat tambahkan script javascript berikut dengan fungsi destroyUser

function destroyUser(){<br />
            var row = $(‘#dg’).datagrid(‘getSelected’);<br />
            if (row){<br />
                $.messager.confirm(‘Confirm’,’Apakah Yakin Akan Hapus Data?’,function(r){<br />
                    if (r){<br />
                        $.post(‘delete_siswa.php’,{id:row.id},function(result){<br />
                            if (result.success){<br />
                                $(‘#dg’).datagrid(‘reload’);    // reload data siswa<br />
                            } else {<br />
                                $.messager.show({   // tampilkan pesan error<br />
                                    title: ‘Error’,<br />
                                    msg: result.errorMsg<br />
                                });<br />
                            }<br />
                        },’json’);<br />
                    }<br />
                });<br />
            }<br />
        }

function destroyUser(){

var row = $(‘#dg’).datagrid(‘getSelected’);

if (row){

$.messager.confirm(‘Confirm’,‘Apakah Yakin Akan Hapus Data?’,function(r){

if (r){

$.post(‘delete_siswa.php’,{id:row.id},function(result){

if (result.success){

$(‘#dg’).datagrid(‘reload’); // reload data siswa

} else {

$.messager.show({ // tampilkan pesan error

title: ‘Error’,

&nb

sumber :kursuswebprogramming.com/blog/

(Visited 9 times, 1 visits today)

Leave a Reply Cancel reply