douliangli6407 2014-10-01 02:50
浏览 46

iFrame将信息传递给Ajax并触发Ajax中的submit按钮

I'm having a problem where the Ajax is not triggering the respected event.

I have two forms, one visible and one hidden.

  1. In the visible form, the user can enter an email address.
  2. When the user clicks the submit button of the visible form, the default submit is prevented, and through Ajax the email is validated.
  3. If the email address is not valid, an error message will appear.
  4. If the email address IS valid, the submit button of the hidden form should be clicked using JS (in the ajax-success function).

Here is more code for reference:

HTML

Visible Form

<form accept-charset="utf-8" id="contactForm1" style="margin-top:;" action="https://app.getresponse.com/add_contact_webform.html?u=IzDa" method="post">
    <input class="wf-input wf-req wf-valid__email" type="text" name="email" data-placeholder="yes" id="email" value="Enter Your Email Here" 
        onfocus="if (this.value == 'Enter Your Email Here') {this.value = '';}" 
        onblur="if (this.value == '') {this.value = 'Enter Your Email Here';}" 
        style="margin-top:0px;" />
    <br />
    <input type="submit" class="wf-button" name="submit1" value=" " style="display:inline !important; margin-top:-10px !important;" />    
</form>

Hidden Form

<form method="post" id="aweber" class="af-form-wrapper" action="http://www.aweber.com/scripts/addlead.pl">
    <div style="display:none;">
        <input type="hidden" name="meta_web_form_id" value="947846900" />
        <input type="hidden" name="meta_split_id" value="" />
        <input type="hidden" name="listname" value="awlist3599001" />
        <input type="hidden" name="redirect" value="http://www.aweber.com/thankyou.htm?m=default" id="redirect_37ecf313df3b6f27b92c34c2c00ef203" />
        <input type="hidden" name="meta_adtracking" value="ibb_test" />
        <input type="hidden" name="meta_message" value="1" />
        <input type="hidden" name="meta_required" value="email" />
        <input type="hidden" name="meta_tooltip" value="" />
    </div>

    <div id="af-form-947846900" class="af-form"><div id="af-body-947846900"  class="af-body af-standards">
        <div class="af-element">
            <label class="previewLabel" for="awf_field-66127140">Email: </label>
            <div class="af-textWrap"><input class="text" id="awf_field-66127140" type="text" name="email" value=""  />
            </div><div class="af-clear"></div>
        </div>
        <div class="af-element buttonContainer">
            <input name="submitaw" id="submitaw" class="submitaw" type="submit" value="Submit" tabindex="501" />
            <div class="af-clear"></div>
        </div>
        </div>
    </div>

    <div style="display:none;"><img src="http://forms.aweber.com/form/displays.htm?id=nCzsHCxsnAwM" alt="" /></div>
</form>

JS

Ajax for visible form

$('#contactForm1').click(function(e) {
    e.preventDefault();
    var email = $('#email').val();
    var self = this;

    $.ajax({
        type: 'POST',
        dataType: 'JSON',
        url: 'check.php',
        data: {
            email: email
        },
        success: function (data) {
            if (data.status == 'success') {
                self.submit();
            } else {
                alert('The e-mail address entered is not valid.');
            }
        }
    });
});

So here's how the scenario would be:

  1. User enters email address, and clicks the submit button.
  2. Ajax-call checks whether it's a valid email.
  3. If the email is valid, the Ajax success function of the visible form
    • first sets the email value of the hidden form
    • and then triggers the submit button of the hidden form

As said before, STEP 3 isn't working.

  • 写回答

1条回答 默认 最新

  • douju8782 2014-10-02 05:53
    关注

    use complete instead success

    $('#contactForm1').click(function(e) {
        e.preventDefault();
        var email = $('#email').val();
        var self = this;
        $.ajax({
            type: 'POST',
            dataType: 'JSON',
            url: 'check.php',
            data: {
                email: email
            },
            complete: function(data) {
                if (data.status == 'success') {
                    self.submit();
                } else {
                    alert('The e-mail address entered is not valid.');
                }
            }
        });
    });
    
    评论

报告相同问题?

悬赏问题

  • ¥15 MATLAB动图的问题
  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名