ASP.NET Razor - Syntax Kode C# dan VB

Razor mendukung keduanya C# (C sharp) dan VB (Visual Basic).

Aturan utama syntax Razor untuk C#

  • Kode Razor diselengkapkan dalam @{ ... }
  • Ekspresi dalam baris (variabel dan fungsi) dimulai dengan @
  • Kalimat kode berakhir dengan tanda titik koma
  • String diselengkapkan dengan tanda kutip
  • Kode C# berbeda dalam pengecekan besar ke kecil
  • Ekstensi berkas C# adalah .cshtml

Contoh C#

<!-- Blok kalimat tunggal kode -->
@{ var myMessage =	"Hello World"; }
<!-- Ekspresi dalam baris atau variabel -->
<p Nilai myMessage adalah: @myMessage</p> 
<!-- Blok kalimat berbagai baris kode -->
@{
var greeting = "Selamat datang di situs kami!";
var weekDay = DateTime.Now.DayOfWeek;
var greetingMessage = greeting + " Di Huston saat ini adalah: " + weekDay;
}
<p>Pesan pemperingatan adalah: @greetingMessage</p>

Jalankan Contoh

Aturan utama syntax Razor untuk VB

  • Blok kode Razor diselengkapkan dengan @Code ... End Code
  • Ekspresi dalam baris (variabel dan fungsi) dimulai dengan @
  • Deklarasikan variabel dengan kata kunci Dim
  • String diselengkapkan dengan tanda kutip
  • VB tak berbeda dalam pengecekan besar ke kecil
  • Ekstensi berkas VB adalah .vbhtml

Contoh

<!-- Blok kalimat tunggal kode -->
@Code dim myMessage = "Hello World" End Code
<!-- Ekspresi dalam baris atau variabel -->
<p Nilai myMessage adalah: @myMessage</p> 
<!-- Blok kalimat berbagai baris kode -->
@Code
dim greeting = "Selamat datang di situs kami!" 
dim weekDay = DateTime.Now.DayOfWeek 
dim greetingMessage = greeting & " Di Huston saat ini adalah: " & weekDay
Akhir Kode 
<p>Pesan pemperingatan adalah: @greetingMessage</p>

Jalankan Contoh

Bagaimana cara kerjanya?

Razor adalah syntax pemrograman yang sederhana untuk menempelkan kode server di halaman web.

Razor syntax berdasarkan framework ASP.NET, yang merupakan bagian khusus dari framework .NET Microsoft yang dirancang khusus untuk pengembangan aplikasi web.

Razor syntax memberikan kepada Anda semua kemampuan ASP.NET, tetapi menggunakan syntax yang disederhanakan, jadi bagi yang awalnya mudah untuk belajar, dan bagi yang khususnya lebih memudahkan pengembangan produktivitas.

Halaman Razor dapat dijelaskan sebagai halaman HTML yang memiliki dua jenis konten: konten HTML dan kode Razor.

Ketika server membaca halaman seperti ini, sebelum mengirim halaman HTML ke browser, Razor code akan dijalankan terlebih dahulu. Kode yang dijalankan di server dapat menyelesaikan tugas yang tidak dapat dilakukan di browser, seperti mengakses database server. Kode server dapat membuat konten HTML dinamis sebelum halaman dikirim ke browser. Dari perspektif browser, HTML yang dihasilkan oleh kode server tidak berbeda dengan konten HTML statis.

Halaman ASP.NET yang menggunakan sintaks Razor memiliki ekstensi berkas khusus cshtml (menggunakan sintaks Razor C#) atau vbhtml (menggunakan sintaks Razor VB).

Berinteraksi dengan objek

Kode server sering kali melibatkan objek.

Objek "Date" adalah objek bawaan ASP.NET yang biasa, tetapi objek dapat diatur sendiri, seperti halaman web, kotak teks, berkas, atau rekaman database, dll.

Objek dapat memiliki method yang dapat dieksekusi. Rekaman database dapat menyediakan method "simpan", objek gambar dapat memiliki method "putar", objek email dapat menyediakan method "kirim", dan sebagainya.

Objek juga dapat memiliki properti yang mendeskripsikan karakteristiknya. Rekaman database dapat memiliki properti FirstName dan LastName.

Objek Date ASP.NET memiliki properti Now (ditarikh Date.Now), properti Now memiliki properti Day (ditarikh Date.Now.Day). Contoh di bawah ini menunjukkan bagaimana mengakses properti beberapa objek Date:

Contoh

<table border="1">
<tr>
<th width="100px">Name</th>
<td width="100px">Value</td>
</tr>
<tr>
<td>Day</td><td>@DateTime.Now.Day</td>
</tr>
<tr>
<td>Hour</td><td>@DateTime.Now.Hour</td>
</tr>
<tr>
<td>Minute</td><td>@DateTime.Now.Minute</td>
</tr>
<tr>
<td>Second</td><td>@DateTime.Now.Second</td>
</tr>
</td>
</table>

Jalankan Contoh

Kondisi If dan Else

Karakteristik penting halaman web dinamis adalah menentukan tindakan yang akan dilakukan berdasarkan kondisi.

Metode yang biasa digunakan untuk mencapai hal ini adalah menggunakan pernyataan if ... else:

Contoh

@{
var txt = "";
if(DateTime.Now.Hour > 12)
  {txt = "Selamat Sore";}
else
  {txt = "Selamat Pagi";}
}
<html>
<body>
<p>Pesan adalah @txt</p>
</body>
</html>

Jalankan Contoh

Membaca Input Pengguna

Satu dari fitur penting dalam halaman web dinamis adalah membaca input pengguna.

Dibaca input melalui fungsi Request[] dan diuji dengan kondisi IsPost:

Contoh

@{
var totalMessage = "";
if(IsPost)
    {
    var num1 = Request["text1"];
    var num2 = Request["text2"];
    var total = num1.AsInt() + num2.AsInt();
    totalMessage = "Total = " + total;
    }
}
<html>
<body style="background-color: krim; font-family: Verdana, Arial;">
<form action="" method="post">
<p><label for="text1">Nomor Pertama:</label><br>
<input type="text" name="text1" /></p>
<p><label for="text2">Nomor Kedua:</label><br>
<input type="text" name="text2" /></p>
<p><input type="submit" value="Tambah" /></p>
</form>
<p>@totalMessage</p>
</body>
</html>

Jalankan Contoh