I have an ASP.NET MVC app which uses a jquery ui dialog for file upload. Everything is working fine with loading the dialog with the correct content and displaying the dialog on my click event however my issue is that after I process the action in my controller action method I don't return back to my dialog as I would expect an ajax like call to behave. My dialog is a form whose "method=post". I believe this is the issue. When I post the form I no longer have context to the dialog. If I remove the "method=post" from my form tag I get a 404 not found on my controller action. I will say that I have tried various methods to do what I want to accomplish but each method has not worked for one reason or another. Originally I tried the .$(post) method to fire my controller action but found that the Request.Files was not getting set when I tried to process it in my controller action. I also tried using Html.BeginForm instead of the html however I ran into the same issue of not returning to the dialog. The net result is a blank browser page with the words Success which is the return of my action method. My latest attempt is to use the jquery method .ajaxForm. This calls my action and has the filepath name to be uploaded but it too does not return to the dialog. Here is my code:
aspx:
onClickButton: function() {
var data = $("#equipgrid").getRowData(curRow);
jQuery('#img_dialog').load("/EquipTrack/GetEquipImages/" + data.equip_id, {}, function(data) {
$("#img_results").html(data);
});
jQuery('#img_dialog').dialog('open');
return false;
$(function() {
$("#img_dialog").dialog({
bgiframe: true,
width: 540,
modal: true,
autoOpen: false,
resizable: false
})
});
$('#imageDlgForm').ajaxForm(function(data) {
alert(data);
alert("Thank you for your comment!");
});
my ascx (I'm using a partial view to load dialog contents):
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
<%@ Import Namespace="ULS_Site.Models"%>
<form id="imageDlgForm" action="/EquipTrack/Upload" >
<p><input type="file" id="fileUpload" name="fileUpload" size="23"/> </p>
<p><input type="submit" value="Save" id="btnSave"/></p>
<p></p>
<center>
<ul style="list-style-type:none">
<% foreach (var item in ViewData.Model as IEnumerable<image>) %>
<%{%>
<li>
<img src="<%= item.image_path %>" alt=" " />
</li>
<%}%>
</ul>
</center>
<input type="hidden" id="hdnID" name="hdnID" value="38" />
</form>
my controller action c#:
public ActionResult Upload()
{
foreach (string inputTagName in Request.Files)
{
HttpPostedFileBase file = Request.Files[inputTagName];
if (file.ContentLength > 0)
{
string filePath = Path.Combine(HttpContext.Server.MapPath("../Content/equip_images")
, Path.GetFileName(file.FileName));
file.SaveAs(filePath);
}
}
return Content("Success");
}
}