Pjax.php 5.89 KB
Newer Older
Qiang Xue committed
1 2 3 4 5 6 7 8 9 10 11
<?php
/**
 * @link http://www.yiiframework.com/
 * @copyright Copyright (c) 2008 Yii Software LLC
 * @license http://www.yiiframework.com/license/
 */

namespace yii\widgets;

use Yii;
use yii\base\Widget;
12
use yii\helpers\Html;
Qiang Xue committed
13
use yii\helpers\Json;
14
use yii\web\Response;
Qiang Xue committed
15 16

/**
17
 * Pjax is a widget integrating the [pjax](https://github.com/yiisoft/jquery-pjax) jQuery plugin.
18
 *
Qiang Xue committed
19 20 21 22 23
 * Pjax only deals with the content enclosed between its [[begin()]] and [[end()]] calls, called the *body content* of the widget.
 * By default, any link click or form submission (for those forms with `data-pjax` attribute) within the body content
 * will trigger an AJAX request. In responding to the AJAX request, Pjax will send the updated body content (based
 * on the AJAX request) to the client which will replace the old content with the new one. The browser's URL will then
 * be updated using pushState. The whole process requires no reloading of the layout or resources (js, css).
24
 *
Qiang Xue committed
25 26 27
 * You may configure [[linkSelector]] to specify which links should trigger pjax, and configure [[formSelector]]
 * to specify which form submission may trigger pjax.
 *
28 29
 * You may disable pjax for a specific link inside the container by adding `data-pjax="0"` attribute to this link.
 *
30
 * The following example shows how to use Pjax with the [[\yii\grid\GridView]] widget so that the grid pagination,
Qiang Xue committed
31
 * sorting and filtering can be done via pjax:
32 33 34 35 36 37 38 39 40
 *
 * ```php
 * use yii\widgets\Pjax;
 *
 * Pjax::begin();
 * echo GridView::widget([...]);
 * Pjax::end();
 * ```
 *
Qiang Xue committed
41 42 43 44 45
 * @author Qiang Xue <qiang.xue@gmail.com>
 * @since 2.0
 */
class Pjax extends Widget
{
46 47
	/**
	 * @var array the HTML attributes for the widget container tag.
48
	 * @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered.
49 50 51 52 53
	 */
	public $options = [];
	/**
	 * @var string the jQuery selector of the links that should trigger pjax requests.
	 * If not set, all links within the enclosed content of Pjax will trigger pjax requests.
54
	 * Note that if the response to the pjax request is a full page, a normal request will be sent again.
55 56
	 */
	public $linkSelector;
57 58 59 60 61 62
	/**
	 * @var string the jQuery selector of the forms whose submissions should trigger pjax requests.
	 * If not set, all forms with `data-pjax` attribute within the enclosed content of Pjax will trigger pjax requests.
	 * Note that if the response to the pjax request is a full page, a normal request will be sent again.
	 */
	public $formSelector;
63 64 65 66 67 68 69 70
	/**
	 * @var boolean whether to enable push state.
	 */
	public $enablePushState = true;
	/**
	 * @var boolean whether to enable replace state.
	 */
	public $enableReplaceState = false;
71
	/**
Qiang Xue committed
72 73 74
	 * @var integer pjax timeout setting (in milliseconds). This timeout is used when making AJAX requests.
	 * Use a bigger number if your server is slow. If the server does not respond within the timeout,
	 * a full page load will be triggered.
75 76
	 */
	public $timeout = 1000;
Qiang Xue committed
77 78 79 80 81
	/**
	 * @var boolean|integer how to scroll the page when pjax response is received. If false, no page scroll will be made.
	 * Use a number if you want to scroll to a particular place.
	 */
	public $scrollTo = false;
82
	/**
83
	 * @var array additional options to be passed to the pjax JS plugin. Please refer to the
84
	 * [pjax project page](https://github.com/yiisoft/jquery-pjax) for available options.
85 86
	 */
	public $clientOptions;
Qiang Xue committed
87

88 89 90
	/**
	 * @inheritdoc
	 */
Qiang Xue committed
91 92
	public function init()
	{
93 94 95 96 97
		if (!isset($this->options['id'])) {
			$this->options['id'] = $this->getId();
		}

		if ($this->requiresPjax()) {
98 99
			ob_start();
			ob_implicit_flush(false);
100 101 102 103 104
			$view = $this->getView();
			$view->clear();
			$view->beginPage();
			$view->head();
			$view->beginBody();
105 106 107
			if ($view->title !== null) {
				echo Html::tag('title', Html::encode($view->title));
			}
108 109
		} else {
			echo Html::beginTag('div', $this->options);
110
		}
Qiang Xue committed
111 112
	}

113 114 115
	/**
	 * @inheritdoc
	 */
Qiang Xue committed
116 117
	public function run()
	{
118
		if (!$this->requiresPjax()) {
119
			echo Html::endTag('div');
120 121
			$this->registerClientScript();
			return;
122 123
		}

124 125
		$view = $this->getView();
		$view->endBody();
Qiang Xue committed
126 127 128 129 130 131

		// Do not re-send css files as it may override the css files that were loaded after them.
		// This is a temporary fix for https://github.com/yiisoft/yii2/issues/2310
		// It should be removed once pjax supports loading only missing css files
		$view->cssFiles = null;

132 133
		$view->endPage(true);

Qiang Xue committed
134 135
		$content = ob_get_clean();

136 137 138 139 140 141 142 143
		// only need the content enclosed within this widget
		$response = Yii::$app->getResponse();
		$level = ob_get_level();
		$response->clearOutputBuffers();
		$response->setStatusCode(200);
		$response->format = Response::FORMAT_HTML;
		$response->content = $content;
		$response->send();
144

145 146 147 148
		// re-enable output buffer to capture content after this widget
		for (; $level > 0; --$level) {
			ob_start();
			ob_implicit_flush(false);
Qiang Xue committed
149 150 151
		}
	}

152 153 154 155 156 157
	/**
	 * @return boolean whether the current request requires pjax response from this widget
	 */
	protected function requiresPjax()
	{
		$headers = Yii::$app->getRequest()->getHeaders();
Alex-Code committed
158
		return $headers->get('X-Pjax') && $headers->get('X-Pjax-Container') === '#' . $this->getId();
159 160
	}

Qiang Xue committed
161 162 163 164 165
	/**
	 * Registers the needed JavaScript.
	 */
	public function registerClientScript()
	{
166
		$id = $this->options['id'];
167 168 169
		$this->clientOptions['push'] = $this->enablePushState;
		$this->clientOptions['replace'] = $this->enableReplaceState;
		$this->clientOptions['timeout'] = $this->timeout;
Qiang Xue committed
170
		$this->clientOptions['scrollTo'] = $this->scrollTo;
171
		$options = Json::encode($this->clientOptions);
172
		$linkSelector = Json::encode($this->linkSelector !== null ? $this->linkSelector : '#' . $id . ' a');
173
		$formSelector = Json::encode($this->formSelector !== null ? $this->formSelector : '#' . $id . ' form[data-pjax]');
Qiang Xue committed
174 175
		$view = $this->getView();
		PjaxAsset::register($view);
176
		$js = "jQuery(document).pjax($linkSelector, \"#$id\", $options);";
Qiang Xue committed
177
		$js .= "\njQuery(document).on('submit', $formSelector, function (event) {jQuery.pjax.submit(event, '#$id', $options);});";
Qiang Xue committed
178 179 180
		$view->registerJs($js);
	}
}