jquery - 嵌入式表单在 Episerver 内容块中不起作用

问题描述

随着我了解有关我的问题的更多信息，此问题已被编辑。

我的任务是将 MailChimp 订阅表单嵌入到 Episerver 安装中的内容块中。

表格不起作用。看起来不错！但是当用户点击“提交”时，它只是刷新了页面。

这些表单在 Mailchimp 托管时有效，但在嵌入到我们 Episerver 站点上的内容块中时无效（已全部尝试过）。
这些表单嵌入在我桌面上的静态、非托管 HTML 文件中时有效。
我已经禁用了主测试页面上的每个 jquery 脚本，想知道那里是否有东西（也许是验证器）干扰了表单。但是禁用所有脚本后，表单在提交时仍然会刷新页面。

我不知道是什么导致了任何冲突，这会使简单的 HTML 表单忽略其“action=”属性，而是刷新页面。这当然是我的一个错误或无知：但在我的挖掘中我一直无法找到答案，所以我向大家寻求帮助。

如果我没有提供足够的信息，请让我知道还包括什么。

根母版页文件顶部的链接脚本

    <script src="/Scripts/jquery-3.1.1.min.js"></script>
    <script src="/Scripts/bootstrap.min.js"></script>
    <script type="text/javascript" src="/Scripts/bootstrapValidator.min.js"></script>

根母版页文件底部的脚本

        <script type="text/javascript">var addthis_config = { "data_track_addressbar": false };</script>
        <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=redacted"></script>
        <script type="text/javascript">
            if (document.location.hostname == "redacted") {

                (function (i, s, o, g, r, a, m) {
                    i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
                        (i[r].q = i[r].q || []).push(arguments);
                    }, i[r].l = 1 * new Date(); a = s.createElement(o),
                    m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m);
                })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');

                ga('create', 'redacted', 'auto');
                ga('require', 'displayfeatures');
                ga('send', 'pageview');

            }
        </script>

来自另一个包含的 ascx 文件 (mainnav) 的脚本

<script>
    $(function () {
        // Setup drop down menu
        $('.dropdown-toggle').dropdown();

        // Fix input element click problem
        $('.dropdown-menu input, .dropdown-menu label').click(function (e) {
            e.stopPropagation();
        });
    });
</script>

表单，在 ascx 视图文件中

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="MailChimpBlockControl.ascx.cs" Inherits="JamesTrustWF.Web.Views.Blocks.MailChimpBlockControl" %>

<div class="panel panel-default">
    <div class="panel-body" style="margin: 0;padding:0;">

        <!-- Begin Mailchimp Signup Form -->
        <div id="mc_embed_signup">
        <form action="url-provided-by-mailchimp" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
            <div id="mc_embed_signup_scroll">
            <h2>Subscribe</h2>
        <div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
        <div class="mc-field-group">
            <label for="mce-FNAME">First Names  <span class="asterisk">*</span>
        </label>
            <input type="text" value="" name="FNAME" class="required" id="mce-FNAME">
        </div>
        <div class="mc-field-group">
            <label for="mce-LNAME">Last Name </label>
            <input type="text" value="" name="LNAME" class="" id="mce-LNAME">
        </div>
        <div class="mc-field-group">
            <label for="mce-EMAIL">Email Address  <span class="asterisk">*</span>
        </label>
            <input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
        </div>
            <div id="mce-responses" class="clear">
                <div class="response" id="mce-error-response" style="display:none"></div>
                <div class="response" id="mce-success-response" style="display:none"></div>
            </div>    <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
            <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="redacted" tabindex="-1" value=""></div>
            <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
            </div>
        </form>
        </div>

        <!--End mc_embed_signup-->

    </div>
</div>

标签： jqueryformsepiserver

jquery - 嵌入式表单在 Episerver 内容块中不起作用

问题描述

解决方案

推荐阅读