Magento – How to send a form key with post data using ajax to a controller in magento

ajaxform-keymagento-1

Suppose I have an ajax function like this in a separate js file

jQuery.ajax({
    url: "/package/module/index/index",
    type: "POST",
    data: {name: user_name, dob: date_of_birth},//here i want to send a form key used in magento
    success: function(response){
        console.log(response);
    }
});

My controller is like this

Class Package_Module_IndexController extends Mage_Core_Controller_Front_Action {
    public function indexAction(){
        //stufss to do here
    }
}

In above php controller I want to validate request with a magento form key.

Best Answer

If you want to use js in external file then you need to add below code in any top of head.phtml file

var formKey = "<?php echo Mage::getSingleton('core/session')->getFormKey(); ?>";

Then add your js code as below:

jQuery.ajax({
    url: "/package/module/index/index",
    type: "POST",
    data: {form_key:formKey name: user_name, dob: date_of_birth},//here i want to send a form key used in magento
    success: function(response){
        console.log(response);
    }
});

Related Solutions

Magento Admin – Running AJAX Script from Admin Area

Looks like your admin route declaration is incorrect. Try this:

<admin>
    <routers>
        <adminhtml>
            <args>
                <modules>
                    <TwilitGrotto_AutoCustomerLookup after="Mage_Adminhtml">TwilitGrotto_AutoCustomerLookup</TwilitGrotto_AutoCustomerLookup>
                </modules>
            </args>
        </adminhtml>
    </routers>
</admin>

Here is a good article on the topic: Magento Admin Hello World Revisited

EDIT:

I'm posting a working solution below:

File: TwilitGrotto\AutoCustomerLookup\etc\adminhtml.xml

<?xml version="1.0"?>
<config>
    <acl>
        <resources>
            <admin>
                <children>
                    <sales>
                        <children>
                            <twilitgrotto_autocustomerlookup translate="title" module="twilitgrotto_autocustomerlookup">
                                <title>Auto Customer Lookup</title>
                            </twilitgrotto_autocustomerlookup>
                        </children>
                    </sales>
                </children>
            </admin>
        </resources>
    </acl>
</config>

File: TwilitGrotto\AutoCustomerLookup\etc\config.xml

<?xml version="1.0"?>
<config>
    <modules>
        <TwilitGrotto_AutoCustomerLookup>
            <version>1.0.0.0</version>
        </TwilitGrotto_AutoCustomerLookup>
    </modules>
    <global>
        <helpers>
            <twilitgrotto_autocustomerlookup>
                <class>TwilitGrotto_AutoCustomerLookup_Helper</class>
            </twilitgrotto_autocustomerlookup>
        </helpers>
    </global>
    <adminhtml>
        <layout>
            <updates>
                <twilitgrotto>
                    <file>twilitgrotto_autocustomerlookup_layout.xml</file>
                </twilitgrotto>
            </updates>
        </layout>
    </adminhtml>
    <admin>
        <routers>
            <adminhtml>
                <args>
                    <modules>
                        <TwilitGrotto_AutoCustomerLookup after="Mage_Adminhtml">TwilitGrotto_AutoCustomerLookup_Adminhtml</TwilitGrotto_AutoCustomerLookup>
                    </modules>
                </args>
            </adminhtml>
        </routers>
    </admin>
</config>

File: TwilitGrotto\AutoCustomerLookup\controllers\Adminhtml\Autocustomerlookup\AddressController.php

<?php

class TwilitGrotto_AutoCustomerLookup_Adminhtml_Autocustomerlookup_AddressController
    extends Mage_Adminhtml_Controller_Action
{
    public function checkEmailExistsAction()
    {
        $emailAddress = $this->getRequest()->getParam('emailAddress');
        $result = Mage::helper('twilitgrotto_autocustomerlookup')->checkEmailExists($emailAddress);
        $this->getResponse()->setBody($result);
    }

    protected function _isAllowed()
    {
        return Mage::getSingleton('admin/session')->isAllowed('sales/twilitgrotto_autocustomerlookup');
    }
}

Controller URL: Mage::getUrl('adminhtml/autocustomerlookup_address/checkEmailExists');

Magento 2 – How to Send Data Using Ajax in Custom Form

You can just set below code in your phtml file to use ajax, You have to change your customurl in below code,

<script type="text/javascript">
    require(["jquery"],function($) {
        $(document).ready(function() {
            var customurl = "<?php echo $this->getUrl().'frontname/index/index'?>";
            $.ajax({
                url: customurl,
                type: 'POST',
                dataType: 'json',
                data: {
                    customdata1: 'test1',
                    customdata2: 'test2',
                },
            complete: function(response) {             
                country = response.responseJSON.default_country;
                state = response.responseJSON.state;         
                console.log(state+' '+country);   
                },
                error: function (xhr, status, errorThrown) {
                    console.log('Error happens. Try again.');
                }
            });
        });
    });
</script>

inside your controller file execute() method,

<?php
 use Magento\Framework\Controller\ResultFactory;
 public function execute()
    {
        $resultPage = $this->resultFactory->create(ResultFactory::TYPE_PAGE);

        $response = $this->resultFactory->create(ResultFactory::TYPE_RAW);
        $response->setHeader('Content-type', 'text/plain');
        $country = 'india';
        $state = 'gujarat';
        $response->setContents(
            $this->_jsonHelper->jsonEncode(
                [
                    'default_country' => $country,
                    'state' => $state,
                ]
            )
        );
        return $response;
    }

Best Answer

Related Solutions

Magento Admin – Running AJAX Script from Admin Area

Magento 2 – How to Send Data Using Ajax in Custom Form

Related Topic