Bloglieken: Baca Juga

Tampilkan postingan dengan label Baca Juga. Tampilkan semua postingan

Jumat, 19 Agustus 2011

Membuat menu dengan JSCookMenu

11.54

alie

No comments

Berikut adalah cara untuk membuat menu dengan JSCookMenu :

Pertama-tama download dahulu library jscookmenu yang terbaru dan ThemeOffice2003 silahkan download disini
Setelah library dan theme sudah didownload, buatlah folder dengan nama DEMO
Extract library jscookmenu, Extract Here

setelah diextract terdapat 2 file yaitu effect.js, JSCookMenu.js.

Copy dua file tersebut dan taruh didalam folder DEMO
Setelah itu Extract Theme yang sudah didownload ThemeOffice2003 Extract Here

Setelah diextract taruh hasil extract didalam folder DEMO
Buatlah folder images didalam folder DEMO, dan simpan icon dibawah ini didalam folder images.
kira-kira isi dari folder DEMO seperti gambar dibawah ini, silahkan dicocokkan dengan punya anda.

Buatlah file dengan nama menu.html
Copy kode dibawah ini

<!--- menu js cook sesuaikan dengan folder anda--->
<script type="text/javascript" src="effect.js"></script>
<script type="text/javascript" src="JSCookMenu.js"></script>
<link rel="stylesheet" href="ThemeOffice2003/theme.css" type="text/css">
<script type="text/javascript" src="ThemeOffice2003/theme.js"></script>

<table border="0" width="100%">
    <tr>
        <td valign="middle" style="background-color:<?php echo BGMN;?>; height:30px;">
            <div id="myMenuID">
                <script type="text/javascript"><!--
                var myMenu =
                [
                    ['<img src="images/icon.png" width="16" height="16" />', ' Home', '?menu=home', '_self', ' Home'],
                    _cmSplit,
                    ['<img src="images/icon.png" width="16" height="16" />', ' System Setting', '', '_self', ' System Setting',
                        ['<img src="images/icon.png" width="16" height="16" />', ' Setting Banner', '?menu=setting_banner', '_self', ' Setting Banner'],
                        ['<img src="images/icon.png" width="16" height="16" />', ' Setting Text Banner', '?menu=setting_text_banner', '_self', ' Setting Text Banner',
                            ['<img src="images/icon.png" width="16" height="16" />', ' Setting Text Footer', '?menu=setting_text_footer', '_self', ' Setting Text Footer'],
                            ['<img src="images/icon.png" width="16" height="16" />', ' Setting Text Footer', '?menu=setting_text_footer', '_self', ' Setting Text Footer'],
                            ['<img src="images/icon.png" width="16" height="16" />', ' Setting Text Footer', '?menu=setting_text_footer', '_self', ' Setting Text Footer']
                        ],
                        ['<img src="images/icon.png" width="16" height="16" />', ' Setting Text Footer', '?menu=setting_text_footer', '_self', ' Setting Text Footer'],
                        ['<img src="images/icon.png" width="16" height="16" />', ' Setting Text Halaman Utama', '?menu=setting_text_halaman_utama', '_self', ' etting Text Halaman Utama'],
                        ['<img src="images/icon.png" width="16" height="16" />', ' Setting System Template', '?menu=setting_system_template', '_self', ' etting System Template'],
                        ['<img src="images/icon.png" width="16" height="16" />', ' Setting favicon', '?menu=setting_favicon', '_self', ' Setting favicon'],
                        ['<img src="images/icon.png" width="16" height="16" />', ' Setting Title', '?menu=setting_title', '_self', ' Setting Title'],
                        ['<img src="images/icon.png" width="16" height="16" />', ' Setting Languages', '?menu=setting_languages', '_self', ' Setting Languages'],
                        ['<img src="images/icon.png" width="16" height="16" />', ' Setting Menu Template', '?menu=setting_menu_template', '_self', ' Setting Menu Template'],
                        ['<img src="images/icon.png" width="16" height="16" />', ' Setting Background Template', '?menu=setting_background_template', '_self', ' Setting Background Template'],
                        ['<img src="images/icon.png" width="16" height="16" />', ' Setting Background Content', '?menu=setting_background_content', '_self', ' Setting Background Content'],
                        ['<img src="images/icon.png" width="16" height="16" />', ' Manajemen Menu Part 3', '?menu=setting_menu3', '_self', ' Manajemen Menu Part 3']
                    ],
                    _cmSplit,
                    ['<img src="images/icon.png" width="16" height="16" />', ' Logout', '?menu=home', '_self', ' Logout']
                ];
                cmDraw ('myMenuID', myMenu, 'hbr', cmThemeOffice2003, 'ThemeOffice2003');
                --></script>
            </div>
        </td>
    </tr>
</table>

Isi folder DEMO, hasil akhir
SELESAI, SEMOGA BERHASIL...!!!

06.59

alie

11 comments

Menampilkan data di Flexigrid sangatlah mudah apabila kita tahu caranya.

Berikut adalah contoh menggunakan Flexigrid.
Langkah-langkah instalasi :

Download library flexigrid disini
Setelah flexigrid didownload extract melalui WinRAR, Extract Here

Hasil extract kalau di buka kira-kira isinya seperti gambar dibawah ini
Setelah Flexigrid di Extract buatlah folder baru dengan nama DEMO dan hasil extrakan tadi ditaruh di dalam folder DEMO, dan buat folder images didalam folder DEMO, didalam Folder DEMO apabila dibuka maka isinya seperti gambar dibawah ini.
gambar dibawah ini simpan dan taruh didalam folder images

apabila folder images dibuka kira-kira isinya seperti gambar dibawah ini
Langkah selanjutnya yaitu membuat database bernama apotek dan buatlah tabel dengan nama jenis_obat fieldnya yaitu : id_jenis_obat,jenis_obat

setelah database dan tabel jenis obat dibuat, langkah selanjutnya yaitu membuat file data.php
Copy kode dibawah ini

<?php
$nameserver = "localhost";
$username = "root";
$password = "123456";
$dbname = "apotek";
mysql_connect($nameserver,$username,$password);
mysql_select_db($dbname);

function alert($pesan) {
	echo "
		<script language=\"javascript\">
			alert('".$pesan."');
		</script>	
	";
}
function loncat($url) {
	echo "
		<script language=\"javascript\">
			window.location = \"".$url."\";
		</script>	
	";
}

function cek($sql) {
	$sql = $sql;
	$query = mysql_query($sql);
	$numrows = mysql_num_rows($query);
	return $numrows;
}

if(isset($_POST["tombol"])){
	if($_POST["tombol"]=="Simpan"){
		$cek = cek("select * from jenis_obat where jenis_obat = '$_POST[jenis_obat]'");
		if ($cek < 1) {
			$sql = "insert into jenis_obat ".
					"	(jenis_obat) ".
					"	values ".
					"	('$_POST[jenis_obat]') ";
			$query = mysql_query($sql);
		
			alert("Simpan Jenis Obat sukses");
			loncat("data.php");
		} else {
			alert("Simpan Jenis Obat gagal \\n Jenis Obat $_POST[jenis_obat] sudah ada");
			loncat("data.php");
		}
	}
	if($_POST["tombol"]=="Update"){
		$cek = cek("select * from jenis_obat where id_jenis_obat != '$_POST[id_jenis_obat]' and jenis_obat = '$_POST[jenis_obat]' ");
			
		if ($cek < 1) {
			$sql = "update jenis_obat ".
					"	set jenis_obat = '$_POST[jenis_obat]' ".
					"	where id_jenis_obat = '$_POST[id_jenis_obat]' ".
					" ";
			$query = mysql_query($sql);
			alert(" Data Jenis Obat sudah diupdate ");
			loncat("data.php");	
		} else {
			alert(" Data Jenis Obat gagal diupdate \\n Jenis Obat $_POST[jenis_obat] sudah ada ");
			loncat("data.php");	
		}
	}
}
?>
<!--- flexgrid, sesuaikan dengan folder anda--->
<script type="text/javascript" src="flexigrid/lib/jquery/jquery.js"></script>
<script type="text/javascript" src="flexigrid/flexigrid.js"></script>
<link rel="stylesheet" href="flexigrid/css/flexigrid/flexigrid.css" type="text/css">

<style>
	/*************************************************************/
	/*Penambahan images pada button, sesuaikan dengan folder anda*/
	/*************************************************************/
	body {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
	}
	.flexigrid div.fbutton .add {
			background: url(images/add.png) no-repeat center left;
	}	
	.flexigrid div.fbutton .edit {
			background: url(images/edit.png) no-repeat center left;
	}	
	.flexigrid div.fbutton .delete {
			background: url(images/delete.png) no-repeat center left;
	}	
</style>

<div style="margin-left:25px; margin-top:30px">
<table id="flex1" style="display:none"></table>
</div>

<script type="text/javascript">
			
	$("#flex1").flexigrid
	(
	{
	//--sesuaikan dengan nama file anda
	url: 'data_flexgrid.php', 
	dataType: 'json',
	colModel : [
		{display: 'ID', name : 'id_jenis_obat', width : 40, sortable : true, align: 'center'},
		{display: 'Jenis Obat', name : 'jenis_obat', width : 80, sortable : true, align: 'left'}
		],
	buttons : [
		{name: 'Add', bclass: 'add', onpress : action},
		{name: 'Edit', bclass: 'edit', onpress : action},
		{name: 'Delete', bclass: 'delete', onpress : action},
		{separator: true}
		],
	searchitems : [
		{display: 'ID', name : 'id_jenis_obat'},
		{display: 'Jenis Obat', name : 'jenis_obat', isdefault: true}
		],
	singleSelect: true,
	sortname: "id_jenis_obat",
	sortorder: "asc",
	usepager: true,
	title: 'Jenis Obat',
	useRp: true,
	rp: 5,
	showTableToggleBtn: true,
	width: 700,
	height: 150
	}
	);

	function action(com,grid)
	{
		if (com == 'Delete')
			if($('.trSelected',grid).length>0){
				if(confirm('PERINGATAN : Hapus ' + $('.trSelected',grid).length + ' baris ?')){
					var items = $('.trSelected',grid);
					var itemlist ='';
					for(i=0;i<items.length;i++){
						itemlist+= items[i].id.substr(3)+",";
					}
					$.ajax({
						type: "POST",
						dataType: "json",
						url: "data_hapus.php",
						data: "items="+itemlist,
						success: function(data){
							//alert("Query: "+data.query+" - Total affected rows: "+data.total);
							alert("Data yang dihapus : "+data.total);
							$("#flex1").flexReload();
						}
					});
				}
			} else {
				return false;
			} 
		else if (com == 'Edit')
			{
				var items = $('.trSelected',grid);
				var itemlist ='';
				for(i=0;i<items.length;i++){
					itemlist+= items[i].id.substr(3)+",";
				}
				//confirm('Edit ' + $('.trSelected',grid).length + ' items? : ' + itemlist )
				//--sesuaikan dengan nama file anda
				$('#tampil').load("data_edit.php?id_jenis_obat="+itemlist);
			}
		else if (com == 'Add') {
			//--sesuaikan dengan nama file anda
			$('#tampil').load("data_tambah.php");
		}
	}
	
</script>
<div id="tampil"></div>

Buat file data_edit.php
Copy kode dibawah ini

<?php
$nameserver = "localhost";
$username = "root";
$password = "123456";
$dbname = "apotek";
mysql_connect($nameserver,$username,$password);
mysql_select_db($dbname);

$id_jenis_obat = explode(",",$_GET[id_jenis_obat]);
$id_jenis_obat = $id_jenis_obat[0];

$sql = "select * from jenis_obat where id_jenis_obat = '$id_jenis_obat' ";
$query = mysql_query($sql);
$fetch = mysql_fetch_object($query);
?>
<form action="" method="post">
<div id="toggleText" style="display: block;">
    <div class="box">
        <div class="topleft">
            <div class="topright">
                <div>
                    <table>
                        <tr>
                            <td colspan="2"><h3>Edit Jenis Obat</h3></td>
                        </tr>
                        <tr>
                            <td>Jenis Obat</td>
                            <td>: 
                            	<input type="text" name="jenis_obat" value="<?=$fetch->jenis_obat;?>">
                                <input type="hidden" name="id_jenis_obat" value="<?=$fetch->id_jenis_obat;?>">
                            </td>
                        </tr>
                        <tr>
                            <td> </td>
                            <td>
                            	  <input type="submit" name="tombol" value="Update">
                            	  <input type="button" name="batal" value="Batal" onclick="javascript:window.location='data.php';">
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
        <div class="bottomleft">
            <div class="bottomright"> </div>
        </div>
    </div>
</form>

Buat file dengan nama data_flexgrid.php
Copy kode dibawah ini

<?php
$nameserver = "localhost";
$username = "root";
$password = "123456";
$dbname = "apotek";
mysql_connect($nameserver,$username,$password);
mysql_select_db($dbname);

error_reporting(1);
function runSQL($rsql) {
	$result = mysql_query($rsql) or die ('test'); 
	return $result;
	mysql_close($connect);
}

function countRec($fname,$tname,$where) {
	$sql = "SELECT count($fname) FROM $tname $where";
	$result = runSQL($sql);
	while ($row = mysql_fetch_array($result)) {
		return $row[0];
	}
}

$page = $_POST['page'];
$rp = $_POST['rp'];
$sortname = $_POST['sortname'];
$sortorder = $_POST['sortorder'];

if (!$sortname) $sortname = 'id_jenis_obat';
if (!$sortorder) $sortorder = 'desc';

$sort = "ORDER BY $sortname $sortorder";

if (!$page) $page = 1;
if (!$rp) $rp = 5;

$start = (($page-1) * $rp);

$limit = "LIMIT $start, $rp";

$query = $_POST['query'];
$qtype = $_POST['qtype'];

$where = "";
if ($query) $where = " WHERE $qtype LIKE '%$query%' ";

$sql = "SELECT id_jenis_obat,jenis_obat FROM jenis_obat $where $sort $limit";
$query = mysql_query($sql);

$total = countRec("id_jenis_obat","jenis_obat $where");

header("Expires: Mon, 26 Jul 1997 05:00:00 GMT" ); 
header("Last-Modified: " . gmdate( "D, d M Y H:i:s" ) . "GMT" ); 
header("Cache-Control: no-cache, must-revalidate" ); 
header("Pragma: no-cache" );
header("Content-type: text/x-json");
$json = "";
$json .= "{\n";
$json .= "page: $page,\n";
$json .= "total: $total,\n";
$json .= "rows: [";
$rc = false;
while ($row = mysql_fetch_array($query)) {
	if ($rc) $json .= ",";
	$json .= "\n{";
	$json .= "id:'".$row['id_jenis_obat']."',";
	$json .= "cell:['".$row['id_jenis_obat']."'";
	$json .= ",'".$row['jenis_obat']."']";
	$json .= "}";
	$rc = true;		
}
$json .= "]\n";
$json .= "}";
echo $json;
?>

Buat file data_hapus.php
Copy kode dibawah ini

<?
$nameserver = "localhost";
$username = "root";
$password = "123456";
$dbname = "apotek";
mysql_connect($nameserver,$username,$password);
mysql_select_db($dbname);

error_reporting(0);
function runSQL($rsql) {
	$result = mysql_query($rsql) or die ('test'); 
	return $result;
	mysql_close($connect);
}
$items = rtrim($_POST['items'],",");
$sql = "DELETE FROM jenis_obat WHERE id_jenis_obat IN ($items)";

$total = count(explode(",",$items)); 
$result = runSQL($sql);
$total = mysql_affected_rows();

header("Expires: Mon, 26 Jul 1997 05:00:00 GMT" );
header("Last-Modified: " . gmdate( "D, d M Y H:i:s" ) . "GMT" );
header("Cache-Control: no-cache, must-revalidate" );
header("Pragma: no-cache" );
header("Content-type: text/x-json");
$json = "";
$json .= "{\n";
$json .= "query: '".$sql."',\n";
$json .= "total: $total,\n";
$json .= "}\n";
echo $json;
?>

Buat file dengan nama data_tambah.php
Copy kode dibawah ini

<form action="" method="post">
<div id="toggleText" style="display: block">
    <div class="box">
        <div class="topleft">
            <div class="topright">
                <div>
                    <table>
                        <tr>
                            <td colspan="2"><h3>Tambah Jenis Obat</h3></td>
                        </tr>
                        <tr>
                            <td>Jenis Obat</td>
                            <td>: <input type="text" name="jenis_obat"></td>
                        </tr>
                        <tr>
                            <td> </td>
                            <td>
                            	  <input type="hidden" name="p" value="<?=$_GET[p];?>">
                            	  <input type="submit" name="tombol" value="Simpan">
                            	  <input type="button" name="batal" value="Batal" onclick="javascript:window.location='data.php';">
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
        <div class="bottomleft">
            <div class="bottomright"> </div>
        </div>
    </div>
</form>

Kalau file sudah dibuat semua maka isi dari folder DEMO seperti gambar dibawah ini

SELESAI,,,SEMOGA BERHASIL..!!!

Cara Menyimpan File Java Script di Google Code

13.51

alie

1 comment

Apabila anda ingin menyimpan file javascript di web hosting yang gratisan Google Code adalah web hosting yang paling tepat, Google Code adalah web milik google yang memberikan jasa hosting atau penyimpanan data di internet dengan gratis.

Langkah-langkahnya adalah sebagai berikut :

Silahkan login ke blogger.com dahulu.
Buka website Google Code
Klik "New Project"
Lalu isilah form yang kosong untuk membuat account baru, jika sudah klik "Creating Project"
lalu anda akan masuk ke halaman google code yang baru saja kita buat. Untuk mengupload file java script, silakan menuju ke menu Download.
Lalu klik "New Download".
Isi form tentang file java script yang akan kita upload. Apabila selesai, klik "Submit File".
File Java Script telah selesai di upload. Untuk mendapatkan alamat url java script klik saja pada nama file.
Lalu, akan terbuka halaman seperti berikut, dan klik kanan pada file lalu pilih Copy link address/Location.
Simpan kodenya dengan format:
<script src='ALAMAT LINK FILE JS ' type='text/javascript'/>

Belajar PHP

19.11

alie

No comments

Belajar PHP Yuk...

<------------Mudah Praktis Simpel------------->
Dijamin Bisa

Pertemuan Pertama

GET

POST

SESSION

FILES

Silahkan download pertemuan pertama.

Pertemuan Kedua
Pertemuan Keempat
Pertemuan Kelima

Instalasi FCKeditor

07.29

alie

No comments

Kita sebagai programer PHP tentunya tidak asing dengan folder htdocs, kalau kita ingin menghostingkan website kita juga membutuhkan domain name. Domain adalah nama dari alamat website seperti www.google.com. Domain seperti ini disebut TLD (Top Level Domain). kita bisa menilai antara htdocs dan domain intinya sih sama untuk membuka halaman website atau aplikasi yang berjenis php.
Contoh :
isi websiter : index.php
diletakkan di dalam folder
1. htdocs, dalam pemanggilan alamatnya : http://localhost
2. domain (misal : www.namadomain.com) : http://www.namadomain.com

Membuat subdomain
Contoh : ingin membuat subdomain yang bernama subdomain, nantinya folder subdomain di letakkan di dalam htdocs untuk local dan domain(ditempat hosting)
1. htdocs, dalam pemanggilan alamatnya : http://localhost/subdomain
2. domain (misal : www.namadomain.com) : http://www.namadomain.com/subdomain

Informasi diatas untuk gambaran letak folder-folder yang ada didalam htdocs/domain, karena fckeditor untuk filemanager perlu pengaturan FilesPath yang ada di dalam folder : fckeditor\editor\filemanager\browser\default\connectors\php\config.php. nanti kita akan mencoba mengatur config.php

Instalasi FCKEDITOR
1. Download fckeditor
2. extract fckeditor
3. setelah di extract buat folder fckeditor di dalam folder htdocs/domain
4. copy dan paste hasil extractkan di dalam folder fckeditor

Setelah selesai melakukan instalasi kita bisa mengaksesnya melalui alamat :
1. http://localhost/fckeditor (untuk local)
2. http://www.namadomain.com/fckeditor
kita bisa melihat contoh-contohnya di folder _samples

Sebelum adanya pengaturan di config.php kita tidak bisa upload image lewat filemanager dan peletakkan image mungkin kita kurang tahu pasti berada dimana

Cara mengatur UserFilesPath
1. Buka config.php berada di folder : fckeditor\editor\filemanager\browser\default\connectors\php\config.php
2. Cari barisan : $Config['UserFilesPath'] = '/userfiles/' ; dan ganti filepath sesuai kebutuhan kita
misal : $Config['UserFilesPath'] = '/fckeditor/tempatgambar' ; gambar diletakkan di folder tempatgambar yang berada didalam folder fckeditor
Mungkin kita bingung dengan alamat path tersebut untuk lebih jelasnya bisa dilihat contoh berikut :
1. http://localhost/fckeditor
pengaturan : $Config['UserFilesPath'] = '/fckeditor/tempatgambar' ;
2. http://www.namadomain.com/fckeditor
pengaturan : $Config['UserFilesPath'] = '/fckeditor/tempatgambar' ;

Apabila kita menempatkan langsung file fckeditor didalam htdocs/domain tanpa folder penampungnya, maka pengaturannya bisa dilihat kira-kira seperti ini :
1. http://localhost
pengaturan : $Config['UserFilesPath'] = '/tempatgambar' ;
2. http://www.namadomain.com
pengaturan : $Config['UserFilesPath'] = '/tempatgambar' ;

Cara menggunakan FCKEDITOR
yang perlu diperhatikan adalah :
include_once("fckeditor/fckeditor.php") ;
dan
$oFCKeditor->BasePath = '/fckeditor/' ; kalau file fckeditor didalam folder DEMO maka $oFCKeditor->BasePath = '/DEMO/fckeditor/' ;

Contoh :

<php
include_once("fckeditor/fckeditor.php") ; //letak class fckeditor.php
?>
<html>
<head>
<title>FCKeditor - Sample</title>
</head>
<body>
<form action="sampleposteddata.php" method="post" target="_blank">
<php?
$oFCKeditor = new FCKeditor('FCKeditor1') ;
$oFCKeditor->BasePath = '/DEMO/fckeditor/' ; // letak path dimana file-file fckeditor di letakkan (diawalai dari htdocs/domain, ingat htdocs/domain tidak dituliskan juga)
$oFCKeditor->Value = '<p>This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">FCKeditor</a>.</p>' ;
$oFCKeditor->Create() ;
?>
<br>
<input type="submit" value="Submit">
</form>
</body>
</html>

Print Web Page tanpa header dan footer

18.33

alie

No comments

Masalah muncul ketika kita memprinting artikel di website, bagaimana cara menonaktifkan header dan footer dari setiap page pada saat memprinting ? masalah ini sangat mengganggu, disamping menghabiskan banyak tinta dengan adanya header dan footer juga menghabiskan ruang dalam memprinting page.

Masalah diatas bisa diatasi dengan melakukan setting pada browser kita,kebetulan saya menggunakan browser Firefox. langsung saja kita praktekkan.
1. Buka browser firefox
2. Pilih menu File >> Print >> Page Setup >> Margins & Header/Footer
Pengaturan dijadikan blank semuanya.