#8 October CMS - Добавление задачи

October CMS - создание компонент

В этом видео мы реализуем добавление новой задачи в нашем компоненте Todo List в October CMS.

Модифицируем файл default.htm

<form data-request="{{ __SELF__ }}::onAddItem"
      data-request-success="$('#newItem').val('')"
      data-request-update="'{{ __SELF__ }}::tasks': '#result'">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h1>Task assigned to: {{ __SELF__.name }}</h1>
        </div>
        <div class="panel-body">
            <div class="input-group">
                <input type="text" id="newItem" name="newTask" value="" class="form-control"/>
                <span class="input-group-btn">
                    <button type="submit" class="btn btn-primary">Add</button>
                </span>
            </div>
            {% partial __SELF__ ~ '::tasks' tasks=__SELF__.tasks %}
        </div>
    </div>
</form>

В случае успешного добавления мы обновим наш элемент #newItem

После добавления элемента мы должны будем обновить наш список задач.
За этот функционал у нас отвечает 

data-request-update="'{{ __SELF__ }}::tasks': '#result'"

Сделаем вывод задач из базы данных.
Открываем файл StTodo.php и изменяем метод onRun:

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

Здесь же создаем метод добавления новой задачи в базу данных:

    public function onAddItem()
    {
        $taskName = post('newTask');
        $task = new Task;
        $task->title = $taskName;
        $task->save();
        $this->page['tasks'] = Task::lists('title');
    }

Чтобы этот код заработал нам надо подключить файл модели:

use Acme\Stdemo\Models\Task;