I have use jquery in adding new input type as long as the user want it.
@using (Html.BeginForm("addBatch_CARF", "CARF", FormMethod.Post, new { @name = "register" }))
{
@Html.ValidationSummary(true)
<div id="formAlert" class="alert alert-danger">
<a class="close">×</a>
<strong>Warning!</strong> Make sure all fields are filled and try again.
</div>
var catName = "";
var displayCan = "";
var candidates = "";
for (int i = 0; i < Model.Count; i++)
{
if (catName != Model[i].request_category)
{
<li class="list-group-item list-group-item-success">
@Html.DisplayFor(modelItem => Model[i].request_category)
<span class="pull-right" style="margin-right:60px;">Special Instructions</span>
</li>
catName = Model[i].request_category;
displayCan = catName;
}
if (displayCan == Model[i].request_category)
{
candidates = Model[i].request_name;
<div class="checkbox_request">
@Html.CheckBoxFor(model => model[i].isSelected, new { @class = "is_selected" })
@Html.DisplayFor(model => model[i].request_name)
@if(Model[i].request_name == "Folder Access")
{
<span class="label label-danger">Pls specify all the drive path. Note: For accessing of drives outside PETC please proceed to Online CARF</span>
}
<span class="pull-right">
@Html.EditorFor(model => model[i].special_instruction)
</span>
@Html.HiddenFor(model => model[i].request_type_id)
@Html.HiddenFor(model => model[i].system_roles_id)
</div>
}
}
<li class="list-group-item list-group-item-success">
Access to:
</li>
<div class="input_fields_wrap">
<button class="add_field_button btn btn-primary">Add More Fields</button>
<div>
<input type="text" name="fname[]" placeholder="First Name">
<input type="text" name="lname[]" placeholder="Last Name">
<input type="text" name="email_add[]" placeholder="Email Address">
<input type="text" name="user_id[]" placeholder="User ID">
</div>
</div>
<p class="request_btn">
<button type="submit" class="btn btn-primary" id="addbtn">Save</button>
</p>
}
Javascript
<script type="text/javascript">
$(document).ready(function () {
var max_fields = 10; //maximum input boxes allowed
var wrapper = $(".input_fields_wrap"); //Fields wrapper
var add_button = $(".add_field_button"); //Add button ID
var x = 1; //initlal text box count
$(add_button).click(function (e) { //on add input button click
e.preventDefault();
if (x < max_fields) { //max input box allowed
x++; //text box increment
$(wrapper).append('<div><input type="text" name="fname[]" placeholder="First Name"/> <input type="text" name="lname[]" placeholder="Last Name"/> <input type="text" name="email_add[]" placeholder="Email Add"/> <input type="text" name="user_id[]" placeholder="User ID"/><a href="#" class="remove_field">Remove</a></div>'); //add input box
}
});
$(wrapper).on("click", ".remove_field", function (e) { //user click on remove text
e.preventDefault(); $(this).parent('div').remove(); x--;
})
</script>
How will I add this data to my database? I've tried this code in my controller but these following parameters have no values string[] fname= null, string[] lname= null, string[] email_add= null, string[] user_id = null.
[HttpPost]
public ActionResult addBatch_CARF(List<Request_Type> list = null, string[] fname= null, string[] lname= null, string[] email_add= null, string[] user_id = null)
{
var data = db.Employees_All_vw.Where(x => x.NT_Name == @User.Identity.Name.Remove(0, 9).ToLower() && x.active_flag == true).FirstOrDefault();
//add data into CARF table
CARF carf = new CARF();
carf.requestor = data.Emp_Badge_No;
carf.carf_type = "BATCH CARF";
carf.created_by = @User.Identity.Name.Remove(0, 9).ToLower();
carf.created_date = System.DateTime.Now;
carf.active_flag = true;
db.CARves.Add(carf);
db.SaveChanges();
int id = carf.carf_id;
//add data into Request Access Table
foreach (var i in list)
{
int val = 1;
bool y = Convert.ToBoolean(val);
if (i.isSelected == y)
{
Request_Access ra = new Request_Access();
ra.request_access_id = 1;
ra.carf_id = id;
ra.request_type_id = i.request_type_id;
ra.special_instruction = i.special_instruction;
ra.ra_assignee = i.system_roles_id;
ra.dept_approval = null;
ra.dept_approval_date = null;
ra.dept_remarks = null;
ra.final_approval = null;
ra.final_approval_date = null;
ra.final_remarks = null;
ra.acknowledge_by = null;
ra.acknowledge_date = null;
ra.journal = null;
ra.closed_by = null;
ra.closed_date = null;
ra.verified_by = null;
ra.verified_date = null;
db.Request_Access.Add(ra);
}
db.SaveChanges();
}
//add all list of names to the Batch CARF table
for (var x = 1; x < fname.Count(); x++)
{
//foreach(var x in fname)
Batch_CARF batch = new Batch_CARF();
batch.carf_id = id;
batch.fname = fname[x];
batch.lname = lname[x];
batch.email_add = email_add[x];
batch.user_id = user_id[x];
batch.active_flag = true;
db.Batch_CARF.Add(batch);
}
db.SaveChanges();
//send email notification to the data owner or final approver by batch
TempData["MessageAlert"] = "Successfully created!";
return RedirectToAction("Batch_CARF");
}
