在没有 post 的情况下调用 mvc 控制器返回 mvc 5 angularjs

Question

我正在创建一个 asp.net mvc 5 网络应用程序（使用 angularjs）

在我的应用程序中，我正在调用一个控制器来下载用户图片，但整个页面都在刷新，

而且我不想回发特定页面

这是我的控制器的样子

[HttpPost]
public ActionResult profilecompletion(FormCollection fc, HttpPostedFileBase file)
{
    // tbl_details tbl = new tbl_details();
    var allowedExtensions = new[] {
    ".Jpg", ".png", ".jpg", "jpeg",".doc",".docx",".pdf",".xlsx",".xls"
};
    string id = fc["name"].ToString();

    //tbl.Id = fc["Id"].ToString();
    //tbl.Image_url = file.ToString(); //getting complete url  
    //tbl.Name = fc["Name"].ToString();
    if (file==null)
    {

    }
    else
    {
        var fileName = Path.GetFileName(file.FileName); //getting only file name(ex-ganesh.jpg)  
        var ext = Path.GetExtension(file.FileName); //getting the extension(ex-.jpg)  
        if (allowedExtensions.Contains(ext)) //check what type of extension  
        {
            string name = Path.GetFileName(id + fileName); //getting file name without extension  
                                                           //string myfile = name + "_" + "" + ext; //appending the name with id  
                                                           // store the file inside ~/project folder(Img)  
            if (!Directory.Exists(Server.MapPath("~/userpic")))
            {
                Directory.CreateDirectory(Server.MapPath("~/userpic"));
            }
            var path = Path.Combine(Server.MapPath("~/userpic"), name);
            //tbl.Image_url = path;
            //obj.tbl_details.Add(tbl);
            //obj.SaveChanges();
            file.SaveAs(path);
        }
        else
        {
            ViewBag.message = "Please choose only Image file";
        }
    }
    return RedirectToAction("Dashboard", "Dashboard");
}

这是我的 cshtml 页面

@using (Html.BeginForm("profilecompletion", "user", FormMethod.Post, new
{
    enctype = "multipart/form-data"
}))
{
                <div class="row">
                    <div class="col-sm-8">
                        <span>Profile Pic</span>
                        <input id="imagepath" type="file"  file-model="profileimage" ng-text-change="changeimage()" name="file" />
                    </div>
                    <div class="col-sm-4">
                        <img id="myImg" src="#" alt="Choose image" style="height:100px; width:100px; border-radius:10px;" ng-hide="hidestat" ng-src="{{image}}"  />
                        @*<input id="imagepath" type="file" file-model="profileimage" class="form-control" />*@
                    </div>
                </div>
            <div class="button-container">
                <input type="submit" name="Update" class="btn btn-primary" ng-click="update()" title="save" />
            </div>
}

页面加载阻止应用update() function正常执行

我需要在这里做什么来防止任何类型的回发或页面加载而不影响任何可编程性。

Answer 1

页面重新加载的原因是因为您正在使用 submit 按钮，顾名思义，该按钮将带有完整回发的表单提交到服务器。您可以改用常规 button：

<input type="button" name="Update" class="btn btn-primary" ng-click="update()" title="save" />

Answer 2

试试这个

<button type="button" name="Update" class="btn btn-primary" ng-click="update()" title="save" > Submit </button>

在没有 post 的情况下调用 mvc 控制器返回 mvc 5 angularjs

call mvc controller without post back mvc 5 angularjs

asp.net

asp.net-mvc

pageload

angularjs

asp.net-mvc-5