通过ASP.NET MVC中的jquery AJAX中的formdata将多个下拉选择数据传递给控制器 [英] Pass multiple dropdown select data to controller through formdata in jquery AJAX in ASP.NET MVC

问题描述

 ----------- view ---- 
< p>< / p> 
< p> @ Html.DropDownListFor（model => model.lstEmployeeId，（IEnumerable< SelectListItem>）ViewBag.EmployeeList，new {@id =multiSelectDropDown，@ class =form-control，@ multiple =multiple}）< / p> 
< p>< / p> 
 
 ----------------模型类----------------- 
公共类TaskManager 
 {
 public int TaskID {get;组; } 
 
 public int EmployeeId {get;组; } 
公共字符串EmployeeName {get;组; } 
 public string FullName {get;组; } 
 public string Task_NM {get;组; } 
 public DateTime？日期{get;组; } 
 public string MileStones {get;组; } 
 public string NoteS {get;组; } 
公共字符串File_Path {get;组; } 
 public string IsActive {get;组; } 
 public int CreatedBy {get;组; } 
 public DateTime？ CreatedDate {get;组; } 
 public int UpdatedBy {get;组; } 
 public DateTime？ UpdatedDate {get;组; } 
 
 public List< ClsEmployee> lstEmployeeId {get;组; } 
 
} 
 
公共类ClsEmployee 
 {
 public long EmployeeId {get;组; } 
} 
 
 
 
 ---------------------------行动方法
 
< pre> public JsonResult SaveTask（TaskManager taskmanager）
 {
} 

- ----这是我的jquery代码-----



$（'＃start-form-create-card'）。click（function（）{



//函数btnsubmit（）{



if（window.FormData！== undefined）{



var fileUpload = $（＃FileUpload1）。get（0）;

var files = fileUpload.files;



var fileData = new FormData（）;



for（var i = 0; i< files.length ; i ++）{

fileData.append（files [i] .name，files [i]）;

}



fileData.append（Date，$（＃DatePicker）。val（））;

fileData.append（Task_NM，$（＃Task_NM）。val （））;

fileData.append（MileStones，$（＃MileStones）。val（））;



$ （'＃multipSelectDropDown选项：选中'）。each（function（）{

fileData.append（lstEmployeeId，this.value）;

}）;





$ .ajax（{

url：/ ApplicationManager / SaveTask，

类型：POST，

contentType：false，

processData：false，

data：fileData，

成功：函数（响应） {



if（response ==Success）{

toastr.success（'Task added successfully ....'）;

}

else {

toastr.error（'出错了......'）;

}



}，

错误：函数（错误）{

console.log（错误）;

alert（err.statusText）;

}

}）;

}

else

{

alert（不支持FormData。）;

}

}）;



我尝试了什么：



i我试图传递上传图片，使用文本框传递表单数据并将多个选定数据下拉到mvc控制器。上面提到的模型类，查看n jquery代码....每个工作正常除了多个下拉列表选择的数据无法传递给控制器​​

解决方案

（'＃start-form-create-card'）。click（function（）{



//函数btnsubmit（）{



if（window.FormData！== undefined）{



var fileUpload =

（＃FileUpload1）。get（0）;

var files = fileUpload .files;



var fileData = new FormData（）;



for（var i = 0;我< files.length; i ++）{

fileData.append（files [i] .name，files [i]）;

}



fileData.append（Date，

（＃DatePicker）。val（））;

fileData.append（Task_NM，

-----------view ----
<p></p>
<p>@Html.DropDownListFor(model => model.lstEmployeeId, (IEnumerable<SelectListItem>)ViewBag.EmployeeList, new { @id = "multiSelectDropDown", @class = "form-control", @multiple = "multiple" })</p>
<p></p>

----------------model class-----------------
public class TaskManager
{
public int TaskID { get; set; }

public int EmployeeId { get; set; }
public string EmployeeName { get; set; }
public string FullName { get; set; }
public string Task_NM { get; set; }
public DateTime? Date { get; set; }
public string MileStones { get; set; }
public string NoteS { get; set; }
public string File_Path { get; set; }
public string IsActive { get; set; }
public int CreatedBy { get; set; }
public DateTime? CreatedDate { get; set; }
public int UpdatedBy { get; set; }
public DateTime? UpdatedDate { get; set; }

public List<ClsEmployee> lstEmployeeId { get; set; }

}

public class ClsEmployee
{
public long EmployeeId { get; set; }
}



---------------------------action method

<pre> public JsonResult SaveTask(TaskManager taskmanager)
    {
    }

------this is my jquery code-----

$('#start-form-create-card').click(function () {

//function btnsubmit() {

if (window.FormData !== undefined) {

var fileUpload = $("#FileUpload1").get(0);
var files = fileUpload.files;

var fileData = new FormData();

for (var i = 0; i < files.length; i++) {
fileData.append(files[i].name, files[i]);
}

fileData.append("Date", $("#DatePicker").val());
fileData.append("Task_NM", $("#Task_NM").val());
fileData.append("MileStones", $("#MileStones").val());

$('#multiSelectDropDown option:selected').each(function() {
fileData.append("lstEmployeeId", this.value);
});


$.ajax({
url: "/ApplicationManager/SaveTask",
type: "POST",
contentType: false,
processData: false,
data: fileData,
success: function (response) {

if (response == "Success") {
toastr.success('Task Added successfully ....');
}
else {
toastr.error ('something went wrong ....');
}

},
error: function (err) {
console.log(err);
alert(err.statusText);
}
});
}
else
{
alert("FormData is not supported.");
}
});

What I have tried:

i am trying to pass uploading image , form data passing using textbox and dropdown multiple selected data to mvc controller .above i mentioned model class ,view n jquery code .... every thing working fine except multiple dropdown selected data unable to pass to controller

解决方案

('#start-form-create-card').click(function () {

//function btnsubmit() {

if (window.FormData !== undefined) {

var fileUpload =

("#FileUpload1").get(0);
var files = fileUpload.files;

var fileData = new FormData();

for (var i = 0; i < files.length; i++) {
fileData.append(files[i].name, files[i]);
}

fileData.append("Date",

("#DatePicker").val());
fileData.append("Task_NM",

这篇关于通过ASP.NET MVC中的jquery AJAX中的formdata将多个下拉选择数据传递给控制器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！