web.input() 不接收表单数据

Question

所以我正在尝试创建一个简单的注册表单，供用户输入他们的信息并提交以供处理。我在获取表单数据时遇到问题。该站点的设置方式是，我有“/register”表单，然后将 ajax 请求发送到 url“/postregister”。从那里，输入从 web.input() 获取数据的 class，然后根据需要引用数据。或者至少那是意图...

我的问题出在第一步：从“/register”页面抓取表单数据。实际上什么都没有传递。

这里是register.html

<div class="container">
    <h2>Register Account</h2>
    <br /><br />
    <form id="register-form">
        <div class="form-group label-static is-empty>
        <label for="username" class="control-label">Username</label>
        <input id="username" class="form-control" type="text" placeholder="Choose a username..."/>
    </div>
    <button type="submit" class="btn btn-info">Submit </button>
    </form>
</div>

主要controller.py:

import web

urls = (
    '/', 'Home',
    '/register', 'Register',
    '/postregistration', 'PostRegistration'
)

render = web.template.render("Views/Templates", base="MainLayout")
app = web.application(urls, globals())

class Home:
    def GET(self):
        return render.Home()

class Register:
    def GET(self):
        return self.Register()

class PostRegistration:
    def POST(self):
        data = web.input()
        print "data:   " + str(data) # This line is for debugging
        return data.username

if __name__ == "__main__":
    app.run()

加上js:

$(document).ready(function() {
    console.log("loaded");

    $(document).on("submit", "#register-form", function(e) {
        e.preventDefault();

        var form = $("#register-form").serialize();
        console.log(form); //This is just for debugging
    $.ajax({
        url: '/postregistration',
        type: 'POST',
        data: form,
        success: function(response){
        console.log(response);
        }
    });
    });
});

当我运行 controller.py 并导航到 localhost:8080/register 时，系统会提示我填写表格。 成功！现在我输入信息并点击提交。 问题！！ 检查控制台日志时，实际上并没有捕获表单。引发了 "AttributeError"，带有 AttributeError：'username'。果然，controller.py 打印：

data:   <storage {}>

所以我看到 web.input() 没有抓取任何数据。再往前一点，在 Web 控制台中，我可以看到 "loaded" 已写入，然后当我单击提交时，我可以看到向控制台写入了一些内容（但实际上什么也没有）。同样，所有迹象都表明我没有获取表单数据。我哪里出错了？

Answer 1

我认为您的 jQuery 选择器是错误的：

var form = $("register-form").serialize();

应该是

var form = $("#register-form").serialize();

Source

这可能会导致没有元素被选择用于 .serialize() 序列化。

Answer 2

缩进错误：

class PostRegistration:
    def POST(self):
        data = web.input()
    print "data:   " + str(data) # This line is for debugging
    return data.username

需要：

class PostRegistration:
    def POST(self):
       data = web.input()
       print "data:   " + str(data) # This line is for debugging
       return data.username

在jquery方面，.serialize()将忽略所有没有name属性的输入。这就是为什么您没有收到任何通过网络发送的内容。

解决方案是将 name='username' 添加到您的输入中。

Answer 3

看起来序列化方法忽略了所有字段，因为它们不包含名称属性。如果你像这样将它添加到寄存器条目：

<div class="form-group label-static is-empty">
        <label for="username" class="control-label">Username</label>
        <input id="username" class="form-control" type="text" name="username" placeholder="Choose a username" />
</div>

然后将填充表单变量。这仍然是 returns 尝试使用行 data.username...

访问字段时出现 500 错误

来源： JavaScript - Getting HTML form values https://api.jquery.com/serialize/

web.input() 不接收表单数据

web.input() not taking on form data

javascript

python

forms

input

web.py