更改表单操作 onchange() 选项字段并提交相同的表单不起作用

Question

我有一个表单，其中有一个下拉列表 select离子框。我的要求是当用户从 select 框中更改选项时，表单操作应相应更改并且表单应自动提交。我的表单部分中有以下代码：

<form id="topicSelectionFormId" action="${headerLink.topicUrl}" method="GET">
    <select id="topic-option-id" class="dd-custome-new" onchange="changeTopic(this)">
        <c:forEach items="${headerLink.topicList}" var="topic">
            <option value="${topic.menuItemId}" ${topic.menuItemId == headerLink.topicId ? 'selected' : ''}>${topic.name}</option>
        </c:forEach>
    </select>
</form>

然后我有 javascript 代码来处理表单操作更改部分：

<script>
function changeTopic(sel){
    var topicId = sel.value;
    var formAction = $('#topicSelectionFormId').prop('action') + topicId;
    alert(formAction);
    $("#topicSelectionFormId").attr("action", formAction);
    $("#topicSelectionFormId").submit();
}
</script>

警报显示了我需要的正确的表单操作。但是表单没有提交到想要的url。有人可以帮忙吗？

Answer 1

我认为您需要在操作中设置为所需的 url.. 而不是 formAction

Answer 2

    function changeTopic(sel){
        var topicId = sel.value;
        document.topicSelectionFormId.action = topicId;
        document.topicSelectionFormId.submit();
    }

    <form name="topicSelectionFormId" action="action-default" method="GET">
      <select id="sss" onchange="changeTopic(this);">
        <option value="action1">action1</option>
        <option value="action2">action2</option>
      </select>
    </form>

Answer 3

您的代码在我的 IE11 浏览器中完美运行。在浏览器的开发人员工具中，检查 network ，您的请求是否符合要求 url 以及您收到的响应。

这不是我的答案，但我没有足够的声誉来评论你的问题，所以写在这里

更改表单操作 onchange() 选项字段并提交相同的表单不起作用

chnage form action onchange() option filed and submit the same form not working

javascript

jquery

jsp

jstl