一个form表单有两个按钮,分别提交到不同的页面

一个form表单有两个按钮,分别提交到不同的页面

html页面:

<div>
    <h3>静态资源管理</h3>
</div>
<div>
    <div class="bjui-searchBar">
        <span style="font-size: 14px; padding: 3px;font-weight: 300"> 文件名称: </span>
        <input type="text" class="input-nm" value="${staticResourceFile.fileName!}" readonly size="50" data-rule="required;length(1~128)">
    </div>
    <div class="bjui-searchBar">
        <form action="" name="upload" enctype="multipart/form-data" method="post">
            <span style="font-size: 14px; padding: 3px;font-weight: 300"> 当前目录: </span>
            <input type="text" id="currentPath" name="currentPath" value="${staticResourceFile.parentPath!}" size="50" data-rule="required;length(1~128)">
            <input type="file" name="files" value="" id="file" multiple><span>当前支持格式为:jpg,png,css,js,mp4(50M以内)</span>
            <br>
            <input type="hidden" id="filePath" name="filePath" value="${staticResourceFile.filePath!}">
            <button type="button" class="btn-blue" value="确定" onclick="confirmSubmit()">确定</button>
            <button type="button" class="btn-red" value="删除" onclick="confirmDelete()">删除</button>
        </form>

    </div>
</div>

第一种方案:js写法:

<script src="/www/web/js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">

    function confirmSubmit() {
        var action = "${ctxPath}/staticResource/upload";
        var value = document.upload.currentPath.value.replace("\", "/");
        $("#currentPath").val(value);
        document.upload.action = action;
        document.upload.submit();
    }

    function confirmDelete() {
        var action = "${ctxPath}/staticResource/delete";
        var value = document.upload.filePath.value.replace(/\/g, "/");
        $("#filePath").val(value);
        document.upload.action = action;
        document.upload.submit();
    }
</script>

第二种方案:js写法

<script>
    function confirmSubmit(){
        document.pay.action="{:U('${ctxPath}/staticResource/upload')}";
        document.pay.submit();
    }
    function confirmDelete() {
        document.pay.action = "{:U('${ctxPath}/staticResource/delete')}";
        document.pay.submit();
    }
</script>

第三种方案:form自带属性

在form属性位置action填写默认的提交路由,在下面formaction里面填写另一个需要提交的地址。

<div>
    <h3>静态资源管理</h3>
</div>
<div>
    <div class="bjui-searchBar">
        <span style="font-size: 14px; padding: 3px;font-weight: 300"> 文件名称: </span>
        <input type="text" class="input-nm" value="${staticResourceFile.fileName!}" readonly size="50" data-rule="required;length(1~128)">
    </div>
    <div class="bjui-searchBar">
        <form action="{:url('${ctxPath}/staticResource/upload')}" name="upload" enctype="multipart/form-data" method="post">
            <span style="font-size: 14px; padding: 3px;font-weight: 300"> 当前目录: </span>
            <input type="text" id="currentPath" name="currentPath" value="${staticResourceFile.parentPath!}" size="50" data-rule="required;length(1~128)">
            <input type="file" name="files" value="" id="file" multiple><span>当前支持格式为:jpg,png,css,js,mp4(50M以内)</span>
            <br>
            <input type="hidden" id="filePath" name="filePath" value="${staticResourceFile.filePath!}">
            <input type="submit" class="btn-blue" value="确定" onclick="confirmSubmit()">确定</input>
            <input type="submit" class="btn-red" value="删除" formaction="{:url('${ctxPath}/staticResource/delete')}">删除</input>
        </form>
    </div>
</div>
原文地址:https://www.cnblogs.com/no8g/p/13415590.html