Question

我一直在尝试在我的nodejs应用中创建一个HTML表单，该表单在提交时会指向相应的快速路由。从this answer开始，我已经得到了以下解决方案：

<script>
$('#controlPanel').submit(function(event) {
  var view = document.getElementsByName('selectView').value;
  var date = document.getElementsByName('selectDate')
    .value
    .toISOString()
    .slice(0, 10);
  var action = "/".concat(view).concat("/").concat(date);
  $(this).attr('action', action);
});
</script>

然而，问题是，无论我将组件元素放在哪个方法和函数，结果操作字符串都是错误的。

而不是＆＃34; http://example.page/month/2018-01-01＆＃34;
我得到类似＆＃34; http://example.page/?selectView=month&selectDate=2018-01-01＆＃34;

的内容

如何确保动态操作符合前一个示例？

编辑：使用的HTML（也将上面的脚本html标签附加到上面的代码中）：

<form id="#controlPanel">
  View:<select name="selectView">
    <option value="year">Year</option>
    <option value="month">Month</option>
    <option value="week">Week</option>
    <option value="day">Day</option>
  </select><br/>
  Date: <input type="date" name="selectDate" min="2007-01-01"><br/>
  <input type="submit" value="Submit">
</form>

Answer 1

发现了一些试图解决这个问题的事情：
由于未知原因，使用attr（）不起作用尝试将方法设置为POST会导致异常（是的，即使我对路由器进行了更改以使路由使用POST）。
使用GET仍然坚持GET参数？最后的分隔符，但尽管如此，路线仍按预期运行。

我最终得到的解决方案，其他人试图做类似的事情：

<script>
 document.addEventListener("DOMContentLoaded", function () {
   document.getElementById("#controlPanel").addEventListener("submit", function(event) {
     event.preventDefault();
     var view = document.getElementsByName('selectView')[0].value;
     var date = document.getElementsByName('selectDate')[0].value !== "" ? document.getElementsByName('selectDate')[0].value.slice(0, 10) : "";
     var action = "/".concat(view).concat("/").concat(date);
     document.getElementById("#controlPanel").action = action;
     document.getElementById("#controlPanel").submit();
   });
 });
</script>

HTML的唯一相关内容：

<form id="#controlPanel" method="get" action="">

指向快速路线

1 个答案: