Magento 使用 jQuery 通过电子邮件检查客户是否已经存在

Question

我试图避免离线用户在已注册为客户的 firecheckout 页面上输入电子邮件。因此，我在我的一个开发控制器中创建了这个示例 php 脚本：

public function mailExists(Varien_Object $customer, $mail, $websiteId)
{
    if($websiteId){
        $customer->setWebsiteId($websiteId);
    }
    $customer->loadByEmail($mail);
    if($customer->getId()){
        return $customer->getId();
    }
    return FALSE;
}

public function formAction()
{
    $customer = Mage::getModel('customer/customer');
    $websiteId = Mage::app()->getWebsite()->getId();
    $email = $_POST['email'];
    if($this->mailExists($customer, $email, $websiteId))
    {
        echo 'mail <u>'.$email.'</u> exists containing customer id '.$this->mailExists($customer, $email, $websiteId);
    }
    else{
        $this->_formPost();
    }
}

public function _formPost()
{
    echo "<form enctype='multipart/form-data' action='".Mage::getUrl('index/form/')."' method='post'>";
    echo "<input type='text' value='shane.test@hotmail.com' id='email' name='email' />";
    echo "<input type='submit' value='verzend' />";
    echo "</form>";
}

效果很好。但我担心的是，当有人在结帐页面上输入所有字段并按下提交按钮时，所有输入的数据都会被设置为空。这会让我的客户感到沮丧。所以我认为jQuery脚本会更好地通知离线客户不要使用已经注册的电子邮件，或者在他们在电子邮件地址输入字段中输入电子邮件地址时登录他们的帐户。

我想让我的 jQuery 脚本在用户在电子邮件输入字段中输入的文本上运行。 我只是想出了这个：

public function testAction()
{
    echo("
            <script src='http://code.jquery.com/jquery-latest.js'></script>
            <script type='text/javascript'>
            $(document).ready(function()
            { 
                $('#email').onChange(function()
                {
                    alert('input');
                });
            });
            </script>
        ");
    $this->_testPost();
}

public function _testPost()
{
    echo "<form name='test' enctype='multipart/form-data' action='".Mage::getUrl('index/form/')."' method='post'>";
    echo "<input type='text' value='' id='email' name='email' />";
    echo "<input type='submit' value='verzend' />";
    echo "</form>";
}

这会在警报框上打印input。我将如何在 jQuery 中实现我的 php 检查？ 提前致谢， 谢恩

Answer 1

我将使用 jQuery AJAX 调用来调用您的控制器函数，我将其重写为如下所示：

public function ajaxAction()
{
    $customer = Mage::getModel('customer/customer');
    $websiteId = Mage::app()->getWebsite()->getId();

    if (array_key_exists('email', $_POST)) {
        $email = $_POST['email'];
    } else {
        $this->getResponse()->setBody(false);
        return;
    }
    if ($websiteId) {
        $customer->setWebsiteId($websiteId);
    }
    $customer->loadByEmail($email);
    if ($customer->getId()) {
        $this->getResponse()->setBody(true);
        return;
    }
    $this->getResponse()->setBody(false);
    return;
}

所以你真的想把你所有的 javascript 从你的控制器中移到你的视图中，然后使用 jQuery.ajax 方法来做类似的事情：

    var mail = 'a@a.com';
jQuery.ajax({
    type: "POST",
    url: "<?php echo Mage::getUrl('your/frontend/ajax') ?>",
    dataType: "json",
    data: {email: mail},
    success: function (exists) {
        if (exists == 0) {
            // js for fail, hide disable button etc etc
        } else if (exists == 1) {
            // js for success bits
        }
    },
    error: function (jqXHR, textStatus, errorThrown) {
                   // error handling
    }
});

AJAX 的美妙之处在于您可以在需要时触发检查，因此您可以监听电子邮件是否完整，并在他们输入详细信息后立即触发请求。

Answer 2

你不需要 ajax。如果用户在 onepage checkout 中登录，则页面会重新加载，因此模板中的简单 javascript 应该可以工作。 您可以直接在页面加载时进行检查，并且仅在需要时添加 javascript。
例如：

<?php if({your check for the email}):?>
<script type='text/javascript'>
    $(document).ready(function()
    { 
        $('#email').onChange(function()
        {
            alert('input');
        });
    });
</script>
<?php endif;?>

或者如果您想使用原型而不是 jquery：

<?php if({your check for the email}):?>
<script type='text/javascript'>
    $(document).observe('dom:loaded', function(){         
        $('#email').observe('change', function(){            
            alert('input');
        });
    });
</script>
<?php endif;?>