Question

我正在使用bootsrap构建HTML5移动应用程序。目前我在上传功能方面遇到了一些问题。

这是我的HTML表单：

<form id="login-form">
    <input   type="file" id="files" accept="image/*;capture=camera" class="btn btn-primary btn-lg btn-block">
    <button type="submit" onclick="ButtonSumbit()">Submit</button>
</form>

这是我的提交按钮代码：

function ButtonSumbit()
{
    var cURL = document.URL;

    var postdata = $('#login-form').serialize();
    var file = document.getElementById('files').files[0];
    var fd = new FormData();
    fd.append("files", file);
    var xhr = new XMLHttpRequest();
    xhr.open("POST", "/TakePicture/TakePictureDB", false);

    xhr.send(fd);

    var jsonObj = JSON.parse(xhr.responseText);

    if (jsonObj.PictureWasSaved == true) {
        console.log("Image Uploaded!");
        alert("OK");
    }
    else {
        console.log("Image was not Uploaded!");
    }
};

我的asp.net代码在这里：

    [HttpPost]
    public JsonResult TakePictureDB(FormCollection data)
    {
        try
        {
            //Check Permission
            if (EloGlobal.UserHasPermissionTo("CODE", EloGlobal.PermissionType.Read) == false)
            {
                throw new Exception(nG.StringsResources.Resources.CurrentUserHasNoPermissions);
            }

            if (Request.Files["files"] != null)
            {
                using (var binaryReader = new BinaryReader(Request.Files["files"].InputStream))
                {
                    var Imagefile = binaryReader.ReadBytes(Request.Files["files"].ContentLength);//your image
                }

                return Json(new { PictureWasSaved = true },
                JsonRequestBehavior.AllowGet);
            }
            else
            {
                return Json(new { PictureWasSaved = false },
                JsonRequestBehavior.AllowGet);
            }
        }
        catch(Exception ex)
        {
            LogException(ex, "Start", "Home");
            Session["error"] = ex;
        }
        //Error
        return Json(new { PictureWasSaved = false },
                        JsonRequestBehavior.AllowGet);
    }

代码运行正常。问题是当我点击提交按钮时，我的页面会将我重定向到我的登录页面。我认为问题的目的是为了更改网址，因为点击提交按钮后，我的网址会更改为：本地主机：62636 /？在我的应用程序导航期间，url没有改变，总是相同的* localhost：62636 /

有人能给我一些帮助吗？谢谢

Answer 1

在调用return false;函数后尝试ButtonSubmit，以删除submit按钮的默认页面提交行为。

<button type="submit" onclick="ButtonSumbit();return false;">Submit</button>

图片上传MVC / Javascript / ASP.NET C＃

1 个答案: