Question

在这个示例中，我试图添加一个简单的javascript函数，以提醒Magento 2中表单文件加载时出现警报。

我在自定义付款选项中添加了自定义表格。

我尝试添加html表单的代码内联

define
    ([
        'Magento_Checkout/js/view/payment/default',
        'jquery',
        'jquery/ui',
    ],
    function (Component,$) {
        'use strict';

        $(document).on("click","#SendOTP", function() {
            alert("Test!");
        });

        return Component.extend({
            defaults: {
                template: 'Emipro_Custompayment/payment/custompayment'
            },
        });
    });

请输入您的ID号，然后点击发送OTP以继续该过程，这有助于我们确认您的身份并确保您的交易安全。

                <table>
                <tr nowrap>
                <td nowrap>
                <label >ID Number : <span class="required"></span></label>

                </td>
                <td>
                <input id="idNumber" name="idNumber" type="text" class="form-control" AutoPostBack="True">

                </td>
                <td>
                <button id="SendOTP" type="button" class="btn btn-secondary" data-bind="click : postAction()">Send OTP</button>



                <input type="hidden" id="otpSent" value=""/>
                <input type="text" style="display:none" id="GUID" name="GUID" />
                <input type="text" style="display:none" id="pinSuccess" name="pinSuccess" />
                <input type="text"  style="display:none" id="username" name="username" value="565"  />
                <input type="text"  style="display:none" id="password" name="password" value="demo" />
                <input type="text"  style="display:none" id="orderTotal" name="orderTotal" value="50000"/>

                </td>
                <tr>
                <td>

                <label id="pinverifylabel">OTP : <span class="required"></span></label>

                </td>

                <td>
                <input id="OTP" type="text" class="form-control" autocomplete="off" >
                </td>

                <td>
                <button id="pinverifybtn" type="button" class="btn btn-secondary">Verify OTP</button>
                </td>


                <label id="otpResult"  style="display:none"></label>
                <label id="balance"  style="display:none"></label>
                <label id="labelBalance"  style="display:none"></label>
                </tr>



                </table>

Answer 1

define(
[

    'Magento_Checkout/js/view/payment/default',
    'jquery',
    'jquery/ui',




],
function (Component,$) {
    'use strict';



    return Component.extend({
        defaults: {
            template: 'Emipro_Custompayment/payment/custompayment'
        },
        initialize: function () {
            self = this;
            this._super();

        },
        getMailingAddress: function () {
            return checkoutConfig.payment.custompayment.password;
        },

        click: function($){//java code here}

Magento 2-如何将javascript函数添加到我的html自定义表单中

1 个答案: