Coder Social home page Coder Social logo

martinpetrasch / luya-module-contactform Goto Github PK

View Code? Open in Web Editor NEW

This project forked from luyadev/luya-module-contactform

0.0 2.0 0.0 124 KB

Create and configure custom contact forms for LUYA applications.

Home Page: https://luya.io

PHP 100.00%

luya-module-contactform's Introduction

LUYA Logo

Contactform Module

LUYA Build Status Test Coverage Maintainability Total Downloads Latest Stable Version Join the chat at https://gitter.im/luyadev/luya

This module provides a very fast and secure way to create customizable contact forms.

Installation

Require the contact module via composer

composer require luyadev/luya-module-contactform:~1.0.0

add the contact form module to your config:

'modules' => [
    // ...
    'contactform' => [
        'class' => 'luya\contactform\Module',
        'useAppViewPath' => true, // When enabled the views will be looked up in the @app/views folder, otherwise the views shipped with the module will be used.
        'mailTitle' => 'Contact Form',
        'attributes' => [
            'name', 'email', 'street', 'city', 'tel', 'message',
        ],
        'rules' => [
            [['name', 'email', 'street', 'city', 'message'], 'required'],
            ['email', 'email'],
        ],
        'recipients' => [
            '[email protected]',
        ],
    ],  
    // ...
],

To defined the attribute labels you can configure the module as followed:

'attributeLabels' => [
    'email' => 'E-Mail',
],

By default LUYA will wrap the value into the Yii::t('app', $value) functions so you are able to translate the attributes labels. The above exmaple would look like this Yii::t('app', 'E-Mail').

Integrate the Module

In order to use the module inside the LUYA CMS, just pick the Module Block and drag the block into the page. After droped the block edit the module block and picke the contactform module. This will then maybe throw an exception that there is no view file. In order to create the view file follow the next section.

View Files

Typically view files are located in views folder of your project root, create the view file for the corresponding model data at views/contactform/default/index.php with the following content:

<?php

use yii\widgets\ActiveForm;
use yii\helpers\Html;

/* @var object $model Contains the model object based on DynamicModel yii class. */
/* @var $this \luya\web\View */
/* @var $form \yii\widgets\ActiveForm */

?>

<?php if (Yii::$app->session->getFlash('contactform_success')): ?>
    <div class="alert alert-success">The form has been submitted successfully.</div>
<?php else: ?>
    <?php $form = ActiveForm::begin(); ?>
    
    <?= $form->field($model, 'name'); ?>
    <?= $form->field($model, 'email'); ?>
    <?= $form->field($model, 'street'); ?>
    <?= $form->field($model, 'city'); ?>
    <?= $form->field($model, 'tel'); ?>
    <?= $form->field($model, 'message')->textarea(); ?>
    
    <?= Html::submitButton('Submit', ['class' => 'btn btn-primary']) ?>
    
    <?php ActiveForm::end(); ?>
<?php endif; ?>

when the form validation success the variable $success will be true, in addition a Yii2 flash mesage Yii::$app->session->setFlash('contactform_success') with the key-name contactform_success will be set.

Tip: In order to style required fields with asterisks, you can use the following CSS:

div.required label.control-label:after {
   content: " *";
   color: red;
}

Trigger after success

You can define a anonmys function which will be trigger after success, the first parameter of the function can be the model which will be assigne [[\luya\base\DynamicModel]]. Example callback:

'modules' => [
    // ...
    'contactform' => [
        // ...
        'callback' => function($model) {
            // insert the name of each contact form into `contact_form_requests` table:
            Yii::$app->db->createCommand()->insert('contact_form_requests', ['name' => $model->name])->execute();
        }
    ],
];

Ordering fields in email

You can oder the fields in the mail wich will be send to the contact form recipient. This could be put before the rules in the contact form config.

For short and small forms this notation could be used as well:

'modules' => [
    // ...
    'contactform' => [
        // ...
        'detailViewAttributes' => ['name', 'newsletter:bool', 'city', 'message:text:Label for Message'],    
       // ...
    ],
];

For long and complex form we would recommend this notation:

'modules' => [
    // ...
    'contactform' => [
        // ...
        'detailViewAttributes' => [
            ['attribute' => 'name'],
            ['attribute' => 'email'],
            ['attribute' => 'newsletter:bool'],
            ['attribute' => 'city:integer'],
            ['attribute' => 'message'],
        ],       
       // ...
    ],
];

Advanced configuration

attribte example
mailTitle The mail title is also known as the mail subject
mailText This is a message which can be used as intro for the mail body. Markdown parsing is enabled by default.
sendToUserEmail If enabled, the mail will also be sent to the user who has submitted the form, configure the property with the mail field from the model.
callback An anyonymus function find the model argument in order to trigger custom functions.

luya-module-contactform's People

Contributors

nadar avatar themaaarc avatar dev7ch avatar martinpetrasch avatar rolandschaub avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.