指向快速路线的动态表格动作

Question

我一直试图在我的nodejs应用程序中创建一个HTML表单，该表单在提交时会定向到适当的快递路线。 从这个答案 ，我得到了下面的解决方案：

<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>

但是，问题是，无论我使用哪种构成要素的方法和函数，生成的动作字符串都是错误的。

而不是类似“ http://example.page/month/2018-01-01 ”
我得到类似“ http://example.page/?selectView=month&selectDate=2018-01-01 ”的内容

我该怎么做才能确保动态动作符合前面的示例？

编辑：所使用的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="">