<?php
/*
---EN----
This set of classes allows you to easily use jQuery UI widgets using PHP without the use of JavaScript.
This Class allows you to create widget with default parameters. For example, simply create a slider:
$slider = UiWidget::getWidget('slider');
Allows you to define options for each of them:
$slider->setOption('max', 50);
$slider->setOption('value', 30);
It is also possible to use the events offered by each of the widgets:
$slider->addEventHandler('slide', 'slideHndlr'); //where 'slide' is widget event and 'slideHndlr' your JS function
$slider->addEventHandler('stop', 'stopHndlr');
... and methods:
$slider->runMethod('disable');
To display the widget you just write:
echo $ slider
and ready:)
For more examples, see below.
----PL-----
Ten zestaw klas pozwala na wykorzystywanie w prosty sposób widgetów jquery UI z poziomu PHP bez użycia JavaScript.
Klasa umożliwia utworzenie widgetu z domyślnymi parametrami
np utworzenie slidera wystarczy:
$slider = UiWidget::getWidget('slider');
Pozwala na definiowanie opcji dla każdego z nich:
$slider->setOption('max', 50);
$slider->setOption('value', 30);
Możliwe jest również wykorzystanie zdarzeń oferowanych przez każdy z widgetów:
$slider->addEventHandler('slide', 'slideHndlr'); //gdzie slide to event a slideHndlr to twoja funkcja
$slider->addEventHandler('stop', 'stopHndlr');
Aby wyświetlić widget po prostu napisz:
echo $slider
i gotowe :)
Więcej przykładów poniżej.
*/
?>
<?php
require 'uiWidget.php';
$loremIpsum = 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has';
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PHP jQuery UI wrapper</title>
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.12.custom.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.12.custom.min.js"></script>
</head>
<body>
<div style="width: 600px; margin: 20px 120px auto;">
<?php
$button = UiWidget::getWidget('button');
$buttonLink = UiWidget::getWidget('button_link');
$buttonLink->anchor = 'http://www.wp.pl/';
$buttonLink->setOption('label', '"Link button"');
$buttonSubmit = UiWidget::getWidget('button_submit');
$slider = UiWidget::getWidget('slider');
$slider->setOption('max', 50);
$slider->setOption('value', 30);
$slider->addEventHandler('slide', 'slideHndlr');
$slider->addEventHandler('stop', 'stopHndlr');
$datepicker = UiWidget::getWidget('datepicker');
$dialog = UiWidget::getWidget('dialog');
$dialog->setOption('autoOpen', 'false');
$dialog->setOption('draggable', 'true');
$dialog->setTitle('Dialog title');
$dialog->setText($loremIpsum);
?>
<table>
<tr><td style="width: 200px;">Button (<button>)</td><td><?php echo $button; ?></td></tr>
<tr><td>Button (<input type="submit" >)</td><td><?php echo $buttonSubmit; ?></td></tr>
<tr><td>Button (link)</td><td><?php echo $buttonLink; ?></td></tr>
<tr><td>Slider with events</td><td><?php echo $slider; ?><input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;" /></td></tr>
<tr><td>DatePicker</td><td><?php echo $datepicker; ?></td></tr>
<tr><td>Dialog</td><td><a href="#" id="opener">Open dialog</a><?php echo $dialog; ?></td></tr>
</table>
</div>
<script>
function slideHndlr( event, ui ) {
$( "#amount" ).val( "Value" + ui.value );
}
function stopHndlr( event, ui ) {
$( "#amount" ).css('color', 'gray');
}
$(function() {
$( "#opener" ).click(function() {
$( "#<?php print $dialog->id(); ?>" ).dialog( "open" );
return false;
});
});
</script>
</body>
</html>
|