Cara menggunakan sweetalert echo php

Halo teman-teman, kali ini saya akan membagikan tutorial membuat pop-up alert menggunakan SweetAlert

Pop-up alert sendiri merupakan hal yang sering dilakukan dalam sebuah website. Alert digunakan untuk menampilkan pesan atau peringatan kepada pengguna dengan jendela dialog

Lansiran dapat dibuat menggunakan fungsi alert() dalam JavaScript. Namun tampilan yang dihasilkan dengan fungsi bawaan terkesan sederhana dan kaku sehingga perlu menggunakan library JavaScript tambahan untuk dapat membuat pop-up alert yang lebih menarik dan dapat didesain sesuai dengan keinginan kita. Salah satu pustaka JavaScript itu adalah SweetAlert

Menulis kode SweetAlert sesingkat menulisnya menggunakan fungsi bawaan JavaScript. Hal ini membuat SweetAlert banyak diminati oleh web developer dalam membuat pop-up alert di website mereka

Langkah-langkah Menggunakan SweetAlert

Berikut adalah langkah-langkah dalam membuat pop-up alert menggunakan SweetAlert

1. Kunjungi halaman SweetAlert menggunakan browser Anda masing-masing. Silakan klik tautan berikut untuk mengunjungi situs web SweetAlert. https. //peringatan manis. js. org/
2. Langkah kedua adalah menginstal SweetAlert dengan menambahkan kode berikut ke file website kita. Kodenya adalah
3. Setelah menambahkan kode, kita bisa langsung menggunakan beberapa contoh pop-up alert yang tersedia di library SweetAlert

Contoh Lansiran Munculan SweetAlert

Berikut adalah contoh penggunaan SweetAlert pada tampilan halaman website. Silahkan copy kode dibawah ini untuk melihat hasilnya

    

    

    

    

    

    Contoh Penggunaan SweetAlert





    


        Contoh Pop-up Alert Menggunakan SweetAlert

        Klik disini

    





    

    

Hasil

Hasil kode dapat dilihat pada gambar di bawah ini

Baca Juga. Apa Situs Web Pertama di Dunia?

Penjelasan

1. Saat kita menekan tombol "Klik di sini", fungsi example() pada kode berikut akan dijalankan. Kodenya adalah. Klik disini
2. Pada contoh function() terdapat kode perintah swal yang merupakan perintah dari library SweetAlert. Di dalam kode swal ada beberapa kode lain yang bisa kita ubah sesuai kebutuhan. Kode judul adalah kode untuk judul pada peringatan pop-up, kode teks adalah kode untuk menampilkan teks pada peringatan pop-up, kode ikon untuk mengubah simbol, dan kode tombol untuk mengatur tombol di peringatan pop-up. Selain kode tersebut, masih banyak kode lain yang bisa kita coba untuk membuat pop-up alert sesuai dengan kebutuhan kita. Contoh function() dapat dilihat pada kode berikut.  

function contoh() {

            swal({

                title: "Berhasil!",

                text: "Pop-up berhasil ditampilkan",

                icon: "success",

                button: true

            });

        }

Ini adalah artikel tentang cara membuat pop-up alert menggunakan SweetAlert di halaman website. Semoga artikel yang saya tulis dapat bermanfaat bagi para pembaca. Penulis menyadari bahwa artikel ini masih jauh dari sempurna. Oleh karena itu, jika ada informasi atau kata-kata yang tidak berkenan bagi saya, saya mohon maaf. Sekian artikel dari saya, terima kasih. Tetap semangat dan jangan menyerah dalam bekerja

Dalam tutorial ini kami akan menunjukkan kepada Anda solusi bagaimana menggunakan sweet alert di PHP, di sini pertama-tama kita perlu mengimpor tautan cdn sweet alert kemudian hanya kita yang dapat mengakses peringatan itu di php

Kami mendefinisikan formulir di dalam formulir, kami baru saja mendefinisikan dua bidang input dan tombol kirim

Di php kami menggunakan metode isset() untuk mengenali apakah submit disetel dan bukan null kemudian kami melakukan proses lebih lanjut

Kemudian kami memeriksa apakah dua bidang input kosong atau tidak dengan metode empty() jika kosong maka kami menggunakan proses peringatan manis untuk mengingatkan pengguna dengan beberapa peringatan tata letak prebuilt

Panduan Langkah Demi Langkah Cara Menggunakan Sweet Alert Di PHP. -

Di sini kami mendeklarasikan formulir dengan dua bidang masukan 'nama dan id email' dan tombol kirim

Dalam kita perlu mengkonfirmasi dua hal yang dalam bentuk tag harus membutuhkan atribut 'metode' dengan nilai 'post' maka dalam bentuk setiap elemen harus didefinisikan dengan atribut 'nama' dengan nilai masing-masing karena kita akan menggunakan nilai elemen tersebut dalam blok kode php

Di blok php kami menggunakan metode isset () untuk memeriksa apakah tombol kirim disetel dan bukan nol, lalu kami mengumpulkan nama yang dimasukkan pengguna, nilai bidang email dengan metode pos

Kemudian kami memeriksa bidang input yang diisi oleh pengguna atau tidak jika tidak diisi maka sweet alert akan muncul untuk mengingatkan pengguna

<!Doctype html>
<html>
    <head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/11.4.24/sweetalert2.all.js"></script>
    </head>
    <body>
        <form method="post">
            <input name="nm" type="text" placeholder="Name">
            <input name="em" type="text" placeholder="Email">
            <input name="sub" type="submit" value="Submit">
        </form>
        <?php
    if(isset($_POST['sub'])){
        $n=$_POST['nm'];
        $e=$_POST['em'];
        if(empty($n) || empty($e)){
        ?>
        <script>
            Swal.fire({
                icon: 'error',
                title: 'Invalid',
                text: 'Input Fields Cant Be Empty'
            })
        </script>
        <?php
        }
}
?>
    </body>
</html>

1. A php script can be placed anywhere in the document. A php script starts with .
2. Ekstensi file default untuk file php adalah ". php" dan pernyataan php diakhiri dengan titik koma ';'
3. Pertama kita perlu mengimpor cdn dari sweet link karena kita perlu menggunakan metode yang sudah ada di halaman web
4. Di sini kita mendefinisikan form dengan atribut 'method' dengan nilai 'post' karena ketika kita memproses nilai form di php atribut ini hanya akan memberikan izin untuk mengakses nilai elemen form
5. Di dalam formulir kami membuat dua tag input untuk menentukan dua bidang input 'nama, email' dan yang terakhir untuk menentukan tombol kirim
6. Kemudian di blok php kami memeriksa menggunakan jika kondisi apakah kirim disetel atau tidak dengan metode isset () dan jika mengembalikan benar maka kami mengumpulkan detail bidang input yang dimasukkan pengguna dan disimpan ke variabel '$n,$e'
7. Lain jika memeriksa apakah variabel $n, $e null atau tidak jika mereka null maka kita perlu memberi tahu pengguna untuk mengisi kolom input tersebut untuk itu kita menggunakan metode peringatan manis
8. Ini adalah metode prebuilt yang dapat kita gunakan di situs web mana pun untuk mengingatkan pengguna dan kelebihannya adalah kode yang lebih sedikit, hasil yang bagus, tidak rumit dan hemat waktu

Kesimpulan. -

Kesimpulannya kita bisa mengetahui cara menggunakan sweet alert di php

Pertama kita perlu memulai server xampp kita kemudian kita memuat program ini di browser kita dapat melihat hasil dari dua bidang input untuk mengumpulkan input dari pengguna kemudian ketika pengguna mengklik kirim blok php akan memulai proses kemudian jika mereka tidak memberikan input maka kesalahan peringatan manis pesan akan ditampilkan di layar

Dalam peringatan manis mereka menyediakan lebih banyak jenis metode peringatan, Anda juga dapat mencoba beberapa metode lain

Saya harap tutorial tentang cara menggunakan sweet alert di PHP ini membantu Anda dan langkah serta metode yang disebutkan di atas mudah diikuti dan diterapkan