Question

嗨我有一个表格，让我说http://www.domain1.com使用jquery验证并成功验证我希望它将表单提交给我使用的upsales.com（一个crm系统）（但我无法控制在upsales.com上的代码）并在新标签页中打开一个链接 - 让我们说：http://www.domain1.com/file.pdf，以及提交表单，这是我尝试过的：

jQuery('.propertyDetailForm').validate({
    rules: {
        'Client.name': {
            required: true,
        },
        'Contact.email': {
            required: true,
            email: true
        },
        'Contact.phone': {
            minlength: 9,
            required: true
        }
    },
    submitHandler: function(form) {
        jQuery('#submitForm').click(); 
        jQuery('.propertyDetailForm').submit();
    }
});

这是我需要点击成功验证的链接：jQuery（'＃submitForm'）。click（）;

但目前它只提交表单而不是模仿点击。

我也尝试过submitHandler：

jQuery('.propertyDetailForm').validate({
    rules: {
        'Client.name': {
            required: true,
        },
        'Contact.email': {
            required: true,
            email: true
        },
        'Contact.phone': {
            minlength: 9,
            required: true
        }
    }
});       

if (jQuery(".propertyDetailForm").validate().form()) {
    jQuery('#submitForm').click(); 
    jQuery('.propertyDetailForm').submit();
}

我的HTML是：

<form id="upsales_form" class="main-prop form inline upsale-form propertyDetailForm" method="POST" action="https://power.upsales.com/api/external/formSubmit" novalidate="novalidate">
    <div class="control-group">
        <label for="Client.name" class="control-label">Name*:</label>
        <div class="controls">
            <input type="text" required="" placeholder="Name*:" id="ClientName" name="Contact.name" class="form-control required">
        </div>
    </div>
    <div class="control-group">
        <label for="Contact.email" class="control-label">Email*:</label>
        <div class="controls">
            <input type="text" required="" placeholder="Email*:" name="Contact.email" class="form-control required email">
        </div>
    </div>
    <div class="control-group">
        <label for="Contact.phone" class="control-label">Phone*:</label>
        <div class="controls">
            <input type="text" required="" placeholder="eg. 952123456" id="Contact.phone" name="Contact.phone" class="form-control required input-small">
        </div>
    </div>

    <div id="check-group" class="control-group chkbox-container">
        <label class="checkbox">
            <input type="checkbox" value="on" id="Client.custom_47" name="Client.custom_47" class="form-control">
            Please tick if you require a mortgage
            <img width="30" src="assets/media/images/logo_dnb_100.jpg">
        </label>
        <div class="clearfix"></div>
    </div>

    <div class="control-group">
        <div class="controls">
            <div id="buttonWrapper">
                <a target="_blank" id="submitForm" href="http://www.domain.com/file.pdf" style="display: none;"></a>
                <button class="btn btn-success" id="upsalesSubmit" type="submit">Download Property PDF NOW</button>
            </div>
        </div>
    </div>
</form>

Answer 1

提交有效表单后将运行的代码...

submitHandler: function(form) {
    jQuery('#submitForm').click(); 
    jQuery('.propertyDetailForm').submit();
}

您的.submit()将提交表单并重定向浏览器，以便在表单action属性中加载网址...

action="https://power.upsales.com/api/external/formSubmit"

如果标签位于新页面上，则在到达之前无法打开它。客户端JavaScript只能控制当前加载的页面，而不能控制其他页面。

您尚未显示选项卡的代码，但通常，jQuery选项卡插件允许您使用锚点加载已打开选项卡的页面。像这样......

action="https://power.upsales.com/api/external/formSubmit/#Tab3"

表单提交，验证并在新标签

1 个答案: