Question

我的回调表单可以正常工作，但是当客户按下“提交”按钮时，通知Your request sent successfully将出现在按钮旁边，并且如果用户在“提交”按钮上单击了几次，则将几个请求发送到服务器，但是我需要的是，当用户按下“提交”按钮时，回调表单将被隐藏，并且新表单带有Your request sent successfully将出现。

 $json = [
            'status' => 1,
            'text' => _('Your request successfully sent')
        ];
        die(json_encode($json));

    } else {

        $error = [
            'status' => 0,
            'text' => _('Write Full name and phone number')
        ];
        die(json_encode($error));

    }

}

ajax

$.ajax({
        url: "../../engine/ajax/eogpo.php",
        type: "POST",
        dataType: "JSON",
        data: {
            action: 'orderCallWidget',
            phone: $('#phoneWidget').val(),
            FIO: $('#FIOWidget').val(),
            data: $('input, select').serialize()
        },
        beforeSend: function() {
            $("#overLoader").show();
        },
        success: function(data) {
            if(data.status) {
                $('.product__form__error').html("");
                $("#successMessage").html(data.text);
            } else {
                $("#successMessage").html("");
                $('.product__form__error').html(data.text);
            }
            $("#overLoader").hide();
        },
        error: function() {
            $('.product__form__error').html('<?php echo _("Unknown error"); ?>');
            $("#overLoader").hide();
        }
    });
});

Answer 1

在$("#successMessage").html(data.text);之后添加此内容

$("#your callbackform classname").html("Your request sent successfully");

Answer 2

好吧，假设您的按钮的ID为 myButton ，只需在$("#overLoader").hide();之后添加即可：

$("#myButton).attr("disabled",true);

您可以轻松地对此进行调整以隐藏div或从DOM中完全删除元素。

成功提交后如何隐藏回调表单？

2 个答案: