Showing posts with label HTML. Show all posts
Showing posts with label HTML. Show all posts
Membuat Konversi Suhu Dengan Javascript Dan Bootstrap

Membuat Konversi Suhu Dengan Javascript Dan Bootstrap


Membuat Konversi Suhu Dengan Javascript Dan Bootstrap , Dengan bantuan Javascript kita akan membuat Konversi Suhu dinamis dengan html dan  . selain akan lebih indah dilihat, tampilan dari html akan lebih menarik  karena tampilan akan di buat rapih dengan Bootstrap.
Langkah awal kita perlu menginstall library bootstrap pada html yaitu dengan mendownload  file bootstrap , bisa di download di sini .
Atau bisa juga langsung download template Binary Admin nya disini
Letakkan file bootstrap tadi dalam 1 folder , 
 

Membuat Progressbar Dengan Jquery

cara mudah membuat progress bar dengan jqeury


Selamat Datang sahabat mudah , kali ini kita akan membahas Cara Membuat Progressbar Dengan Jquery .
Pasti sahabat sudah tahu tentang progressbar, tertanya mudah loh caranya membuat dengan menggunakan jquery.
Progressbar di gunakan untuk melihat bagaimana proses yang kita jalankan untuk membuka suatu dokumen , upload photo.





Langsung Saja Kita ke kodingnya
Silahkan copy kode di bawah ini
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
 
    <link href="http://www.jqueryscript.net/css/jquerysctipttop.css" rel="stylesheet" type="text/css">
 <link rel="stylesheet" href="http://www.tutorialspoint.com/jquery/src/progressbar/jQuery-plugin-progressbar.css">
 <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
 <script src="http://www.tutorialspoint.com/jquery/src/progressbar/jQuery-plugin-progressbar.js"></script>
</head>
<body>

 <div class="progress-bar position"></div>
 <div class="progress-bar position" data-percent="40" data-duration="1000" data-color="#ccc,yellow"></div>
 <div class="progress-bar position" data-percent="90" data-color="#a456b1,#12b321"></div>
 <input type="submit" value="reload">
 <script>
  $(".progress-bar").loading();
  $('input').on('click', function () {
    $(".progress-bar").loading();
  });
 </script>

</body>
</html>
 Script dan CSS diatas anda dapat download , karena masih online .

Baca juga artikel tentang membuat-option-tanpa-klik-submit-dengan Jquery 

Sekilas penjelasan script :

Pada bagian data-percent kita dapat ganti , berapa persen data yang di ingin kan , 
Pada data-duration merupakan durasi dalam menjalankan progress tersebut .

Maka hasilnya akan terlihat seperti di bawah ini ,

s Cara Membuat Progressbar Dengan Jquery .  Pasti sahabat sudah tahu tentang progressbar, tertanya mudah loh caranya membuat dengan menggunakan jquery.  Progressbar di gunakan untuk melihat bagaimana proses yang kita jalankan untuk membuka suatu dokumen , upload photo. #jquery , #Tutorial,#javascript,#mudah#progressbar
Tutorial Membuat progressbar

Setelah di klik reload hasilnya akan seperti ini :

s Cara Membuat Progressbar Dengan Jquery .  Pasti sahabat sudah tahu tentang progressbar, tertanya mudah loh caranya membuat dengan menggunakan jquery.  Progressbar di gunakan untuk melihat bagaimana proses yang kita jalankan untuk membuka suatu dokumen , upload photo. #jquery , #Tutorial,#javascript,#mudah#progressbar
Tutorial Membuat progressbar

Baca juga artikel tentang Cara-mengambil-attribut-data-dengan jquery


Sekian tutorial Cara Membuat Progressbar Dengan Jquery , semoga dapat membantu .
Bagian tutorial ini agar bertambah ilmu kita :)
Wassalamu'alaikum Wr.Wb

Membuat report php ke excel / konvert PHP ke CSV

Membuat report php ke excel , codeigniter, mysql, open source


Konvert PHP ke Excel / CSV

Dalam tutorial kali ini saya  .
akan mencoba membuat Report PHP ke CSV ,

Pastinya bagi kalian yang buat aplikasi pemrograman
Berbasis Web sudah tidak asing dengan file CSV .
lalu bagaimana kita mengkonvert ke CSV ?

Disini kita tidak membutuhkan plugin tambahan .
karena sudah tersedia di PHP ,

Biasanya File CSV di buat untuk membuat sebuah laporan Data,
Karena tampilannya yang berbentuk tabel , sehingga membudahkan
kita untuk membacanya .

Dalam mebuat file CSV yang pertama di perhatikan anda harus
memiliki data pada database.

Ayo coba kita buat ,
Pertama kita buat database dengan nama Db_Barang
Kedua buat tabel
--
-- Database: `db_barang`
--
-- --------------------------------------------------------
--
-- Struktur dari tabel `stk_barang`
--
CREATE TABLE IF NOT EXISTS `stk_barang` (
`id` int(12) NOT NULL,
`kode` varchar(20) NOT NULL,
`nama_brg` varchar(200) NOT NULL,
`harga_brg` varchar(200) NOT NULL,
`jml_brg` varchar(200) NOT NULL,
`tanggal` year(4) NOT NULL
) ENGINE=InnoDB AUTO_INCREMENT=11 DEFAULT CHARSET=latin1;
--
-- Dumping data untuk tabel `stk_barang`
--
INSERT INTO `stk_barang` (`id`, `kode`, `nama_brg`, `harga_brg`, `jml_brg`, `tanggal`) VALUES
(1, 'rk01', 'Djarum Super', '12000', '90', 2015),
(2, 'rk02', 'Djarum Coklat', '9500', '86', 2015),
(3, 'rk03', 'Djarum Black Capucino', '13000', '75', 2015),
(4, 'rk04', 'GG Filter', '11700', '50', 2015),
(5, 'rk05', 'Dji Sam Soe', '12500', '85', 2015),
(6, 'rk06', 'Sampoerna Kretek', '9000', '80', 2015),
(7, 'rk07', 'Sampoerna Mild', '15000', '70', 2015),
(8, 'rk08', 'Dunhill', '15500', '55', 2015),
(9, 'rk09', 'Malboro', '16000', '76', 2015),
(10, 'rk10', 'Class Mild', '13500', '70', 2015);
--
-- Indexes for dumped tables
--
--
-- Indexes for table `stk_barang`
--
ALTER TABLE `stk_barang`
ADD PRIMARY KEY (`id`), ADD UNIQUE KEY `nama_brg` (`nama_brg`);
--
-- AUTO_INCREMENT for dumped tables
--
--
-- AUTO_INCREMENT for table `stk_barang`
--
Selanjutnya buat sebuah file dengan nama koneksi.php
<?php
mysql_connect("localhost","root","");
$test=mysql_select_db("db_data_alumni");
?>
Setelah membuat file koneksi kita lanjutkan membuat file kovert.php
<?php
include"koneksi.php";
function table_to_csv($query,$filename='namafile.csv')
{
//
header("Content-type: text/csv");
header("Content-Disposition: attachment; filename=".$filename);
header("Pragma: no-cache");
header("Expires: 0");
//
$fp=fopen('php://output', 'w');
$result=mysql_query($query);
$num_fields=mysql_num_fields($result);
$headers=array();
for ($i=0;$i<$num_fields;$i++)
{
$headers[]=mysql_field_name($result,$i);
}
fputcsv($fp,$headers);
while($row=mysql_fetch_row($result))
{
fputcsv($fp,array_values($row));
}
fclose($fp);
}
table_to_csv('SELECT * FROM stk_barang','namafile.csv');
?>
Perhatikan namafile.csv merupakan nama file yang akan di simpan .
Setelah di copy , selanjutnya kita test di browser.


Nah Ternyata  Mudah-loh  Belajar Mengkonvert PHP ke Excel .
yang penting mau mencoba dan penuh kreasi . :)

Sekian Membuat report php ke file excel ( konvert PHP ke Excel )  Semoga Bermanfaat.

Cara Membuat Pencarian data pada CodeIgniter

Cara Membuat Pencarian data pada CodeIgniter ( How to make Search data in Codeigniter )


Membuat pencarian di codeigniter



Hi , pada tutorial ini saya kan Membuat Pencarian data pada CodeIgniter

Untuk membuat pencarian data pada Codeigniter , yang perlu di perhatian

pertama anda harus menSetting Database dan Autoload
pada folder Config .

Setelah mensetting pastikan anda mengisi dengan benar ya .
Untuk settingan Databasenya
$db['default'] = array(
'dsn'    => '',
'hostname' => 'localhost',
'username' => 'root',
'password' => '',
'database' => 'db_ci_3',
'dbdriver' => 'mysqli',
'dbprefix' => '',
'pconnect' => FALSE,
'db_debug' => TRUE,
'cache_on' => FALSE,
'cachedir' => '',
Nah pada file autoload kita rubah data autoload
$autoload['libraries'] = array('database');
$autoload['helper'] = array('url','form','file');
$autoload['model'] = array('modelku');
Setelah Mensetting kita coba buat file Controlers
Disini kita gunakan Welcome , ( Agar tidak perlu setting lagi )
Tambah kan script di bawah ini pada file welcome
Kita tidak perlu me Load modelku lagi karena sudah di setting di awal .
function cariData(){
$cari=$this->input->get('cari');
$beda['cari']=$this->modelku->cariSiswa($cari);
$this->load->view('v_cari',$beda);
}
Selanjutnya Buat sebuah Model dengan nama modelku.php
Tulis Script di bawah ini
public function cariSiswa($cari)
{
$cari=$this->db->query("select * from table_siswa where username like '%$cari%'  ");
return $cari->result();
}
Selanjutnya kita akan membuat File v_form pada Folder View
Tulis Script di bawah ini
<form method="get" action="<?php echo base_url().'welcome/cariData' ?>">
<table>
<td>cari</td><td><input type="text" name="cari"></td>
</tr>
<tr>
<td></td><td><input type="submit" value="Cari"></td>
</tr>
</table>
</form>
Langkah Selanjutnya kita akan membuat File v_cari pada Folder View
Tulis Script di bawah ini
<?php foreach ($cari as $tes) {
?>
Data yang anda cari <?php echo $tes->username;
}
?>

Nah Ternyata mudah-loh Membuat Pencarian data pada CodeIgniter
Sekian Semoga Bermanfaat. :)

Membuat Search Multiple kategory dengan PHP,

Membuat Search Multiple kategory dengan PHP ( How to make Serach Multiple Category in PHP )

Search Multiple Kategory with PHP

Untuk membuat Search Multi Kategory Caranya Mudah-loh.

Cari ini merupakan pengembangan dari Artikel sebelumnya

Membuat Search dengan PHP, disini kita masih sama menggunakan

fungsi like mySQL , dengan data yang anda submit . Cuma sedikit

kita kembangkan sehingga menjadi lebih Ciamik , Multi fungsi.

jadi konsepnya kita menambahkan fungsi or pada My SQL

( dalam bahasa kita disebut atau ) .

Nah jika Sudah  Paham mari kita Langsung

Membuat Search Multiple kategory dengan PHP,

Buat tabel dengan nama anggota
--
-- Struktur dari tabel `anggota`
--
CREATE TABLE IF NOT EXISTS `anggota` (
`id_anggota` int(11) NOT NULL,
`nama` varchar(200) NOT NULL,
`alamat` text NOT NULL,
`telpon` varchar(15) NOT NULL
) ENGINE=InnoDB AUTO_INCREMENT=3 DEFAULT CHARSET=latin1;
--
-- Dumping data untuk tabel `anggota`
--
INSERT INTO `anggota` (`id_anggota`, `nama`, `alamat`, `telpon`) VALUES
(1, 'andi', 'cilacap', '081111111');
(2, 'budi', 'majenang', '08222222');
(3, 'cucu', 'cilacap', '08333333');
Buat file dengan nama index.php
<!--form search-->
<form style="margin-right: 1px;" action="cari.php" method="get">
<div style="background-color: rgb(255, 255, 255);border-radius:3px">
<input style="color:#807474; border-color: rgb(255, 255, 255);" id="cari"
name="cari" placeholder="Temukan Nama , Telpon" type="text"> <div>
<button style="background-color: rgb(255, 255, 255); border: medium none;" id="add-search"
type="submit"><span style="color: rgb(51, 51, 51);"></span></button></div><!-- /btn-group -->
</div></form>
Buat file dengan nama cari.php
<?php
//proses mengambil id
$cari=$_GET['cari'];
$find=mysql_query("SELECT * FROM anggota where nama like '%$cari%' or telpon like '%$cari%'  ");
$jml=mysql_num_rows($find);
if($jml=='0'){
echo "<H3>tidak ada yang di temukan</h3>";
}else{
echo "Jumlah data yang ditemukan $jml";
while ($row=mysql_fetch_assoc($find)){
//Penampilan Data
echo $row['nama'];
echo $row['alamat'];
echo $row['telpon'];
}
?>
Nah Ternyata  Mudah-loh   Membuat search data multiple katagory dengan PHP
Sekian Membuat Search Multiple kategory dengan PHP

Cara Membuat Konvert file PHP Ke PDF dengan MPDF

Cara Membuat Report file pdf di PHP dengan MPDF ( How to make pdf file in PHP with MPDF ) .


Mengubah PHP ke PDF
Konvert PHP to PDF

Hi Bloggers ,
Selamat siang , kembali lagi dengan Mudah-loh.blogspot.com

Pernah kebayang ga setelah anda membuat halaman ( Page )
anda ingin mendokumentasikannya ( di print ) ,
mungkin emang ada wasilitas window.print pada browser anda .
tapi fasilitas tersebut tidak bisa kita atur sendiri, seperti Warna tesk yang sesuai .
membuat penomeran per page ,

Nah disni kita akan coba Cara Membuat Report file pdf di PHP dengan MPDF

Yang terpenting dalam membuat report pastikan anda sudah membuat data
 Baik itu di Database ataupun page Statis.
Baca juga membuat-report-php-ke-excel-konvert-php.html

Pertama anda harus punya plugin MPDF , bisa download di mpdf.com
Langkah kedua buat sebuah file PHP , sebagai contoh ini script file saya
<?php
// sesuai kan root file mPDF anda
$nama_dokumen='PDF With MPDF'; //Beri nama file PDF hasil.
define('_MPDF_PATH','../MPDF53/'); //sesuaikan dengan root folder anda
include(_MPDF_PATH . "mpdf.php"); //includekan ke file mpdf
$mpdf=new mPDF('utf-8', 'A4'); // Create new mPDF Document
//Beginning Buffer to save PHP variables and HTML tags
ob_start();
//Tuliskan file HTML di bawah sini , sesuai File anda .
?>
<html>
<head>
<title>Website Anak Kampung</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="pewarna.css" rel="stylesheet" type="text/css">
<style type="text/css">
<!--
.style1 {font-size: 12px}
.style2 {
color: #FFFFFF;
font-weight: bold;
}
.style3 {
font-size: 14px;
color: #FFFFFF;
}
-->
</style>
</head>
<body bgcolor="#CCCCCC">
<h1 class="style3">Hello tes file PDF </h1>
</body></html>
<?php
//Batas file sampe sini
$html = ob_get_contents(); //Proses untuk mengambil hasil dari OB..
ob_end_clean();
$stylesheet = file_get_contents('../css/bootstrap.min.css');
//Here convert the encode for UTF-8, if you prefer the ISO-8859-1 just change for $mpdf->WriteHTML($html);
$mpdf->WriteHTML($stylesheet,1);
$mpdf->WriteHTML(utf8_encode($html));
$mpdf->Output($nama_dokumen.".pdf" ,'I');
exit;
?>
Sudah paham kan , ternyata Mudah-loh

Sekian Cara Membuat Report file pdf di PHP dengan MPDF , semoga bermanfaat.