I have the following Model:
[Required (ErrorMessage="Server Name Required")]
[StringLength(15, ErrorMessage = "Server Name Cannot Exceed 15 Characters")]
public string servername { get; set; }
[Required(ErrorMessage = "Server OS Type Required")]
public string os { get; set; }
public string[] applications;
And I have used the following code to bind a textbox to the servername which works fine:
@Html.TextBoxFor(m => Model.servername, new {@class="fixed", @id="serverName"})
I am using a dropdown list for the OS, and a listbox for applications, both of which do not populate the model correctly on submit.
@Html.DropDownListFor(m => m.os , new SelectList( ((List<SelectListItem>)ViewData["osTypes"]),"Value","Text"), new { @class = "fixed" })
@Html.ListBoxFor(m => m.applications, new MultiSelectList((List<SelectListItem>)ViewData["appList"]), new {style="display:none;"})
Any thoughts on what I am doing wrong here?
Update: I don't think I gave enough information here
In the controller ViewData["osTypes"] is set to a List with a few default values pulled from a WebAPI:
List<string> osTypes = FastFWD_SITE.Helpers.GetJsonObj._download_serialized_json_data<List<string>>(getOsTypeUrl);
List<SelectListItem> osTypeList = new List<SelectListItem>();
foreach (string osType in osTypes)
{
osTypeList.Add(new SelectListItem { Text = osType });
}
ViewData["osTypes"] = osTypeList;
The ViewData["appList"] is sent to an empty list as follows:
ViewData["appList"] = new List<SelectListItem>();
For the list of applications, the user fills in a textbox and hits a button to add data to the application listbox:
Jquery to add item to listbox:
$("#addItem").click(function () {
var txt = $("#appName");
var svc = $(txt).val(); //Its Let you know the textbox's value
var lst = $("#serverSpecification_applications");
var ul = $("#itemList");
var options = $("#serverSpecification_applications option");
var iList = $("#itemList li");
var alreadyExist = false;
$(options).each(function () {
if ($(this).val() == svc) {
alreadyExist = true;
txt.val("");
return alreadyExist;
}
});
if (!alreadyExist) {
$(lst).append('<option value="' + svc + '" selected=true>' + svc + '</option>');
$(ul).append('<li id="' + svc + '"><label>' + svc + '<input type="checkbox" id="' + svc + '" onclick="removeItem(this.id)"/></label>')
txt.val("");
return false;
}
});
I have a feeling i am doing something horribly wrong here, anything is helpful.
asp.net mvc supports data binding. You can bind data to some model and post it back when the form is submitted.
Model binding allows controller actions to work directly with model types (passed in as method arguments), rather than HTTP requests. Mapping between incoming request data and application models is handled by model binders.
So the two-way data binding means we can perform both read and write operations. In our previous article Data Binding in Spring MVC with Example, we have discussed how to write-to-variable task and in this article, we mainly focus on the read-from-a-variable task.
First of all, in order for model binder to work all your properties need to have getters and setters.
So change:
public string[] applications;
To:
public string[] applications { get; set; }
And in order for ListBox to show the data correctly use
@Html.ListBoxFor(m => m.applications,
new MultiSelectList((List<SelectListItem>)ViewData["appList"], "Value", "Text"),
new {style="display:block;"})
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With