diff options
Diffstat (limited to 'demos/quickstart/protected/pages/Tutorial/id/CurrencyConverter.page')
| -rwxr-xr-x | demos/quickstart/protected/pages/Tutorial/id/CurrencyConverter.page | 73 |
1 files changed, 36 insertions, 37 deletions
diff --git a/demos/quickstart/protected/pages/Tutorial/id/CurrencyConverter.page b/demos/quickstart/protected/pages/Tutorial/id/CurrencyConverter.page index d8f8e2b4..c1eae035 100755 --- a/demos/quickstart/protected/pages/Tutorial/id/CurrencyConverter.page +++ b/demos/quickstart/protected/pages/Tutorial/id/CurrencyConverter.page @@ -1,8 +1,8 @@ <com:TContent ID="body"> <h1 id="16001">Membangun Pengubah Kurs Sederhana</h1> <p id="80053" class="block-content">Tutorial ini memperkenalkan kerangka kerja aplikasi web Prado dan mengajarkan Anda bagaimana untuk - membangun aplikasi web sederhana dalam beberapa langkah sederhana. Tutorial - ini menganggap bahwa Anda terbiasa dengan PHP dan Anda telah mengakses + membangun aplikasi web sederhana dalam beberapa langkah sederhana. Tutorial + ini menganggap bahwa Anda terbiasa dengan PHP dan Anda telah mengakses server web yang dapat melayani naskah PHP5. </p> @@ -25,9 +25,9 @@ <p id="80056" class="block-content">Cara tercepat dan termudah untuk membuat aplikasi web Prado baru adalah menggunakan piranti perintah <tt>prado-cli.php</tt> yang ditemukan dalam direktori <tt>framework</tt> pada distribusi Prado. Kita membuat aplikasi baru dengan menjalankan perintah berikut dalam prompt perintah atau konsol Anda. Perintah membuat direktori baru bernama <tt>currency-converter</tt> dalam direktori kerja Anda saat ini. Anda perlu mengubahnya ke direktori yang benar terlebih dahulu. - Lihat <a href="?page=GettingStarted.CommandLine">Piranti Baris Perintah</a>
- untuk lebih jelasnya.
- </p>
+ Lihat <a href="?page=GettingStarted.CommandLine">Piranti Baris Perintah</a> + untuk lebih jelasnya. + </p> <com:TTextHighlighter Language="text" CssClass="source block-content" id="code111"> php prado/framework/prado-cli.php -c currency-converter </com:TTextHighlighter> @@ -39,7 +39,7 @@ php prado/framework/prado-cli.php -c currency-converter <h1 id="16003">Membuat Antarmuka Pengguna Pengubah Kurs</h1> <p id="80058" class="block-content">Kita mulai dengan mengedit file <tt>Home.page</tt> yang ditemukan dalam direktori <tt>currency-converter/protected/pages/</tt>. File yang berakhiran dengan ".page" adalah template halaman yang berisi HTML dan kontrol Prado. - Kita cukup menambah dua kotak teks, tiga label dan satu tombol seperti berikut.
+ Kita cukup menambah dua kotak teks, tiga label dan satu tombol seperti berikut. </p> <com:TTextHighlighter Language="prado" CssClass="source block-content" id="form1"> <com:TForm> @@ -62,7 +62,7 @@ php prado/framework/prado-cli.php -c currency-converter </div> </fieldset> </com:TForm> -</com:TTextHighlighter>
+</com:TTextHighlighter> <p id="refresh" class="block-content"> Jika Anda menyegarkan halaman, Anda akan melihat sesuatu mirip dengan gambar berikut. Ia mungkin terlihat tidak cukup bagus atau berurut, tapi kita akan mengubahnya nanti dengan menggunakan CSS. @@ -82,7 +82,7 @@ php prado/framework/prado-cli.php -c currency-converter <com:DocLink ClassPath="System.Web.UI.WebControls.TTextBox" Text="TTextBox" /> yang pada dasarnya mendefinisikan sebuah label dan kotak teks bagi pengguna aplikasi untuk memasukan nilai pertukaran kurs. - Nilai properti <tt>ForControl</tt> property menentukan komponen mana label + Nilai properti <tt>ForControl</tt> property menentukan komponen mana label diperuntukan. Ini membolehkan pengguna aplikasi mengklik pada label untuk memfokuskan pada field (hal yang baik). Anda mungkin telah menggunakan elemen biasa HTML <tt><label></tt> untuk melakukan hal yang sama, tapi @@ -109,7 +109,7 @@ php prado/framework/prado-cli.php -c currency-converter <p id="80063" class="block-content">Jika Anda mencoba mengklik pada tombol "Convert" kemudian halaman akan menyegarkan dan tidak melakukan apapun. Agar tombol melakukan beberapa pekerjaan, kita perlu menambahkan "Home.php" ke di mana "Home.page" berada. Kelas <tt>Home</tt> harus - memperluas <com:DocLink ClassPath="System.Web.UI.TPage" Text="TPage" />, basis kelas standar untuk semua halaman Prado.
+ memperluas <com:DocLink ClassPath="System.Web.UI.TPage" Text="TPage" />, basis kelas standar untuk semua halaman Prado. </p> <com:TTextHighlighter Language="php" CssClass="source block-content" id="code3"> <?php @@ -117,8 +117,7 @@ class Home extends TPage { } -?> -</com:TTextHighlighter>
+</com:TTextHighlighter> <p id="1111" class="block-content"> Prado menggunakan metode PHP <tt>__autoload</tt> untuk mengambil kelas. Konvensi adalah untuk menggunakan nama kelas dengan ekstensi ".php" sebagai nama file. @@ -134,14 +133,14 @@ class Home extends TPage nilai dalam kotak teks, melakukan beberapa perhitungan dan menyajikan kepada pengguna dengan total nilai yang dikonversi. Untuk menangani pengguna mengklik pada tombo "Convert", kita cukup menambahkan sebuah properti <tt>OnClick</tt> ke tombol "Convert" dalam - template "Home.page" dan menambahkan metode pengendali event terkait dalam "Home.php".
+ template "Home.page" dan menambahkan metode pengendali event terkait dalam "Home.php". </p> <com:TTextHighlighter Language="prado" CssClass="source block-content" id="code4"> <com:TButton Text="Convert" OnClick="convert_clicked" /> </com:TTextHighlighter> - <p id="222" class="block-content">
+ <p id="222" class="block-content"> Nilai dari <tt>OnClick</tt>, "<tt>convert_clicked</tt>", akan menjadi nama metode - dalam "Home.php" yang akan dipanggil saat pengguna mengklik tombol "Convert".
+ dalam "Home.php" yang akan dipanggil saat pengguna mengklik tombol "Convert". </p> <com:TTextHighlighter Language="php" CssClass="source block-content" id="code5"> class Home extends TPage @@ -153,8 +152,8 @@ class Home extends TPage $this->total->Text = $rate * $dollars; } } -</com:TTextHighlighter>
-<div id="3332" class="block-content">
+</com:TTextHighlighter> +<div id="3332" class="block-content"> <p id="333"> Jika Anda menjalankan aplikasi dalam web browser Anda, masukkan beberapa nilai dan klik tombol "Convert" kemudian Anda akan melihat nilai yang dihitung ditampilkan @@ -168,24 +167,24 @@ class Home extends TPage </p> <p id="80067">Sekarang kita akan memeriksa, tiga baris yang mengimplementasikan konversi - kurs sederhana dalam metode "<tt>convert_clicked</tt>".
- </p>
+ kurs sederhana dalam metode "<tt>convert_clicked</tt>". + </p> </div> <com:TTextHighlighter Language="php" CssClass="source block-content" id="code6" > $rate = floatval($this->currencyRate->Text); -</com:TTextHighlighter>
+</com:TTextHighlighter> <p id="444" class="block-content"> Pernyataan <tt>$this->currencyRate</tt> berhubungan dengan komponen <tt>TTextBox</tt> dengan nilai <tt>ID</tt> "currencyRate" dalam template "Home.page". Properti <tt>Text</tt> dari <tt>TTextBox</tt> berisi nilai yang dimasukan oleh pengguna. Maka kita memperoleh nilai ini dengan <tt>$this->currencyRate->Text</tt> yang kita konversi nilainya ke nilai - pecahan.
+ pecahan. </p> <com:TTextHighlighter Language="php" CssClass="source block-content" id="code7"> $dollars = floatval($this->dollars->Text); -</com:TTextHighlighter>
-<div id="5551" class="block-content">
+</com:TTextHighlighter> +<div id="5551" class="block-content"> <p id="555"> Baris berikutnya melakukan hal yang mirip, ia mengambil nilai pengguna dari <tt>TTextBox</tt> dengan nilai <tt>ID</tt> "dollars dang mengubahnya @@ -194,9 +193,9 @@ $dollars = floatval($this->dollars->Text); <p id="80068">Baris ketiga menghitung jumlah baru dan menyetel nilai ini dalam properti <tt>Text</tt> dari <tt>TLabel</tt> dengan <tt>ID="total"</tt>. - Selanjutnya, kita tampilkan jumlah baru ke pengguna dalam label.
+ Selanjutnya, kita tampilkan jumlah baru ke pengguna dalam label. </p> -</div>
+</div> <com:TTextHighlighter Language="php" CssClass="source block-content" id="code8"> $this->total->Text = $rate * $dollars; </com:TTextHighlighter> @@ -210,11 +209,11 @@ $this->total->Text = $rate * $dollars; <li>pengguna memasukan sebuah nilai,</li> <li>kurs mata uang adalah angka yang benar,</li> <li>kurs mata uang adalah positif.</li> - </ol>
+ </ol> <p id="666" class="block-content"> Untuk memastikan poin 1 kita menambahkan satu <com:DocLink ClassPath="System.Web.UI.WebControls.TRequiredFieldValidator" Text="TRequiredFieldValidator" />. Untuk memastikan poin 2 dan 3, kita menambahkan satu <com:DocLink ClassPath="System.Web.UI.WebControls.TCompareValidator" Text="TCompareValidator" />. Kita dapat menambahkan validator ini di mana saja di dalam template "Home.page". Perincian selanjutnya mengenai validator ini dan validator lainnya dapat ditemukan dalam halaman - <a href="?page=Controls.Validation">Validation Controls</a>.
+ <a href="?page=Controls.Validation">Validation Controls</a>. </p> <com:TTextHighlighter Language="prado" CssClass="source block-content" id="code9"> <com:TRequiredFieldValidator @@ -232,11 +231,11 @@ $this->total->Text = $rate * $dollars; <ol id="o222" class="block-content"> <li>pengguna memasukan sebuah nilai,</li> <li>nilai adalah angka yang benar (tidak menyertakan tanda kurs atau dolar).</li> - </ol>
+ </ol> <p id="777" class="block-content"> Untuk memastikan 1 kita cukup menambahkan <tt>TRequiredFieldValidator</tt> lainnya, untuk 2 kita dapat menggunakan - <com:DocLink ClassPath="System.Web.UI.WebControls.TDataTypeValidator" Text="TDataTypeValidator" />. Untuk memudahkan kita hanya membolehkan pengguna untuk memasukan sebuah angka untuk jumlah yang ingin mereka ubah.
+ <com:DocLink ClassPath="System.Web.UI.WebControls.TDataTypeValidator" Text="TDataTypeValidator" />. Untuk memudahkan kita hanya membolehkan pengguna untuk memasukan sebuah angka untuk jumlah yang ingin mereka ubah. </p> <com:TTextHighlighter Language="prado" CssClass="source block-content" id="code9a"> <com:TRequiredFieldValidator @@ -249,8 +248,8 @@ $this->total->Text = $rate * $dollars; </com:TTextHighlighter> </p> - <p id="80072" class="block-content">Sekarang jika Anda mencoba memasukan beberapa data tidak benar dalam aplikasi atau membiarkan field kosong - validators akan diaktifkan dan menyajikan pesan kesalahan kepada pengguna. Catatan bahwa pesan kesalahan disajikan tanpa mengambil ulang halaman. Validator Prado standarnya memvalidasi javascript dan di dalam server. Validasi di dalam server <b>selalu dilakukan</b>. Untuk sisi server, kita harus melewati perhitungan jika validator tidak memuaskan. Ini dapat dilakukan seperti berikut.
+ <p id="80072" class="block-content">Sekarang jika Anda mencoba memasukan beberapa data tidak benar dalam aplikasi atau membiarkan field kosong + validators akan diaktifkan dan menyajikan pesan kesalahan kepada pengguna. Catatan bahwa pesan kesalahan disajikan tanpa mengambil ulang halaman. Validator Prado standarnya memvalidasi javascript dan di dalam server. Validasi di dalam server <b>selalu dilakukan</b>. Untuk sisi server, kita harus melewati perhitungan jika validator tidak memuaskan. Ini dapat dilakukan seperti berikut. </p> <com:TTextHighlighter Language="php" CssClass="source block-content" id="code10" > public function convert_clicked($sender, $param) @@ -276,7 +275,7 @@ memperbaiki pengalaman pengguna dengan meningkatkan tanggapan aplikasi. Satu car <com:DocLink ClassPath="System.Web.UI.ActiveControls.TActiveButton" Text="TActiveButton" />, yang dapat memicu event klik di dalam server tanpa mengambil ulang halaman. Sebagai tambahan, kita dapat mengubah "total" <tt>TLabel</tt> dengan pasangan Kontrol Aktif, - <com:DocLink ClassPath="System.Web.UI.ActiveControls.TActiveLabel" Text="TActiveLabel" />, dengan demikian di dalam server dapat memutakhirkan browser tanpa mengambil ulang halaman.
+ <com:DocLink ClassPath="System.Web.UI.ActiveControls.TActiveLabel" Text="TActiveLabel" />, dengan demikian di dalam server dapat memutakhirkan browser tanpa mengambil ulang halaman. </p> <com:TTextHighlighter Language="prado" CssClass="source block-content" id="code11"> <div class="total-field"> @@ -286,10 +285,10 @@ memperbaiki pengalaman pengguna dengan meningkatkan tanggapan aplikasi. Satu car <div class="convert-button"> <com:TActiveButton Text="Convert" OnClick="convert_clicked" /> </div> -</com:TTextHighlighter>
+</com:TTextHighlighter> <p id="1232" class="block-content"> Logika di dalam server tetap sama, kita hanya perlu mengimpor - ruang nama Kontrol Aktif karena secara standar tidak disertakan. Kita menambahkan baris berikut ke awal "Home.php".
+ ruang nama Kontrol Aktif karena secara standar tidak disertakan. Kita menambahkan baris berikut ke awal "Home.php". </p> <com:TTextHighlighter Language="php" CssClass="source block-content" id="code12"> Prado::using('System.Web.UI.ActiveControls.*'); @@ -300,7 +299,7 @@ Prado::using('System.Web.UI.ActiveControls.*'); Selanjutnya kita bisa memperbaiki pengalaman pengguna dengan mengunah label teks "total" menjadi "calculating..." saat pengguna mengklik tombol "Convert". Label teks "total" masih dimutakhirkan dengan jumlah perhitungan baru seperti sebelumnya. </p> - <p id="80076" class="block-content">Untuk mengindikasikan bahwa perhitungan sedang berlangsung, kita dapat mengubah label teks "total" sebagai berikut. Kita menambahkan properti <tt>ClientSide.OnLoading</tt> ke tombol "Convert" (karena tombol ini bertanggung jawab terhadap permintaan perhitungan).
+ <p id="80076" class="block-content">Untuk mengindikasikan bahwa perhitungan sedang berlangsung, kita dapat mengubah label teks "total" sebagai berikut. Kita menambahkan properti <tt>ClientSide.OnLoading</tt> ke tombol "Convert" (karena tombol ini bertanggung jawab terhadap permintaan perhitungan). </p> <com:TTextHighlighter Language="prado" CssClass="source block-content" id="code13"> <com:TActiveButton Text="Convert" OnClick="convert_clicked" > @@ -325,7 +324,7 @@ Prado::using('System.Web.UI.ActiveControls.*'); </p> <p id="80080" class="block-content">Kita cukup dengan membuat file CSS bernama "common.css" dan menyimpannya dalam direktori - <tt>themes/Basic</tt>. Kemudian kita menambahkan kode berikut ke awal "Home.page" (kita menambahkan sedikit kode HTML juga).
+ <tt>themes/Basic</tt>. Kemudian kita menambahkan kode berikut ke awal "Home.page" (kita menambahkan sedikit kode HTML juga). </p> <com:TTextHighlighter Language="prado" CssClass="source block-content" id="code14"> <%@ Theme="Basic" %> @@ -334,10 +333,10 @@ Prado::using('System.Web.UI.ActiveControls.*'); <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" > <com:THead Title="Currency Converter" /> <body> -</com:TTextHighlighter>
+</com:TTextHighlighter> <p id="4334" class="block-content"> Baris pertama <tt><%@ Theme="Basic" %></tt> mendefinisikan tema - yang dipakai untuk halaman ini. + yang dipakai untuk halaman ini. <com:DocLink ClassPath="System.Web.UI.WebControls.THead" Text="THead" /> merujuk ke elemen HTML <tt><head></tt>. Sebagai tambahan terhadap tampilan properti <tt>Title</tt> pada <tt>THead</tt>, semua file CSS |