服务器端事件处理程序
Introduction
AJAX 事件处理程序是可以在页面或布局中定义的 PHP 函数PHP 部分 或里面components 并用于执行 AJAX 请求的服务器端功能请求API 或者数据属性 API.
处理程序方法名称应指定为on
前缀,后跟 PascalCase 中的事件名称 - 例如,onMyHandler
或者onCreatePost
.
所有处理程序都支持使用更新部分 作为 AJAX 响应的一部分。这种行为也可以通过控制update
中的选项请求API 或者data-request-update
中的属性数据属性 API.
function onSubmitContactForm()
{
// AJAX handler functionality goes here
}
如果在页面和布局中同时定义了两个同名的处理程序,则将执行页面处理程序。中定义的处理程序components 具有最低的优先级。
调用处理程序
每个 AJAX 请求都应指定一个处理程序名称。发出请求时,服务器将搜索所有已注册的处理程序并运行具有最高优先级的处理程序。
<!-- Attributes API -->
<button data-request="onSubmitContactForm">Go</button>
<!-- JavaScript API -->
<script>
Snowboard.request(null, 'onSubmitContactForm')
</script>
如果两个组件注册相同的处理程序名称,建议在处理程序前加上前缀组件简称或别名.如果组件使用别名mycomponent 处理程序可以作为目标mycomponent::onName
.
<button data-request="mycomponent::onSubmitContactForm">Go</button>
你应该使用__SELF__
变量而不是硬编码的别名,以支持存在于同一页面上的组件的多个实例。
<form data-request="{{ __SELF__ }}::onCalculate" data-request-update="'{{ __SELF__ }}::calcresult': '#result'">
通用处理程序
有时,您可能需要发出 AJAX 请求,其唯一目的是通过拉取部分更新而不执行任何代码来更新页面内容。您可以使用onAjax
为此目的的处理程序。此处理程序在 AJAX 框架可以响应的任何地方都可用。
clock.htm
部分的
The time is {{ 'now' | date('H:i:s') }}
index.htm
页
<span id="clock-display">
{% partial 'clock' %}
</span>
<button
data-request="onAjax"
data-request-update="'clock': '#clock-display'"
>
Check the time
</button>
AJAX 处理程序中的重定向
如果您需要将浏览器重定向到另一个位置,请返回Redirect
来自 AJAX 处理程序的对象。一旦从服务器返回响应,框架将重定向浏览器。
function onRedirectMe()
{
return Redirect::to('http://google.com');
}
您还可以指定一个redirect
在 Request API 选项中,或通过data-request-redirect
数据属性。此设置将优先于 AJAX 响应中返回的任何重定向。
从 AJAX 处理程序返回数据
您可能希望从 AJAX 处理程序返回结构化的任意数据。如果 AJAX 处理程序返回一个数组,您可以在success
回调处理程序。
function onFetchDataFromServer()
{
/* Some server-side code */
return [
'totalUsers' => 1000,
'totalProjects' => 937
];
}
然后,在 JavaScript 中:
Snowboard.request(this, 'onHandleForm', {
success: function(data) {
console.log(data);
}
});
以这种方式返回的数据cannot 通过访问数据属性 API.
您还可以检索数据几个事件 作为 Request 生命周期的一部分触发。
抛出 AJAX 异常
你可以扔一个AJAX 异常 使用AjaxException
类将响应视为错误,同时保留正常发送响应内容的能力。只需将响应内容作为异常的第一个参数传递。
throw new AjaxException([
'error' => 'Not enough questions',
'questionsNeeded' => 2
]);
NOTE:抛出这种异常类型时,部分会更新 像平常一样。
在处理程序之前运行代码
有时您可能希望代码在处理程序执行之前执行。定义一个onInit
功能的一部分页面执行生命周期 允许代码在每个 AJAX 处理程序之前运行。
function onInit()
{
// From a page or layout PHP code section
}
你可以定义一个init
里面的方法组件类 或者后端小部件类.
function init()
{
// From a component or widget class
}