Skip to main content

Magento javascript

1/ Magento 2 adds the form key and the isAjax by using jQuery's beforeSend handler

e.g. when calling jQuery.ajax( ); Magento appends the isAjax and form_key like this:

http://fran/FrAdMiN/ordermanager/index/address/?isAjax=true
payload:
city=CHICAGO&street_1=&form_key=epSMoFA7pinmunsA 

2/ Form and submit button

Magento uses the button's name and value to submit to backend as value. 
For example:

<form>
<button type=submit name=state value=processing>
<button type=submit name=state value=new>

When that button is clicked; the according value is sent; either state=processing or state=new ; depending on WHICH button was clicked  

3/ Magento ajax POST

For a POST request to work; the content type must be 'application/x-www-form-urlencoded'. For example:

let addrUpdRes = await axios.post(`/FrAdMiN/module/action`, postBody, {
                      headers: {
                          'Content-Type': 'application/x-www-form-urlencoded'
                      }
                  })

 

3/ Magento way to add confirmation dialog to button

Example: View.php

            $this->buttonList->add(
                'cancel_shipment',
                [
                    'label' => __('Cancel'),
                    'class' => 'cancel-button',
                    'onclick' => 'deleteConfirm(\''. 'Are you sure you want to cancel this shipment?' . '\', \'' . $this->getCancelUrl() . '\')'
                ]
            );