我需要 ajax 在 zend 框架 3 中发送和接收数据的正确示例

I need correct example for ajax send and received data in zend framework 3

在 Zend 框架 3

中 ajax 控制器的功能和操作之间发送和接收数据的示例

这是一个使用 ZF3 的 ajax 请求的简单示例。你可以试试这个。在这个例子中,我们将使用 ZF3 的默认 Application 模块。

假设我们将通过来自以下 url.

的 ajax 调用检索数据
http://yoursite.com/title

让我们为 IndexController 中的 title 路由创建一个操作方法。

public function titleAction()
{
    // Initialize view
    $view = new ViewModel();

    // Checks if this is a Javascript request
    $xmlHttpRequst = $this->getRequest()->isXmlHttpRequest();

    if (! $xmlHttpRequst) {
        die('Bad request');
    }

    /**
     * Here we may pull data from database but for tests
     * here we make an array of titles for the view
     */
    $titles = [];
    for ($i = 0; $i < 10; $i++) {
        $titles[] = "Lorem ipsum dolor {$i}";
    }

    // Set data to be used in the view
    $view->setVariable('titles', $titles);

    /**
     * Tell the renderer not to show the layout
     * by setting setTerminal to true
     */
    $view->setTerminal(true);

    return $view;        
} 

我们创建了一个方法,我们需要为它创建一个视图模板。

view/application/index/title.phtml

<?php 
foreach ($titles as $title) {
    echo '<h2>' . $title . '</h2>';
}

现在我们将在 IndexController 中创建另一个操作方法,从那里我们将进行 ajax 调用。

http://yoursite.com/text

所以让我们也制作那个动作方法...

public function textAction()
{
    return new ViewModel();
}

视图模板就是这样

view/application/index/text.phtml

<h1>Handling ajax request</h1>

<button onclick="showTitle()">Show Title</button>

<div id="box"></div>

<?php
    // Set url   
    $url = $this->serverUrl('/title'); // http://yoursite.com/title

    // This is for the "url" catch
    echo "<script>" . PHP_EOL;
    echo "\tvar url = '{$url}';" . PHP_EOL;
    echo "</script>" . PHP_EOL;
?>

<script>
    function showTitle() {
        $.get(url, function(data){
            $('#box').html(data);
        })
        .done(function(){
            console.log('Done!');
        })
        .fail(function(){
            console.log('Failed!');
        });      
    }
</script>

此脚本需要 jQuery Javascript 库来进行 ajax 调用。因此,请确保该脚本已添加到您的 view/layout/layout.phtml.

我们需要做的最后一件事是为 /title/text 设置路由。让我们将这两条路线添加到 module/Application/config/module.config.php

的路线部分
'title' => [
    'type' => Literal::class,
    'options' => [
        'route' => '/title',
        'defaults' => [
            'controller' => Controller\IndexController::class,
            'action' => 'title',
        ],
    ],
],
'text' => [
    'type' => Literal::class,
    'options' => [
        'route' => '/text',
        'defaults' => [
            'controller' => Controller\IndexController::class,
            'action' => 'text',
        ],
    ],
],

让我们知道它是否让您开心!