javascript - Polymer Iron-form 不提交-6ren

javascript - Polymer Iron-form 不提交

转载作者：可可西里更新时间：2023-11-01 00:42:28

27

4

我正在使用 Polymer 1.0 中的 iron-form 提交带有纸质输入和纸质按钮的登录表单。

我在单击按钮时调用 submit()，但没有任何反应。我什至尝试放入一个 native 按钮，看看我的 JS 是否有错误，但它仍然没有提交。

但是，它确实显示了“----- 是必需的”弹出窗口，但它没有用纸质按钮显示。

我正在使用 PHP 动态呈现 HTML，但我也尝试让它在普通 HTML 文件中工作，这给了我相同的结果。

我不使用 gulp 来运行网络服务器，我只是使用普通的 XAMPP 设置。

登录.php:

<?php

// configuration
require("/includes/config.php"); 

// if user reached page via GET (as by clicking a link or via redirect)
if ($_SERVER["REQUEST_METHOD"] == "GET")
{
    // else render form
    render("login-form.php", ["title" => "Log In"]);
}

// else if user reached page via POST (as by submitting a form via POST)
else if ($_SERVER["REQUEST_METHOD"] == "POST")
{

    // query database for user
    $rows = query("SELECT * FROM users WHERE username = ?", $_POST["username"]);

    // if we found user, check password
    if (count($rows) == 1)
    {
        // first (and only) row
        $row = $rows[0];

        // compare hash of user's input against hash that's in database
        if (crypt($_POST["password"], $row["hash"]) == $row["hash"])
        {
            // remember that user's now logged in by storing user's ID in session
            $_SESSION["id"] = $row["id"];

            // redirect to portfolio
            redirect("/");
        }
    }

    // else apologize
    apologize("Invalid username and/or password.");
}
?>

header.html:

<!DOCTYPE html>

<head>

    <script src="/bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
   <!--<script src="/bower_components/webcomponentsjs/ShadowDOM.min.js"></script>-->
    <link rel="import" href="elements.html">
   <link rel="import" href="/styles/styles.html">

    <?php if (isset($title)): ?>
        <title>Test: <?= htmlspecialchars($title) ?></title>
    <?php else: ?>
        <title>Test</title>
    <?php endif ?>

</head>

<body>

登录表单.php:

<div class="outer">
<div class="middle">
    <div class="inner">
        <paper-material elevation="5">
            <paper-header-panel>
                <paper-toolbar>
                <div><b>Login</b></div>
                </paper-toolbar>
                <div class="content">
                    <form is="iron-form" id="form" method="post" action="index.php">
                        <paper-input name="username" label="Username" required></paper-input>
                        <paper-input name="password" label="Password" required></paper-input>
                        <paper-button raised onclick="clickHandler(event)" id="loginButton">Submit</paper-button>
                    </form>
                    <script>
                        function clickHandler(event) {
                            Polymer.dom(event).localTarget.parentElement.submit();
                            console.log("Submitted!");
                        }
                    </script>
                </div>
            </paper-header-panel>
        </paper-material>
    </div>
</div>

页脚.html:

    </body>
</html>

元素.html:

<link rel="import" href="bower_components/font-roboto/roboto.html">
<link rel="import" href="bower_components/paper-header-panel/">
<link rel="import" href="bower_components/paper-material/">
<link rel="import" href="bower_components/paper-toolbar/">
<link rel="import" href="bower_components/paper-input/paper-input.html">
<link rel="import" href="bower_components/paper-button/paper-button.html">
<link rel="import" href="bower_components/iron-form/iron-form.html">

非常感谢任何帮助!

最佳答案

iron-form元素通过 AJAX ( https://github.com/PolymerElements/iron-form/blob/master/iron-form.html#L146 ) 提交您的请求。换句话说，它不会像传统的 <form> 那样进行整页刷新。元素(这看起来像您期望的行为)。它只是获取和获取数据。

我问过团队是否可以在 iron-form 上创建一个标志元素，这样用户仍然可以通过在请求中提交他们的自定义元素值来获得好处，但是强制它使用旧的表单行为来刷新整个页面(允许服务器呈现并发送新页面)。

编辑

我建议您更换 iron-form在您的示例中使用常规表单元素，然后将 paper-* 元素中的值写入 input type="hidden"字段，并使用这些字段提交表单。

关于javascript - Polymer Iron-form 不提交，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31229330/

27

4

0

文章推荐： PHP - imagecolorat() 到 rgb 或 hex？

文章推荐： javascript - 无法使用 OpenShift 运行 socket.io 和 nodejs

文章推荐： php - preg_match_all 用逗号分隔，值可能包含空格

iron - 我在哪里可以下载 Iron Javascript
我阅读了一些关于 Iron javascript 的内容，但我要去哪里下载它？ http://dotnet.dzone.com/articles/pumping-iron-javascript. 最佳
rust - 无法编译 Iron 示例 : expected struct `iron::request::Request` , 找到结构 `iron::Request`
我正在尝试让一个简单的 Iron 示例起作用: extern crate iron; extern crate router; use iron::prelude::*; use iron::stat
ironpython - Iron Python/Iron Ruby EXE
我一直梦想从脚本语言创建一个“真正的 exe”。随着基于 DLR 的 Python 和 Ruby 实现可用，这是否更接近现实？我想创建一个“真正的应用程序”: 一个 Windows 窗体应用程序控
docker - Iron.io设置在 `iron register`步骤上获取404 Not Found
我正在通过iron.io入门指南进行操作:http://dev.iron.io/worker/getting_started/ 我正在采取步骤: Push it to Docker Hub and r
javascript - iron-page 上的 iron-scroll-threshold
我在使用 iron-scroll-threshold 以及与其他页面共享同一主机的 iron-page 时遇到问题。我的应用程序 UI 顶部有 paper-tabs。随着选项卡的更改，页面会延迟加载
html - 如何将 iron selector 与 iron pages 链接起来？
我最近一直在使用 Polymer，我有一个熨斗选择器，在纸质抽屉中放满了纸质图标元素以供导航之用。但出于某种原因，我无法让他们链接: Home
go - Polymer iron-form 或 iron-ajax 错误响应内容
我正在使用 Polymer 1.0 和 Golang 1.5。我从 Go 发送一个带有 400 Bad Request 和一些内容的 json 响应，如下所示: d := struct{ M
.net - 哪种动态 .NET 语言更适合学习，Iron Ruby 还是 Iron Python？
我想花一些时间来了解更多关于构建在 DLR 之上的动态语言的知识，但我不确定哪种语言更适合学习。时间有限，我真的只有时间去学习其中之一。从长远来看，关于这两者(Iron Ruby 或 Iron P
rust - "iron::Modifier is not implemented"尝试使用 iron 和 mime 设置响应的内容类型
我正在尝试运行 O'Reilly 出版的 Programming Rust 一书中的示例，但我坚持要使以下代码成功编译: Cargo.toml [package] name = "gcd-online
rust - 无法访问 Iron 中的参数，因为不满足特征绑定(bind) plugin::Plugin
我正在探索 Iron Web 框架的功能。据我所知，Iron core 没有可处理的 APIHTTP 参数，所以我尝试使用 params crate。 error: the trait bound `
c# - 您会推荐 Iron Ruby、Iron Python 或 PowerShell 来使 C# 应用程序成为脚本宿主吗？
您会推荐 Iron Ruby、Iron Python 或 PowerShell 来使 C# 应用程序成为脚本宿主吗？经过一些快速的修改，现在我倾向于 powershell 主要有两个原因(请注意，这
rust - 无法创建 Iron 处理程序，因为不满足特征绑定(bind) std::ops::Fn<(&mut iron::Request)>
我正在尝试为 Iron 请求创建一个处理程序: extern crate iron; extern crate mount; use iron::{Iron, Request, Response, I
html - 在 Polymer 中，为什么要使用 `<input is="iron-input">` instead of ` `？
在 Polymer 文档 ( https://elements.polymer-project.org/elements/iron-input ) 中，我发现: 而在另一个官方文档(https://
.net - "Iron"语言准备好迎接黄金时段了吗？
在生产系统中开始使用 Iron Ruby 和 Iron Python 可以吗？此外，托管它们是否有任何其他要求？另外，考虑到 F# 是一种与 Python 相同的函数式编程语言，在 .NET 框架中
Meteor Iron 路由器无法从路由获取当前路径
在模板助手中，我从 Iron.Router (iron:router) 获取当前路径如下: Router.current().route.path(this); 这工作正常，除非路由路径确实包含参数
javascript - Iron 验证行为中验证函数回调的范围问题
polymer 1.* 在父元素中，我使用Polymer.IronValidatableBehavior。我的回调函数 arg this.setInvalidStates 存在范围问题。在子元素 b
.net - (Iron)Python继承构造函数问题
所以我试图创建一个 DataGridViewColumn 的子类，它既有一个无参数构造函数，又有一个采用一个参数的构造函数，该参数需要 DataGridViewCell 类型。这是我的课: class
meteor - Iron Router 重定向而不杀死后退按钮功能
我在一个相当复杂的应用程序中使用 Iron Router，并且有一些路由将用户重定向到其他内部路由(例如， "/" 总是重定向到 "/dashboard" )。我们一直在通过添加例如Router.g
meteor - Iron Router 上的上一页位置
有没有办法在IronRouter中进入下一页之前获取上一页位置？有没有我可以用来获取这些信息的事件？提前致谢。最佳答案由于 Iron Router 使用通常的 History API，因此您可
polymer - Iron Ajax - 如何从响应功能访问响应？
我有这个元素: ... Polymer({ ... _handleResponse: function(event){ co

首页

博学

6Ren·AI

商城

javascript - Polymer Iron-form 不提交