Simpan nilai dan buat keputusan dalam CFML

Simpan nilai dan buat keputusan dalam CFML

Bab lepas anda melihat satu nilai disimpan dan dipaparkan. Sekarang kita tambah dua kemahiran yang membentuk hampir semua aplikasi: menyimpan beberapa nilai, dan membuat halaman bertindak mengikut nilai itu.

Kita kekalkan projek yang sama. Buka folder C:\inventori, dan pastikan pelayan masih berjalan. Kalau anda belum memasangnya, mulakan dengan bab pemasangan, dan kalau ini kali pertama anda menulis kod, bab pertama memperkenalkan tag asas.

Satu kotak, satu nilai

Anda sudah tahu bahawa <cfset> menyimpan nilai. Mari kita lihat tiga jenis nilai yang akan anda gunakan sepanjang siri ini.

<cfset namaKedai = "Kedai Pak Ali">
<cfset bilanganProduk = 12>
<cfset hargaRata = 8.50>
<cfoutput>
    <p>Kedai: #namaKedai#</p>
    <p>Produk: #bilanganProduk#</p>
    <p>Harga purata: RM#numberFormat(hargaRata, "0.00")#</p>
</cfoutput>

Hasilnya:

Kedai: Kedai Pak Ali
Produk: 12
Harga purata: RM8.50

Bahagian pertama ialah teks, dan ia memerlukan tanda petikan. Bahagian kedua ialah nombor bulat, dan ia tidak memerlukan petikan. Bahagian ketiga ialah nombor perpuluhan.

Perbezaan ini penting. Kalau anda menyimpan "12" dengan petikan, CFML menganggapnya teks. Cara nilai hidup dalam halaman diterangkan dalam panduan skop CFML. Ia masih boleh dipaparkan, tetapi ia tidak boleh dikira dengan betul dalam semua keadaan. Biasakan menulis nombor tanpa petikan.

Bandingkan nilai dengan cfif

Sekarang kita mahu halaman memberi amaran apabila stok rendah. Kita memerlukan satu nilai untuk had, dan satu perbandingan.

<cfset stok = 3>
<cfset hadRendah = 5>

<cfif stok LTE hadRendah>
    <cfoutput><p>Stok rendah. Tinggal #stok# unit.</p></cfoutput>
<cfelse>
    <cfoutput><p>Stok masih mencukupi.</p></cfoutput>
</cfif>

Hasilnya:

Stok rendah. Tinggal 3 unit.

LTE bermaksud kurang daripada atau sama dengan. Kalau anda menukar stok kepada 10, halaman akan memaparkan ayat yang kedua.

Perhatikan bahawa kita membandingkan dua kotak, bukan dua nombor yang ditaip terus. Ini membolehkan kita menukar had di satu tempat sahaja, dan seluruh halaman mengikutinya. Kemahiran kecil ini menjimatkan banyak kerja kemudian.

Empat perbandingan yang perlu anda kenal

Anda juga akan berjumpa GTE, iaitu lebih besar atau sama, dan LT, iaitu kurang daripada. Huruf besar atau kecil tidak penting, tetapi menulisnya dalam huruf besar menjadikan kod lebih mudah dibaca.

Ulang sesuatu dengan cfloop

Kalau kita mempunyai senarai kategori, kita tidak mahu menulis satu baris untuk setiap satu. Kita mahu satu arahan yang mengulang.

<cfset kategori = "Minuman,Kering,Beku">

<ul>
<cfloop list="#kategori#" index="satu">
    <cfoutput><li>#satu#</li></cfoutput>
</cfloop>
</ul>

Hasilnya:

Minuman
Kering
Beku

list memberitahu gelung itu bahawa kita memberinya senarai teks yang dipisahkan koma. index="satu" bermaksud: bagi setiap pusingan, letakkan item semasa ke dalam kotak bernama satu.

Gelung ini juga boleh mengira. Contohnya, kita mahu memaparkan nombor 1 hingga 3.

<cfloop from="1" to="3" index="nombor">
    <cfoutput><p>Produk #nombor#</p></cfoutput>
</cfloop>

Hasilnya:

Produk 1
Produk 2
Produk 3

Kali ini kita tidak memberi senarai. Kita memberi nombor mula dan nombor akhir, dan CFML mengira sendiri.

Bila guna if, bila guna loop

Dua alat ini menyelesaikan masalah yang berbeza, dan pemula sering keliru.

Gunakan <cfif> apabila halaman perlu membuat satu keputusan: tunjuk amaran atau tidak, papar butang atau tidak, benarkan simpan atau tidak. Ia menjawab soalan ya atau tidak.

Gunakan <cfloop> apabila kerja yang sama perlu diulang untuk beberapa item: satu baris untuk setiap produk, satu pilihan untuk setiap kategori, satu halaman untuk setiap rekod.

Dalam halaman stok tadi, kita menggunakan <cfif> tiga kali kerana kita mahu tiga keputusan berasingan. Apabila data datang daripada pangkalan data nanti, kita hanya perlu satu gelung yang mengandungi satu <cfif> di dalamnya.

Gabungkan semuanya: halaman stok

Sekarang kita gantikan halaman index.cfm anda dengan versi yang menunjukkan tiga produk dan status stoknya. Taip kod ini, atau salin, kemudian simpan dan muat semula pelayar.

<!doctype html>
<html lang="ms">
<head>
    <meta charset="utf-8">
    <title>Inventori Mini</title>
    <style>
        body { font-family: system-ui, sans-serif; max-width: 620px; margin: 60px auto; padding: 0 20px; }
        h1 { font-size: 1.5rem; margin-bottom: 4px; }
        .produk { border-bottom: 1px solid #e2e8f0; padding: 10px 0; }
        .nama { font-weight: 600; }
        .amaran { color: #b45309; font-size: 0.92rem; }
        .selamat { color: #0b6b5f; font-size: 0.92rem; }
    </style>
</head>
<body>
    <cfset namaKedai = "Kedai Pak Ali">

    <cfset beras = 10>
    <cfset kopi = 3>
    <cfset gula = 0>

    <cfset hadRendah = 5>

    <h1><cfoutput>#namaKedai#</cfoutput></h1>
    <p>Senarai stok hari ini:</p>

    <div class="produk">
        <cfoutput><span class="nama">Beras</span> - #beras# unit</cfoutput>
        <cfif beras LTE hadRendah>
            <cfoutput><div class="amaran">Perlu tambah stok.</div></cfoutput>
        <cfelse>
            <cfoutput><div class="selamat">Stok mencukupi.</div></cfoutput>
        </cfif>
    </div>

    <div class="produk">
        <cfoutput><span class="nama">Kopi</span> - #kopi# unit</cfoutput>
        <cfif kopi LTE hadRendah>
            <cfoutput><div class="amaran">Perlu tambah stok.</div></cfoutput>
        <cfelse>
            <cfoutput><div class="selamat">Stok mencukupi.</div></cfoutput>
        </cfif>
    </div>

    <div class="produk">
        <cfoutput><span class="nama">Gula</span> - #gula# unit</cfoutput>
        <cfif gula LTE hadRendah>
            <cfoutput><div class="amaran">Perlu tambah stok.</div></cfoutput>
        <cfelse>
            <cfoutput><div class="selamat">Stok mencukupi.</div></cfoutput>
        </cfif>
    </div>
</body>
</html>

Hasil sebenar pada rig ujian kami: satu kod yang sama, tiga nilai berbeza.

Hasilnya: Beras menunjukkan stok mencukupi dalam warna hijau, manakala Kopi dan Gula menunjukkan amaran dalam warna jingga. Ketiga-tiga menggunakan kod yang sama, tetapi nilai yang berbeza menghasilkan keputusan yang berbeza.

Mengapa kod ini berulang tiga kali

Anda mungkin perasan bahawa blok <cfif> itu ditulis tiga kali. Itu bukan kesilapan; ia pilihan yang betul untuk peringkat ini.

Kita belum menyimpan data dalam senarai yang boleh diulang. Setiap produk ialah satu kotak berasingan. Apabila kita menggunakan pangkalan data dalam bab seterusnya, ketiga-tiga blok itu akan menjadi satu blok sahaja yang mengulang untuk setiap baris. Pada masa itu, anda akan nampak mengapa gelung itu berbaloi.

Menulis kod berulang dahulu, kemudian menggantikannya dengan gelung, ialah cara belajar yang baik. Dalam bab pengenalan anda boleh lihat semula keseluruhan pelan 14 bab, supaya anda tahu bila data sebenar akan masuk. Anda faham apa yang gelung itu gantikan, bukan sekadar menyalin corak.

Ralat lazim dalam bab ini

Membandingkan teks dengan nombor. Kalau anda menyimpan stok = "3" dengan petikan, stok LTE 5 mungkin memberi jawapan yang tidak dijangka. Simpan nombor tanpa petikan.

Lupa menutup <cfif>. Setiap <cfif> memerlukan </cfif>, walaupun ia mempunyai <cfelse>.

Menggunakan = dan bukannya EQ. Dalam <cfif>, tanda = tidak digunakan untuk perbandingan. Gunakan EQ.

Gelung tidak memaparkan apa-apa. Semak ejaan nama index. Ia mesti sama dengan nama yang anda gunakan di dalam #...#.

Apa yang anda sudah boleh buat

Anda kini boleh menyimpan beberapa nilai, membuat perbandingan, mengulang senarai dan membina halaman yang bertindak mengikut data. Itu sudah cukup untuk membina sebahagian besar logik aplikasi.

Yang belum ada ialah tempat menyimpan data secara kekal. Setakat ini, semua nilai hilang apabila anda menutup fail. Bab seterusnya memperkenalkan pangkalan data, dan di situlah aplikasi sebenar bermula.

Soalan Lazim

Boleh saya menyimpan lebih daripada tiga produk? Boleh, tetapi menulis satu blok untuk setiap produk menjadi tidak praktikal selepas sepuluh. Itu sebabnya kita beralih kepada pangkalan data dalam bab seterusnya.

Kenapa LTE dan bukan <? Anda boleh menulis stok <= 5, dan ia berfungsi. LTE lebih mudah dibaca oleh pemula, dan ia mengelakkan kekeliruan dengan tanda kurungan dalam HTML.

Adakah cfloop from to bermula dari sifar? Tidak. Ia bermula pada nombor yang anda tulis. from="1" to="3" memberi 1, 2, 3.

Boleh saya letak <cfset> di mana-mana dalam halaman? Boleh, asalkan ia sebelum nilai itu digunakan. Amalan yang baik ialah meletakkan semua <cfset> di bahagian atas, supaya mudah dicari.

Kenapa halaman saya tidak berubah selepas simpan? Pastikan anda menyimpan fail index.cfm di folder yang betul, kemudian muat semula dengan Ctrl + F5. Kalau masih sama, semak sama ada pelayan masih berjalan dalam CommandBox.

Sumber

• Rujukan tag cfif: docs.lucee.org/reference/tags/if.html
• Rujukan tag cfloop: docs.lucee.org/reference/tags/loop.html
• Rujukan tag cfset: docs.lucee.org/reference/tags/set.html
• Rujukan fungsi numberFormat: docs.lucee.org/reference/functions/numberformat.html