Блог

Я хочу удалить изображение в форме редактирования и показать опцию загрузки файла.Как я могу добиться этого с помощью Ajax, поскольку я использую панели вкладок для нескольких форм.

Вот мой код,

Biodata.cshtml

 <div class="form-group">
                <label class="control-label-staff"><b>Photo</b></label>
                @if (Model.ImageFiles != null)
                {
                    foreach (var item in Model.ImageFiles)
                    {
                        if (item.Name.Substring(0, 2) == "IM")
                        {
                            <span class="control-label-staff">
                                <img src="~/Documents/EmployeeAttachments/@Request.Query["EmpID"].ToString()/@item.Name" width="70px" height="70px" />
                            </span><br/>
                            <a asp-page-handler="RemoveImage" data-ajax="true" data-ajax-method="post" data-ajax-complete="RemoveImageCompleted">Delete</a>                            
                            
                        }
                    }
                }
                @if (Model.ImageFiles == null)
                {
                    <input type="file" asp-for="StaffPhoto" class="form-control-staff" accept="image/*" style="border:1px solid white;" />
                }
            </div>
 

Он не вызывает метод asp-page-handler. Прямое выполнение метода ajax.

 function RemoveImageCompleted(event) {
            if (event.responseText != "") {
                $("#Biodata").html(event.responseText);
            } else {
                alert("Image Has Been Deleted Successfully");
                $.ajax({
                    url:rootPath   "/Staff/Onboarding/Biodata",
                    type: "get",
                    success: function (result) {
                        $("#Biodata").html(result);
                        $('a[href="#Biodata"]').tab('show');
                    }
                })
            }
        }
 

Это мой метод asp-page-handler в BioData.cshtml.cs

 public async Task<IActionResult> OnPostRemoveImageAsync()
        {
            string filename = Request.Form["filename"];
            if (filename != null)
            {
                var Folder = StaffBioData.EmpID.ToString();
                string filedel = Path.Combine(_env.WebRootPath, "Documents/EmployeeAttachments", Folder, filename);
                FileInfo fi = new FileInfo(filedel);
                if (fi != null)
                {
                    System.IO.File.Delete(filedel);
                    fi.Delete();
                } 
            }
            return new OkResult();

        }
 

Любая помощь будет оценена.Спасибо.

Ссылки — это запросы на получение. Вы не можете отправлять сообщения по ссылке; для этого и существуют формы. Вам понадобится что-то вроде:

 @if (Model.ImageFiles != null)
{
    foreach (var item in Model.ImageFiles)
    {
        if (item.Name.Substring(0, 2) == "IM")
        {
            @*<a asp-page-handler="RemoveImage" data-ajax="true" data-ajax-method="post" data-ajax-complete="RemoveImageCompleted">Delete</a>*@
            <form method="post" asp-page-handler="RemoveImage" data-ajax="true" data-ajax-method="post" data-ajax-complete="RemoveImageCompleted">
                <input type="submit" value="delete" />
            </form>
        }
    }
}