OctoberCMS 表单请求未提交

OctoberCMS form request not submitted

我正在关注 this tutorial 创建一个简单的 OctoberCMS 插件。 这是 /acme/demo/components/todo/default.htm 页面的内容:

{% set tasks = __SELF__.tasks %}

<form data-request="{{ __SELF__ }}::onAddItem" data-request-success="$('#inputItem').val('success')">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">Tasks assigned to: {{__SELF__.name}} </h3>
        </div>
        <div class="panel-body">
            <div class="input-group">
                <input name="task" type="text" id="inputItem" class="form-control" value=""/>
                <span class="input-group-btn">
                    <button type="submit" class="btn btn-primary">Add</button>
                </span>
            </div>  
        </div>
        <ul class="list-group" id="result">
            {% for task in tasks %}
                <li class="list-group-item">
                    {{ task }}
                    <button class="close pull-right">&times;</button>
                </li>
            {% endfor %}
        </ul>
    </div>
</form>

这里是/acme/demo/components/Todo.php的内容:

<?php namespace Acme\Demo\Components;

use Cms\Classes\ComponentBase;
use Acme\Demo\Models\Task; 

class Todo extends ComponentBase
{
    /**
    * This is a person's name.
    * This variable will be available in the page as a twig variable
    * @var string
    */
    public $name;
    /**
    * The collection of tasks.
    * @var array
    */
    public $tasks;

    public function componentDetails()
    {
        return [
            'name'        => 'Todo Component',
            'description' => 'A database driven TODO list'
        ];
    }

    public function defineProperties()
    {
        return [];
    }

    public function init()
    {
        // This will execute when the component is first initialized, including AJAX events.
    }

    public function onRun()
    {
        $this->name = 'Meysam'; 
        $this->tasks = Task::lists('title');
    }

    public function onAddItem()
    {
        $taskName = post('task');
        $task = new Task();
        $task->title = $taskName;
        $task->save();
    }

}

问题是 onAddItem 从未被调用过。当我添加新项目时,似乎没有正确提交表单。有人知道我该如何解决这个问题吗?我想也许 ajax 库丢失了,所以我也包括了 {% framework %},这同样没有帮助:

{% set tasks = __SELF__.tasks %}
{% framework %}

<form data-request="{{ __SELF__ }}::onAddItem" data-request-success="$('#inputItem').val('success')">

请注意我的模型正在运行 $this->tasks = Task::lists('title'); returns 任务列表。

问题是我还应该有 included jquery 文件:

<script src="{{ [
    'assets/javascript/jquery.js',
]|theme }}"></script>

{% framework %}