Onur Özgür ÖZKAN

Php, Ruby, Kebab, Git Geek

Sending Email With Zend Framework, ExtJS on Kebab Project Using Gmail

This is a simple tutorial over sending email with Zend Framework. First of all we write our email setting on config file which name is kebab.ini .

1
2
3
4
5
6
7
8
;Mail Settings
kebab.mail.smtpServer           = "smtp.gmail.com"
kebab.mail.config.ssl           = "tls"
kebab.mail.config.auth          = "login"
kebab.mail.config.port          = "587"
kebab.mail.config.username      = "onur.ozgur.ozkan@lab2023.com"
kebab.mail.config.from          = "onur.ozgur.ozkan@lab2023.com"
kebab.mail.config.password      = "your_password"

Secondly, we write our actions

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<?php

class TestController extend Kebab_Controller_Action
{
    public function contactAction()
    {
        if ($this->getRequest()->isPost()) {
            $param = $this->_helper->param();
            // $param = array('name' => 'Visiter Name', 'email' => 'visiter@email.com', 'body' => 'Hi, This is a message body');
            $configParam = Zend_Registry::get('config')->kebab->mail;
            $smtpServer = $configParam->smtpServer;
            $config = $configParam->config->toArray();

            // Mail phtml
            $view = new Zend_View;
            $view->setScriptPath(APPLICATION_PATH . '/views/mails/'); // we create a contact.phtml for send email
            $view->assign('name', $param['name']);
            $view->assign('email', $param['email']);
            $view->assign('body', nl2br($param['body']));

            $transport = new Zend_Mail_Transport_Smtp($smtpServer, $config);
            $mail = new Zend_Mail('UTF-8');
            $mail->setFrom($configParam->from, 'Contact Form from - '. $param['name']);
            $mail->addTo($param['email'], $param['name']);
            $mail->setSubject('Contact Form from - '. $param['name']);
            $mail->setBodyHtml($view->render('contact.phtml'));
            $mail->send($transport);

            $this->_helper->response(true)->getResponse(); // send success response json format
        }

        // Show contact.form.phtml which user fill and send
    }
}

This is our /view/mails/contact.phtml

1
2
3
<h1><?php echo $this->translate('Contact Form'); ?></h1>
<h2><?php echo $this->translate('Sender'); ?> : <?php echo $this->name; ?> - <?php echo $this->email; ?></h2>
<p><?php echo $this->body; ?></p>

Now you need a view form send form.

1
2
3
4
5
6
7
8
9
10
11
<?php
$this->headTitle($this->translate('Contact'));
$this->headScript()->prependFile($this->asset('frontend/javascripts/contact.js')->get(false));
?>

<div class="rounded contents">
    <h1>Contact</h1>
    <p>Please touch as</p>
    <br />
    <div id="form-wrapper"></div>
</div>

And javascript file for ajax web/assets/frontend/javascripts/contact-debug.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
Contact = function(){

    return {

        /**
         * Application initializer
         * @return void
         */
        init: function(){

            new Ext.FormPanel({
                id: 'contact-form',
                renderTo: 'form-wrapper',
                url: BASE_URL + '/test/contact',
                frame:true,
                bodyStyle:'padding:5px',
                autoHeight: true,
                defaultType: 'textfield',
                defaults: {
                    anchor: '100%',
                    height: 50
                },
                labelAlign: 'top',
                waitMsgTarget: true,
                items: [{
                        fieldLabel: 'Name',
                        name: 'name',
                        allowBlank:false
                    },{
                        fieldLabel: 'Email',
                        name: 'email',
                        vtype:'email'
                    },{
                        fieldLabel: 'Message',
                        xtype: 'textarea',
                        height: 100,
                        name: 'body'
                    }
                ],
                buttons: [{
                    text: 'Gönder',
                    handler: function(btn) {
                        this.sendContactAction(btn);
                    },
                    scope:this
                }]
            });
        },

        sendContactAction: function(btn) {
            var form = Ext.getCmp('contact-form').getForm();
            if (form.isValid()) {
                btn.disable();
                form.submit({
                    url: form.url,
                    waitMsg: 'Sending...',
                    success: function() {
                        btn.enable();
                        Ext.fly('contact-form').remove();
                        Ext.fly('form-wrapper').update('<p>Your message has been send. Thank you...</p>');
                    },
                    failure: function() {
                        btn.enable();
                    }
                })
            }
        }

    }
}();

Ext.onReady(Contact.init, Contact);

Thats all.