| 1 |
lars |
1 |
<com:TContent ID="body" >
|
|
|
2 |
<h1 id="6801">Javascript dalam PRADO, Pertanyaan dan Jawaban</h1>
|
|
|
3 |
<h2 id="6802">Bagaimana saya menyertakan librari Javascript yang didistribusikan dengan Prado?</h2>
|
|
|
4 |
<p id="880060" class="block-content">Librari javascript yang didistribusikan dengan Prado dapat ditemukan dalam direktori
|
|
|
5 |
<tt>framework/Web/Javascripts/source</tt>. File <tt>packages.php</tt>
|
|
|
6 |
dalam direktori itu mendefinisikan daftar nama paket yang tersedia yang diambil. Itu bisa diambil seperti berikut.
|
|
|
7 |
</p>
|
|
|
8 |
<ul id="u1" class="block-content"><li>Menambahkan librari dalam template
|
|
|
9 |
<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_850268">
|
|
|
10 |
<com:TClientScript PradoScripts="effects" />
|
|
|
11 |
</com:TTextHighlighter>
|
|
|
12 |
</li>
|
|
|
13 |
<li>Menambahkan librari dalam kode PHP
|
|
|
14 |
<com:TTextHighlighter Language="php" CssClass="source block-content" id="code_850269">
|
|
|
15 |
$this->getPage()->getClientScript()->registerPradoScript("effects");
|
|
|
16 |
</com:TTextHighlighter>
|
|
|
17 |
</li>
|
|
|
18 |
</ul>
|
|
|
19 |
Paket librari yang tersedia disertakan dalam Prado adalah
|
|
|
20 |
<ul id="u2" class="block-content">
|
|
|
21 |
<li><tt>prado</tt> : javascript dasar kerangka kerja PRADO berdasarkan Prototype</li>
|
|
|
22 |
<li><tt>effects</tt> : efek visual dari script.aculo.us</li>
|
|
|
23 |
<li><tt>ajax</tt> : terkait ajax dan callback bedasarkan Prototype</li>
|
|
|
24 |
<li><tt>validator</tt> : validasi</li>
|
|
|
25 |
<li><tt>logger</tt> : pencatat javascript dan browser obyek</li>
|
|
|
26 |
<li><tt>datepicker</tt> : datepicker</li>
|
|
|
27 |
<li><tt>colorpicker</tt> : colorpicker</li>
|
|
|
28 |
</ul>
|
|
|
29 |
|
|
|
30 |
<p id="850761" class="block-content">Ketergantungan masing-masing librari secara otomatis dipecahkan. Komponen yang memerlukan libari tertentu juga akan secara otomatis mengambil librari yang diperlukan.
|
|
|
31 |
Sebagai contoh, jika Anda menambah komponen <tt>TDatePicker</tt> pada halaman, <tt>datepicker</tt> dan dependensinya akan secara otomatis disertakan pada halaman.</p>
|
|
|
32 |
|
|
|
33 |
<p id="850762" class="block-content">Lihat <a href="?page=Controls.ClientScript">TClientScript</a> untuk opsi penambahan kode Javascript kustom Anda ke halaman.</p>
|
|
|
34 |
|
|
|
35 |
<h2 id="176028">Menerbitkan Librari Javascript sebagai Assets</h2>
|
|
|
36 |
<com:SinceVersion Version="3.1b" />
|
|
|
37 |
<p class="block-content">Gunakan <a href="?page=Controls.ClientScriptLoader">TClientScriptLoader</a> untuk menerbitkan dan menggabung file javascript yang sudah ada (misalnya librari javascript yang didistribusikan dengan Prado atau sebaliknya) sebagai paket.</p> Untuk kontrol yang lebih besar pada apa dan kapan untuk menerbitkan, gunakan metode
|
|
|
38 |
<tt>registerJavascriptPackages($base, $packages, $debug=null, $gzip=true)</tt>
|
|
|
39 |
dalam kelas <tt>TClientScriptManager</tt>, yang turunannya bisa diperoleh dengan <tt>$this->getPage()->getClientScript()</tt> atau persamaannya.
|
|
|
40 |
Sebagai contoh, jika multipel kontrol akan memakai set librari javascript yang sama, tulis sebuah kelas untuk menangani registrasi paket yang diperlukan oleh kontrol tersebut.
|
|
|
41 |
</p>
|
|
|
42 |
<com:TTextHighlighter Language="php" CssClass="source block-content">
|
|
|
43 |
class MyJavascriptLib extends TComponent
|
|
|
44 |
{
|
|
|
45 |
private $_packages=array(); //perlihara seluruh registrasi
|
|
|
46 |
|
|
|
47 |
private $_manager;
|
|
|
48 |
|
|
|
49 |
protected function __construct(TPage $owner)
|
|
|
50 |
{
|
|
|
51 |
$this->_manager = $owner->getClientScript();
|
|
|
52 |
$owner->onPreRenderComplete = array($this, 'registerScriptLoader');
|
|
|
53 |
}
|
|
|
54 |
|
|
|
55 |
public static function registerPackage(TControl $control, $name)
|
|
|
56 |
{
|
|
|
57 |
static $instance;
|
|
|
58 |
if($instance===null)
|
|
|
59 |
$instance=new self($control->getPage());
|
|
|
60 |
$instance->_packages[$name]=true;
|
|
|
61 |
}
|
|
|
62 |
|
|
|
63 |
protected function registerScriptLoader()
|
|
|
64 |
{
|
|
|
65 |
$dir = dirname(__FILE__).'/myscripts'; //berisi file javascript
|
|
|
66 |
$scripts = array_keys($this->_packages);
|
|
|
67 |
$url = $this->_manager->registerJavascriptPackages($dir, $scripts);
|
|
|
68 |
$this->_manager->registerScriptFile($url,$url);
|
|
|
69 |
}
|
|
|
70 |
}
|
|
|
71 |
|
|
|
72 |
// contoh kelas kontrol menggunakan paket javascript
|
|
|
73 |
class TestComp extends TControl
|
|
|
74 |
{
|
|
|
75 |
public function onPreRender($param)
|
|
|
76 |
{
|
|
|
77 |
parent::onPreRender($param);
|
|
|
78 |
MyJavascriptLib::registerPackage($this,'package1');
|
|
|
79 |
}
|
|
|
80 |
}
|
|
|
81 |
</com:TTextHighlighter>
|
|
|
82 |
|
|
|
83 |
|
|
|
84 |
<div class="last-modified">$Id: Scripts3.page 1902 2007-05-07 04:17:37Z wei $</div></com:TContent>
|