CARA MENAMPILKAN FOTO SETELAH UPLOAD FOTO DENGAN JQUERY

source logo : www.freebiesupply.com

Assalamualaikum warohmatullohi wabarokatuh,
Wa alaikum salam warohmatullohi wabarokatuh,

pada postingan kali ini mengenaicara menampilkan foto setelah memilih foto dengan menggunakan ajax Jquery, disaat user menekan tombol choose, maka user akan memilih foto user lalu menampilkan foto yang dipilih oleh user tersebut, fungsi nya adalah untuk mengethaui apakah sudah benar foto yang di upload user tersebut jika salah maka user bisa melakukan pemilihan foto lagi, Langsung saja :  

0 - download dulu plugin jquery di sini scroll hingga kebawah lalu tekan tombol download.
1 - letakkan jquery yg telah didownload folder dalam satu folder.
2 - buatlah file index.php
3 - copy script dibawah ini sesuaikan dengan file index.php

Dibawah ini adalah kodenya :

<script type="text/javascript" src="jquery.js"></script>
 
<input type="file" onchange="pilih_foto(this);">
 
<img src="#" id="tampilkan_foto"/>
 
<script type="text/javascript">
 
     function pilih_foto(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();
 
                reader.onload = function (e) {
                    $('#tampilkan_foto')
                        .attr('src', e.target.result)
                        .width(150)
                        .height(auto);
                };
 
                reader.readAsDataURL(input.files[0]);
            }
        }
 
</script>

Hasilnya akan seperti gambar di bawah ini :

Terima Kasih
Thank's

TAG TAGS :

upload and display pic | how to display after upload foto | preview image before upload using Jquery | how to select pic and preview in ajax jquery | how to upload and preview in ajax jquery | ow to upload and preview in ajax jquery | cara upload foto | cara menampilkan foto sebelum di upload | cara menampilkan foto setelah memilih foto

BACA JUGA :

• C.R.U.D AJAX dengan php

SOURCE :

- https://stackoverflow.com/questions/12368910/html-display-image-after-selecting-filename
- http://jsbin.com/uboqu3/1/edit?html,js,output

MENAMPILKAN DATA PADA PHP

source logo : www.php.com

Assalamualaikum warohmatullohi wabarokatuh.
Wa alaikum salam warohmatullohi wabarokatuh.

pembelajaran php yang pertama adalah tentang cara penulisan sintak php, yaitu sintak php harus ditulis didalam tag php yang terdiri penutup dan pembuka. Dimulai dari tag pembuka nya seperti ini lalu setelah, kita buat sintak php nya kita coba hal pertama yaitu menampilkan tulisan pada didalam sintak php dengan menggunakan echo. Fungsi echo adalah menampilkan apa yang kita tulis di dalam sintak php.

echo dimulai dengan tanda petik dan diakhiri tanda petik lalu tanda semicolon, semicolon adalah tanda titik koma, berikut contoh scriptnya :

<?php echo "Halo Dunia"; ?>

Selain echo ada sintak lain yang juga bisa menampilkan seperti echo berikut scriptnya :

<?= "Halo Dunia";  ?>

Selanjutnya perpaduan string atau isi dengan html, css, javascript menggunakan php
Coba dengan html dengan tag ini ,

berikut kode php dengan html nya :

<?php 
 
   echo "<b>Hello My Name is Terry</b>";
   echo "<br>";
   echo "My Hooby is Swimming";
 
?>

Sekarang coba dengan css nerikut kode php dengan css didalamnya :

<button style=" <?php echo "background-color:orange"; ?> ">Tombol</button>

Pada sintak diatas memang berbeda, dengan sintak html diatas tergantung kondisi setiap pengguna, untuk saya sendiri menggunakan css dalam operator if.

Sekarang coba dengan javascript, berikut kode php engan javascript :

<?php 

   echo "
         <script>
     
             alert('Hello I Am Jhon Terry');

          </script>

         "; 

?>

Pada sintak php dengan javascript biasanya digunakan setelah melakukan untuk notif saja, seprti saat user berhasi lmenghapus, menambah, mengubah data, maka akan menggunakan serpti script php dengan javascript.

Terima Kasih.
Thank's.

Tag :

Cara echo pada php | echo adalah ... | echo adalah | echo php | echo with Javascript | echo with js | echo with css | echo with html how to echo php | how to echo php with css | how to echo php with js

Read More