October CMS - 快速入門 18 - 建立聯繫表單

郵件設置:config/mail.php;設置爲smtp。php

建立插件Contact前端

clipboard.png

打開編輯器,在contact插件目錄下建立components目錄,並在目錄下建立表單文件:ContactForm.php編輯器

clipboard.png

定義組件測試

File:plugins\raiseinfo\contact\components\ContactForm.php 

<?php
namespace Raiseinfo\Contact\Components;
use Cms\Classes\ComponentBase;
class ContactForm extends ComponentBase
{
    public function componentDetails()
    {
        // TODO: Implement componentDetails() method.
        return [
          'name' => 'Contact Form',
          'description' => 'Simple contact form'
        ];
    }
}

File:pluginsraiseinfocontactPlugin.phpspa

<?php namespace Raiseinfo\Contact;

use System\Classes\PluginBase;

class Plugin extends PluginBase
{
    public function registerComponents()
    {
        return [
          'Raiseinfo\Contact\Components\ContactForm' => 'contactform',
        ];
    }

    public function registerSettings()
    {
    }
}

增長新頁面:插件

clipboard.png

查看頁面前端,確認已經生效,只是插件沒有定義htm,因此沒有內容能夠顯示。3d

clipboard.png

下面編輯表單內容:code

File:plugins\raiseinfo\contact\components\contactform\default.htm

<form action="" class="form-group">
    <label for="">姓名:</label>
    <input type="text" name="name" class="form-control">

    <label for="">郵件地址:</label>
    <input type="text" name="email" class="form-control">

    <label for="">信息:</label>
    <textarea name="content" id="" cols="30" rows="10" class="form-control"></textarea>

    <button type="submit" class="btn btn-success form-control">發送</button>

</form>

clipboard.png

實現功能:
上面的表單沒有功能,甚至都沒有設置表單提交的目標是什麼,如今首先實現表單提交的方法:component

File:plugins\raiseinfo\contact\components\ContactForm.php

<?php

namespace Raiseinfo\Contact\Components;

use Cms\Classes\ComponentBase;
use Illuminate\Support\Facades\Input;
use Illuminate\Support\Facades\Mail;


class ContactForm extends ComponentBase
{

    public function componentDetails()
    {
        return [
          'name' => 'Contact Form',
          'description' => 'Simple contact form'
        ];
    }

    public function onSend()
    {
        $vars = [
            'name' => Input::get('name'),
            'email' => Input::get('email'),
            'content' => Input::get('content')
        ];

        // views/mail/message/htm
        Mail::send('raiseinfo.contact::mail.message', $vars, function($message) {

            $message->to('tian5258@gmail.com', 'Admin Person');

            $message->subject('從聯繫人表單提交的郵件');

        });
    }
    
}

其中'raiseinfo.contact::mail.message'是郵件模板,咱們須要建立郵件模板目錄及文件,結構以下:orm

plugins\raiseinfo\contact\views
plugins\raiseinfo\contact\views\mail
plugins\raiseinfo\contact\views\mail\message.htm

編輯模板:

File:plugins\raiseinfo\contact\views\mail\message.htm
<p>

    You got a new message from {{ name }} at {{ email }}
    
</p>

<strong> Message </strong>

<p>

    {{ content }}

</p>

最後修改form的action,這裏咱們採用data方法

File: plugins\raiseinfo\contact\components\contactform\default.htm


<form data-request="onSend">

    <label>姓名:</label>
    <input type="text" name="name" class="form-control">

    <label>郵件地址:</label>
    <input type="email" name="email" class="form-control">

    <label>信息:</label>
    <textarea name="content" class="form-control"></textarea>

    <button type="submit" class="btn btn-success form-control">發送</button>

</form>

測試

clipboard.png

clipboard.png

相關文章
相關標籤/搜索