0

I have a form in a popup that I've been trying to use the default Magento validation with. I tried various tutorials with no luck. Even tried HTML5.

What happens is if someone just clicks the submit button the pop-up disappears and the red error message says to enter a valid email. But the pop-up is no longer there. What I need is to validate the form when they click the submit button without the form disappearing. When I tried using HTML5 I keep getting "Please match the pattern btw the pattern was pattern="/^[a-zA-Z0-9.!#$%&'*+/=?^_{|}~-]+@[a-zA-Z0-9-]+(?:.[a-zA-Z0-9-]+)*$/"` Anyway, I think the default Magento should be at least reliable but I haven't been able to get it to work.

Here is my code:

<div style="">
      <div id="newsletter-popup" class="container">
            <div class="sub-container">
                  <div class="content">
                        <div class="register-form">
                            <form id="newsletter-registration-form" action="<?php echo $this->getUrl('newsletter/subscriber/new/') ?>" method="post" id="newsletter-validate-detail">
                                    <div class="form-fields-middle">
                                        <div class="input-box">
                                            <input name="email" id="email" onfocus="if(this.value=='Enter Your Email') this.value=''" onblur="if(this.value=='') this.value='Enter Your Email'" class="input-text required-entry validate-email" type="text" value="Enter Your Email">
                                        </div>
                                    </div>
                                    <div class="actions">
                                        <button type="submit" title="<?php echo Mage::helper('core')->quoteEscape($this->__('Subscribe')) ?>" class="button"><span><span><?php echo $this->__('Subscribe') ?></span></span></button>
                                    </div>
                            </form>
                        </div>
                  </div>
            </div>
      </div>
</div>
<script type="text/javascript">    
//<![CDATA[
    var newsletterSubscriberFormDetail = new VarienForm('newsletter-registration-form', false);
//]]>
</script>

Thanks

1

Try this

<div style="">
      <div id="newsletter-popup" class="container">
            <div class="sub-container">
                  <div class="content">
                        <div class="register-form">
                             <form action="<?php echo $this->getUrl('newsletter/subscriber/new/') ?>" method="post" id="newsletter-popup-validate-detail" name="newsletter-popup-validate-detail">
                                    <div class="form-fields-middle">
                                        <div class="input-box">
                                            <input name="email" id="email" onfocus="if(this.value=='Enter Your Email') this.value=''" onblur="if(this.value=='') this.value='Enter Your Email'" class="input-text required-entry validate-email" type="text" value="Enter Your Email">
                                        </div>
                                    </div>
                                    <div class="actions">
                                        <button type="submit" title="<?php echo Mage::helper('core')->quoteEscape($this->__('Subscribe')) ?>" class="button"><span><span><?php echo $this->__('Subscribe') ?></span></span></button>
                                    </div>
                            </form>
                        </div>
                  </div>
            </div>
      </div>
</div>
<script type="text/javascript">    
//<![CDATA[
    var newsletterSubscriberFormDetail = new VarienForm('newsletter-popup-validate-detail', false);
//]]>
</script>

OR

<div style="">
      <div id="newsletter-popup" class="container">
            <div class="sub-container">
                  <div class="content">
                        <div class="register-form">
                            <form action="<?php echo $this->getUrl('newsletter/subscriber/new/') ?>" method="post" id="newsletter-popup-validate-detail" name="newsletter-popup-validate-detail">
                                    <div class="form-fields-middle">
                                        <div class="input-box">
                                            <input name="email" id="newsletter-email" class="input-text required-entry validate-email" type="text" value="">
                                        </div>
                                    </div>
                                    <div class="actions">
                                        <button type="submit" title="<?php echo Mage::helper('core')->quoteEscape($this->__('Subscribe')) ?>" class="button"><span><span><?php echo $this->__('Subscribe') ?></span></span></button>
                                    </div>
                            </form>
                        </div>
                  </div>
            </div>
      </div>
</div>
<script type="text/javascript">    
//<![CDATA[
    var newsletterSubscriberFormDetail = new VarienForm('newsletter-popup-validate-detail', false);
     new Varien.searchForm('newsletter-popup-validate-detail', 'newsletter-email', '<?php echo $this->helper('newsletter')->__('Enter Your Email') ?>');
//]]>
</script>
| improve this answer | |
  • I messed up on the id! I never noticed the two id's on the form input. Your first answer worked. Thanks – Freejoy Jul 2 '16 at 17:10

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.