Upload file using jquery dialog not working
- by kandroid
i want to upload file using jquery dialog.
I have created a partial view and showing that partial view in the dialog.
The problem is, when I directly browse the partial view and upload a file, it works perfect.
BUT when I put the partial view inside a jquery dialog, it submits the form, but don't submits the file. So i have null value.
I really dont understand what is the difference here!!
Hope someone can help me to identify the problem.
here is some codes;
jquery codes:
$('#UploadDialog').dialog({
autoOpen: false,
width: 580,
resizable: false,
modal: true,
open: function (event, ui) {
$(this).load('@Url.Action("Upload","Notes")');
},
buttons: {
"Upload": function () {
$("#upload-message").html('');
$("#noteUploadForm").submit();
},
"Cancel": function () {
$(this).dialog("close");
}
}
});
$(".uploadLink").click(function () {
$('#UploadDialog').dialog('open');
});
return false;
});
partial view:
@using (Ajax.BeginForm("Upload", "Notes", null, new AjaxOptions
{
UpdateTargetId = "upload-message",
InsertionMode = InsertionMode.Replace,
HttpMethod = "POST",
OnSuccess = "uploadSuccess"
}, new { id = "noteUploadForm" , enctype="multipart/form-data"}))
{
<div>
<div id="upload-message"></div>
<div class="editLabel">
@Html.LabelFor(m => m.Notes.NoteTitle)
</div>
<div class="editText">
@Html.TextBoxFor(m => m.Notes.NoteTitle)
</div>
<div class="clear"></div>
<div class="editLabel">
@Html.Label("Upload file")
</div>
<div class="editText">
<input type="file" name="file" />(100MB max size)
</div>
</div>
}