下拉列表应在提交表单时显示所选值

Question

我在一个表单上有三个元素，三个下拉框，一个通过数据库从“年”获取值，一个通过数据库从“月”获取值的下拉框，以及第三个文本框，它是天下拉列表。 我想要的是，当我从下拉框中选择任何值并提交表单时，所选值将从下拉文本框中消失，并出现下拉列表的第一个值。

我希望 downpdown 在提交表单时显示所选值。

下面是用html和JS编写的代码，也是python的前端：

<label class="labels">Year 1:</label>

<select name='year1' id='year1' onchange ="chng_func(this.value,{{col_list}})" >
             %for item in year_lst:
    <option value="{{ item }}" selected=selected>{{ item }}</option>
     %end
 </select>

<label class="labels">Month 1:</label>

<select name = 'month1' id='month1' onchange="monthFunc()">
    %for item in month_lst:
    <option value="{{ item }}" >{{ item }}</option>
    %end 
</select>                       

<label class="labels">Day 1:</label>

<select name = 'day1' id='day1'>
    <script>
            monthFunc();
        </script>
</select>

Answer 1

您使用什么模板引擎进行 html 渲染？ Jinja、Django、Mako？这将帮助我们帮助您。 但一般来说，您需要获取提交的值并将它们放回到 html 中。这意味着您需要在 for 循环中编写一个逻辑来检查提交的值是否与循环迭代值匹配。 我不知道这个模板引擎的语法到底是什么，但它看起来像这样：

%for item in year_lst:
<option value="{{ item }}" %if item=submitted_item: selected=selected %end >{{ item }}</option>
%end

因此，在迭代过程中，您需要检查应选择的确切选项。 如果您需要更多帮助，请提供更多信息。

@更新

所以我们已经澄清您正在使用 Bottle 框架，我认为您正在使用 SimpleTemplate Engine 进行 html 渲染（从您发布的代码 sn-p 可以明显看出）。

在提交表单后，您需要执行以下操作以选择年/月/日控件的值。 您可以在this section阅读有关表单提交处理的信息。

所以让我们考虑一下你的表单提交方法是http POST：

<form method=POST ...>
</form>

在这种情况下，要处理提交的值，您需要在服务器端具有以下路由处理程序：

# this route will serve your form POST submission
@route('/your_route', method='POST')
def route_handler():

    # here you're reading selected values from request
    year1 = request.forms.get('year1')
    month1 = request.forms.get('month1')
    day1 = request.forms.get('day1')

    # and here you're setting that values back to the template to write a logic html side
    return template('your_template', year1=year1, month1=month1, day1=day1)

最后你的 html 应该是这样的：

<select name='year1' id='year1' onchange ="chng_func(this.value,{col_list}})" >
    %for item in year_lst:
    <option value="{{ item }}" {{ "selected=selected" if item = year1 else "" }}>{{ item }}</option>
    %end
</select>

让我们看看这部分是做什么的：{{ "selected=selected" if item = year1 else "" }}。基本上就是说如果我们的循环值item等于提交的值year1，那么输出"selected=selected"文本到html，即将使选定的年份选项呈现为选中状态。您可以阅读有关内联表达式的信息here。

您需要相应地更改月份和日期选择。 就是这样，如果您还有其他问题，请告诉我。