Как публиковать данные и один файл к действию с набором настроек ajax
Я хочу отправить несколько параметров с помощью запроса AJAX. например: id=1,name="amin", логотип: файл. тип идентификатора - int, тип имени - String, а тип логотипа - HttpPostfileBase в моем действии.
var ID = $("#OfficeId").val();
if (ID == "") {
var imagefile1 = $("#fileInput")[0].files[0];
alert(imagefile1.name);
$.ajax({
url: '@Url.Action("Create", "Administration")',
data: { ID: ID, Name: $("#Name").val(), ManagerName: $("#ManageName").val(), UserName: $("#UserName").val(), Password: $("#Password").val(), Address: $("#Address").val(), Wage: $("#Wage").val(), Logo: imagefile1 },
type: "POST",
processData: false,
contentType: false,
enctype: 'multipart/form-data',
success: function (result) {
if (result.Success) {
alert(result);
}
eval(result.Script);
},
error: function () {
alert("خطا!");
}
});
}
Но этот кодекс не работает для меня. если я удаляю логотип (параметр файла) из запроса ajax, запрос работает нормально. Моя проблема - просто логотип (параметр файла).
2 ответа
Решение
Вы можете использовать концепцию объекта FormData из JavaScript, как показано ниже:
Вы можете предоставить formData всю форму для обработки
var formData = new FormData();
formData.append('ID', $("#OfficeId").val());
formData.append('Name', $("#Name").val());
formData.append('image', $("#fileInput")[0].files[0]);
Ajax-запрос с jQuery будет выглядеть так:
$.ajax({
url: 'Your url here',
type: "POST",
data: formData,
processData: false,
contentType: false,
enctype: 'multipart/form-data',
success: function (result) {
if (result.Success) {
alert(result);
}
eval(result.Script);
},
error: function () {
alert("خطا!");
}
})
Сначала добавьте кнопку: событие click этой функции отправит значение id на вызов ajax, и вы получите данные, основанные на значении идентификатора.
<button type="button" onclick="Edit(@model.ID)">Edit</button>
Функция редактирования (ID):
function Edit(Get_Id) {
var name1 = $('#ID1').val(); // save required values to send to another file
var name2 = $('#ID2').val();
$.ajax({
method: 'Post',
url: '@Url.Action("Edit","Home")', // method name & controller name.
data: { id: Get_Id, Column_Name1: name1, Column_Name2: name2}, // bind data to column names and send to method.
success: function () {
alert("Data Sent")
}
})
}