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检查？ 预先感谢，Shane

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。 如果用户在一页结帐中登录，则页面将重新加载，因此模板中的简单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;?>