从脚本调用两个控制器方法

Calling two controller methods from script

本文关键字：两个 控制器 方法 脚本 调用      更新时间：2023-09-26

我试图在我的控制器中调用两个方法。一个开始转换，一个将转换的百分比返回给视图以更新进度条。转换是通过在调用getPercentage函数之前单击"startConversion"按钮开始的。然而，只有转换开始，而百分比函数不会。我已经尝试开始的百分比功能，它的工作原理，但我按下转换按钮后setTimeout停止，它不会更新了。

有没有人有一个建议，什么可能是错误的，任何方法来解决它?

//View
<script type="text/javascript" >
    $(window).load(function () {
        startConvert();
    });
    function startConvert() {
        document.getElementById("startConversion").click()
        getPercentage();
    }
    function getPercentage() {
            $.ajax(
            {
                type: "POST",
                url: "@Url.Action("GetPercentage","File")",
                success: function (result) {
                    $('#div').html(result);
                    var r = result;
                    progressBarSim(r);
                },
                error: function (req, status, error) {
                    alert("Fail");
                }
            });
        setTimeout(getPercentage, 500);
    }
</script>
<form action="" method="post" enctype="multipart/form-data">         
    <input id="startConversion" type="Submit"  name="Convert" />
</form>
//FileController
[HttpPost]
public double GetPercentage() {
    return enc.Percent;
}
[HttpPost]
public ActionResult Convert()
{
... //Removed
}

您提交的表单基本上会导致浏览器加载一个新页面(无论表单操作的结果是什么)，这就是为什么getPercentage()方法似乎永远不会被调用。

最简单的方法是使用ajax提交表单，但是看起来您希望用户上传文件，而这些文件不能通过ajax提交。

因此，我建议将窗体上的目标设置为页面上不可见的iframe。这将使表单提交到该iframe(因此结果将被加载到iframe中，而不会导致在主窗口中加载新页面)。

，例如:

  <iframe name="uploadTarget" src="" style="position:absolute;left:-9999px"></iframe>
  <form action="" method="post" enctype="multipart/form-data" target="uploadTarget">
  ... etc ...

如果要跟踪实际上传的进度，则需要查看其他选项，例如使用http://blueimp.github.io/jQuery-File-Upload/

编辑:使用ajax提交表单: 
function startConvert() {
    var form = $("#startConversion").closest("form");
    $.post(form.attr('action'), form.serializeArray());
    getPercentage();
}

为什么不尝试在startConvert方法本身中调用setInterval(getPercentage, 500);，而不是一次又一次地调用setTimeout

相关文章：