На нашем сайте мы используем cookie для сбора информации технического характера и обрабатываем IP-адрес вашего местоположения. Продолжая использовать этот сайт, вы даете согласие на использование файлов cookies. Здесь вы можете узнать, как мы пользуемся файлами cookies.
Я согласен
логотип upread.ru

Урок 3. Первая форма на Laravel



На этом уроке из серии уроков по Laravel 8 мы займемся возможностью для других отправлять задачи в созданную на первом уроке таблицу задач. Зачем? Да просто так. Во-первых, создайте новый маршрут в routes/web.php файле:

Route::get('/submit', function () {
    return view('submit');
});
Далее нам нужно создать submit.blade.php шаблон в файле resources/views/submit.blade.php со следующей шаблонной загрузочной разметкой:

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Laravel с upread.ru</title>
</head>
<body>
<div class="container">
        <div class="row">
            <h1>Отправка</h1>
        </div>
        <div class="row">
            <form action=" " method="post">
                @csrf
                @if ($errors->any())
                    <div class="alert alert-danger" role="alert">
                        Ошибка!
                    </div>
                @endif
                <div class="form-group">
                    <label for="title">Название</label>
                    <input type="text" class="form-control @error('title') is-invalid @enderror" id="title" name="title" placeholder="Title" value="{{ old('title') }}" required >
                    @error('title')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>
                <button type="submit" class="btn btn-primary">Отправить!</button>
            </form>
        </div>
    </div>
</body>
</html>
Кстати, нам нужен бустрап, чтобы все в Laravel 8 выглядело получше:

composer require laravel/ui

npm install && npm run dev
Теперь в верстку добавим:

<link href="/css/app.css" rel="stylesheet">
<script src="js/app.js"></script>
Выглядит вот примерно так:



В этой форме происходит довольно много событий, поэтому давайте рассмотрим основные моменты, которые могут сбить вас с толку, когда вы новичок в Laravel. В верхней части формы у нас есть условие Блейда, которое проверяет, есть ли какие-либо ошибки проверки. При наличии ошибок будет показано предупреждающее сообщение bootstrap, предлагающее пользователю исправить недопустимые поля формы:

                @if ($errors->any())
                    <div class="alert alert-danger" role="alert">
                        Ошибка!
                    </div>
                @endif
Каждое отдельное поле формы проверяет наличие ошибок проверки, отображает сообщение об ошибке и выводит класс has-error.

Если пользователь отправляет неверные данные, маршрут сохранит проверку в сеансе и перенаправит пользователя обратно в форму. Функция {{ old('title') }} заполнит исходные данные. Если пользователь забыл отправить одно из полей, другие поля, содержащие данные, будут заполнены после сбоя проверки и появления ошибок.



Если поле содержит ошибку, директива @error предоставляет переменную сообщения об ошибке, которую можно использовать в блоке директивы:

@error('title')
    <div class="invalid-feedback">{{ $message }}</div>
@enderror
Другой способ проверки и удаления ошибок включает переменную $error, предоставляемую представлению после сбоя проверки и перенаправления:


@if($errors->has('title'))
    <div class="invalid-feedback">{{ $errors->first('title') }}</div>
@endif
Директива @error использует ту же переменную под капотом, не стесняйтесь использовать любой метод, который вы предпочитаете.

Отправка формы

Имея форму на месте, мы готовы обрабатывать отправку и проверку данных формы на сервере. Вернувшись в routes/web.php файл, создайте другой маршрут для запроса POST:


Route::post('/submit', function (Request $request) {
    $data = $request->validate([
        'title' => 'required|max:10',
    ]);
	
	$link = new App\Link($data);
	$link->save($data['title']);
	
    return redirect('/submit');
});
Примечание: убедитесь, что вы добавили use Illuminate\Http\Request в верхней части страницы web.php.

Этот маршрут немного сложнее, чем другие.

Во-первых, мы вводим объект Illuminate\Http\Request, который содержит данные POST и другие данные о запросе.

Затем мы используем метод validate() запроса для проверки данных формы. Метод validate был введен в Laravel 5.5; используется для проверки. В качестве бонуса проверенные поля возвращаются в переменную $data, и мы можем использовать их для заполнения нашей модели.

Если проверка завершается неудачно, создается исключение, и маршрут возвращает пользователю исходные входные данные и ошибки проверки.

Как правило, вам придется делать следующее, это просто добавляет немного синтаксического сахара:

$link = new \App\Link($data);
$link->save();

return $link;
Теперь непосредственно пишем в базу даных

namespace App;

use App\Http\Controllers\Controller;
use Illuminate\Support\Facades\DB;

class Link extends Controller
{	
	
	public function save($name)
    {	
		DB::insert('INSERT INTO tasks (id, name, created_at, updated_at) VALUES (?, ?, ?, ?)', [NULL, $name, NULL, NULL]);
	}
	  
}
Вообще, в этот пункт надо бы добавить модель для проверки данных, но пока опустим для простоты понимания.

Итак, мы создали форму и научились записывать в базу данных информацию из этой формы, предварительно проверяя её.



Автор этого материала - я - Пахолков Юрий. Я оказываю услуги по написанию программ на языках Java, C++, C# (а также консультирую по ним) и созданию сайтов. Работаю с сайтами на CMS OpenCart, WordPress, ModX и самописными. Кроме этого, работаю напрямую с JavaScript, PHP, CSS, HTML - то есть могу доработать ваш сайт или помочь с веб-программированием. Пишите сюда.

тегистатьи IT, уроки по Laravel, laravel, php, базы данных





Отправляя сообщение я подтверждаю, что ознакомлен и согласен с политикой конфиденциальности данного сайта.




Оператор Sizeof в C#
Реестр почти без программирования, или KISS


© upread.ru 2013-2023
При перепечатке активная ссылка на сайт обязательна.
Задать вопрос
письмо
Здравствуйте! Вы можете задать мне любой вопрос. Если не получается отправить сообщение через эту форму, то пишите на почу up777up@yandex.ru
Отправляя сообщение я подтверждаю, что ознакомлен и согласен с политикой конфиденциальности данного сайта.