Namespaces

Classes

Exceptions

Functions

1: <?php
2: /**
3: * Description of Tabs jQuery UI
4: *
5: * @author SARTAJ
6: */
7:
8:
9:
10: class TabsJ extends Sphp\tools\Component{
11: protected function oncreate($element){
12: $this->setHTMLName("");
13: }
14:
15: protected function onjsrender(){
16: global $jquerypath;
17: /*
18: addFileLink($jquerypath.'themes/base/jquery.ui.all.css');
19: addFileLink($jquerypath.'themes/base/jquery.ui.tabs.css');
20: addFileLink($jquerypath.'ui/jquery.ui.core.min.js');
21: addFileLink($jquerypath.'ui/jquery.ui.widget.min.js');
22: addFileLink($jquerypath.'ui/jquery.ui.tabs.min.js');
23: *
24: */
25: //bind js event on other component $("#'.$this->name.'").on("rsize",function(){});
26: SphpJsM::addjQueryUI();
27: addHeaderJSFunctionCode('ready',$this->name,'
28: var ro'. $this->name . ' = new ResizeObserver(entries => {
29: $("#'.$this->name.'").trigger("rsize");
30: });
31: ro'. $this->name . '.observe($("#' . $this->name . '")[0]);
32:
33: $("#'.$this->name.'").tabs();');
34: if($this->innerHTML == ''){
35: $this->innerHTML = '<ul>
36: <li><a href="#tabs-1">Tab1</a></li>
37: <li><a href="#tabs-2">Tab2</a></li>
38: <li><a href="#tabs-3">Tab3</a></li>
39: <li><a href="<?php print getEventURL(\'page\',\'data\'); ?>">Ajax Data Tab</a></li>
40: </ul>
41: <div id="tabs-1">
42: <p>
43: Tab1 Demo Data Tab1 Demo Data Tab1 Demo Data Tab1 Demo Data Tab1 Demo Data Tab1 Demo Data
44: Tab1 Demo Data Tab1 Demo Data Tab1 Demo Data Tab1 Demo Data Tab1 Demo Data Tab1 Demo Data
45: Tab1 Demo Data Tab1 Demo Data Tab1 Demo Data Tab1 Demo Data Tab1 Demo Data Tab1 Demo Data
46: </p>
47: </div>
48: <div id="tabs-2">
49: <p>
50: Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data
51: Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data
52: Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data
53: Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data Tab2 Demo Data
54:
55: </p>
56: </div>
57: <div id="tabs-3">
58: <p>
59: Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data
60: Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data
61: Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data
62: Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data
63: Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data
64: Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data Tab3 Demo Data
65: </p>
66: </div>
67: ';
68: }
69:
70: }
71:
72:
73: }
74:
SartajPHP 5 API