【问题标题】:Underscore.js template form fields don't submitUnderscore.js 模板表单字段不提交
【发布时间】:2014-06-05 00:39:16
【问题描述】:

我在测试所有应用程序的表单提交时遇到了一个小问题。这是一个带下划线的主干应用程序。

我注意到,在两个包含循环的表单上,当按下提交按钮时,这些循环中的表单字段不会发送。我不知道为什么!

这是一个提交表单的示例

<form role="form" action="" method="POST" id="voters-guide-survey">
    <div class="row">
        <div class="col-xs-4">
            Candidate #: <strong><%= candidate.id %></strong>
        </div>
        <div class="col-xs-4">
            Name: <strong><%= candidate.firstName %> <%= candidate.lastName %></strong>
        </div>
    </div>

    <hr />

    <div class="row">
        <div class="col-xs-12">
            <p>The following are 5 policy statements dealing with issues in the news. Please check the option that best reflects your point of view.</p>
        </div>
    </div>

<% _.each(questions, function(questionData) { %>
    <div class="row">
        <div class="form-group col-xs-8">
            <%= questionData.question %><br />
            <input type="hidden" name="question-<%= questionData.id %>" value="<%= questionData.question %>" />
            <span class="error" for="survey-question-<%= questionData.id %>"></span>
        </div>
    </div>

    <div class="row">
        <div class="form-group col-xs-6">
            <% _.each(questionData.options, function(option) { %>
            <label class="radio-inline"><input type="radio" name="survey-question-<%= questionData.id %>" value="<%= option.name %>" required /> <%= option.name %></label><br />
            <% }); %>
        </div>
    </div>
<% }); %>

    <hr />

    <div class="row">
        <div class="form-group col-xs-4 col-xs-offset-4">
            <input type="hidden" name="numQuestions" value="<%= questions.length %>" />
            <% if (pageStatus == 'disabled') { %>
            <a href="javascript:void(0);" path="questionnaire/endorsements" candidate-id="<%= candidate.id %>">Continue to Next Page &raquo;</a>
            <% } else { %>
            <input type="hidden" name="id" value="<%= candidate.id %>" />
            <input type="hidden" name="page" value="endorsements" />
            <input type="submit" name="save-questionnaire" value="Submit and Continue" />
            <% } %>
        </div>
    </div>
</form>

循环正在遍历以下数据

    {
    "questions": [
        {
            "id": 1,
            "question": "Question 1",
            "options": [
                {"id": 1, "name": "Strongly agree"},
                {"id": 2, "name": "Somewhat agree"},
                {"id": 3, "name": "Have mixed feelings"},
                {"id": 4, "name": "Somewhat disagree"},
                {"id": 5, "name": "Strongly disagree"},
                {"id": 6, "name": "Have no opinion"},
                {"id": 7, "name": "Do not wish to respond"}
            ],
            "answer": ""
        },
        {
            "id": 2,
            "question": "Question 2",
            "options": [
                {"id": 1, "name": "Strongly agree"},
                {"id": 2, "name": "Somewhat agree"},
                {"id": 3, "name": "Have mixed feelings"},
                {"id": 4, "name": "Somewhat disagree"},
                {"id": 5, "name": "Strongly disagree"},
                {"id": 6, "name": "Have no opinion"},
                {"id": 7, "name": "Do not wish to respond"}
            ],
            "answer": ""
        },
        {
            "id": 3,
            "question": "Question 3",
            "options": [
                {"id": 1, "name": "Strongly agree"},
                {"id": 2, "name": "Somewhat agree"},
                {"id": 3, "name": "Have mixed feelings"},
                {"id": 4, "name": "Somewhat disagree"},
                {"id": 5, "name": "Strongly disagree"},
                {"id": 6, "name": "Have no opinion"},
                {"id": 7, "name": "Do not wish to respond"}
            ],
            "answer": ""
        },
        {
            "id": 4,
            "question": "Question 4",
            "options": [
                {"id": 1, "name": "Strongly agree"},
                {"id": 2, "name": "Somewhat agree"},
                {"id": 3, "name": "Have mixed feelings"},
                {"id": 4, "name": "Somewhat disagree"},
                {"id": 5, "name": "Strongly disagree"},
                {"id": 6, "name": "Have no opinion"},
                {"id": 7, "name": "Do not wish to respond"}
            ],
            "answer": ""
        },
        {
            "id": 5,
            "question": "Question 5",
            "options": [
                {"id": 1, "name": "Strongly agree"},
                {"id": 2, "name": "Somewhat agree"},
                {"id": 3, "name": "Have mixed feelings"},
                {"id": 4, "name": "Somewhat disagree"},
                {"id": 5, "name": "Strongly disagree"},
                {"id": 6, "name": "Have no opinion"},
                {"id": 7, "name": "Do not wish to respond"}
            ],
            "answer": ""
        }
    ]
}

关于下划线模板的工作方式,我是否遗漏了什么?

当点击提交按钮时,唯一传入的数据是循环外的东西,所以只有最后的隐藏字段。

我该如何进行这项工作?

【问题讨论】:

    标签: javascript forms backbone.js underscore.js


    【解决方案1】:

    天啊,我有时真傻。它与下划线无关,也与我的字段名称中包含连字符这一事实无关。我忘记了我必须还原一些表单文件,并且忘记更改连字符。

    对不起!

    【讨论】:

    • 字段名称中有连字符会产生什么问题?我认为没有任何规则期望以字母开头。
    • 下划线本身并没有引起任何问题,但是当我在字段名称中使用连字符而不是下划线时(即&lt;input name="something-here" /&gt;,当我收集以这种方式形成:$('form#form-id').serializeObject()我之前遇到过这个问题,我以为我已经解决了所有形式的问题,但显然我错过了一些。
    猜你喜欢
    • 2015-02-06
    • 2011-12-24
    • 1970-01-01
    • 2014-07-24
    • 2014-12-20
    • 1970-01-01
    • 2020-11-09
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多