Javascript Plone 中的表单处理问题

Question

我在 Plone 的一个页面中创建了一个 HTML 表单，用于处理 Javascript 提交时收到的代码。 Javascript 已放置在 plone_skins > 自定义中。该代码是检查调用页面的 URL 中的关键字，该关键字表示浏览器在通过第三方服务验证后需要重定向到的另一个页面的地址。代码如下所示：

function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split("&");
    for (var i=0;i<vars.length; i++) {
        var pair = vars[i].split("=");
        if(pair[0] == variable){return pair[1];}
    }
    return false;
}

function setLoginUrl(form) {
    var target = getQueryVariable("keyword");
    var loginUrl = "https://our.shibboleth.login.address.here";
    if(target != false) {
        loginUrl = loginUrl + "?keyword=" + keyword;
    }
    form.action = loginUrl;
    return true;
}

我已经禁用了 Plone 页面的 TinyMCE 以及随附的表单和登录按钮，这样 "onsubmit" 就不会被删除。这是页面的代码：

<form name="processLogonForm" action ="" onsubmit="setLoginUrl(this);" method="post">
<input type=submit value="Instructors & Students"/>
</form>

我已经在 Plone 之外测试了 Javascript，它会按预期重定向到正确的页面，并将关键字标记中的信息也传递到下一页。但是，在 Plone 中，提交表单会导致重新加载相同的页面。积极的一面是，如果包含关键字标记 URL，它会传递到重新加载的页面，但我更希望提交将用户带到授权页面。

我已经在 Plone 中注册了脚本，在页面中启用了脚本标签，并测试了其他 Javascript 代码以确保我将所有内容正确地导入 Plone。关于这段代码我可能忽略了什么，有什么建议吗？

更新：我已经采纳了此处给出的建议来创建一个包含代码的自定义页面模板。我发现我忘记包含金属标签以将脚本传递给使用此视图的页面。我可以在 Plone 生成页面的源代码中看到脚本。但是，页面继续自行重新加载。

Answer 1

这更像是一个 "if you don't need to do this, try this other thing" 的答案。如果你需要做的只是运行一些 JS，而不是试图让它在转换和 TinyMCE 的情况下工作，你应该考虑创建一个自定义视图模板并将你需要的一切都放在那里； none 它会被转换所触及。如果（我认为这里是这种情况）您实际上不需要 Plone 的功能，这是绕过 Plone 的一种干净方法。

Answer 2

我猜你的 onsubmit 被覆盖了，永远不会运行。

不止 TinyMCE 使用了 onsubmit。此外，您无论如何都不应该禁用 tinymce。 TinyMCE 应该只影响加载编辑器的页面。

两件事。首先，验证你的 JS 没有得到运行。使用调试器语句或只是在其中抛出一个 alert('hi') 语句。

接下来，由于可能还有其他使用提交事件的东西，只需使用 jQuery 来完成您的工作，而不是 onsubmit 属性（onsubmit 无论如何都不是执行 js 事件的好方法）。

您的 JavaScript 代码将是 类似于 的代码：

function getQueryVariable(variable) {
    var query = window.location.search.substring(1);
    var vars = query.split("&");
    for (var i=0;i<vars.length; i++) {
        var pair = vars[i].split("=");
        if(pair[0] == variable){return pair[1];}
    }
    return false;
}

function getLoginUrl() {
    var target = getQueryVariable("keyword");
    var loginUrl = "https://our.shibboleth.login.address.here";
    if(target != false) {
        loginUrl = loginUrl + "?keyword=" + keyword;
    }
    return loginUrl;
}
$(document).ready(function(){
  $('[name="processLogonForm"]').submit(function(){
    var $el = $(this);
    $el.attr('action', getLoginUrl());
  });
})

Javascript Plone 中的表单处理问题

Javascript form processing issue in Plone

javascript

plone

plone-4.x