HTML in View:
@Html.EditorFor(model => model.Provider.SupervisingProviders)
JavaScript Section in View :
<script type="text/javascript">
$(document).ready(function () {
$("#Provider_SupervisingProviders").tokenInput("@Url.Action("GetProviders","Provider")", {
theme: "facebook",
tokenLimit: 4,
preventDuplicates: true,
hintText: "Type in provider Name",
queryParam: "ProviderName"
// needs to place this conduction in edit mode (i.e) wants to display data on page load
@if (Model.Provider.Id > 0 && !string.IsNullOrWhiteSpace(Model.SupervisingProvidersData) )
{
@: ,prePopulate: @Html.Raw(HttpUtility.HtmlDecode(Model.SupervisingProvidersData))
}
});
});
</script>
Controller :
This Method is called by Token Input for get values
[HttpGet]
public JsonResult GetProviders(string ProviderName)
{
var providers = _masterServiceClient.GetProviders().Where(a => a.FirstName.ToUpper().Contains(ProviderName.ToUpper()) || a.LastName.ToUpper().Contains(ProviderName.ToUpper())).ToList();
IEnumerable providerList = providers.Select(results => new { id = results.Id, name = results.FirstName + " " + results.LastName });
return Json(providerList, JsonRequestBehavior.AllowGet);
}
In Add Form If we dont want any values to be selected by default, so we need to retun empty
string
if (model.SupervisingProvidersData != null)
{
model.SupervisingProvidersData = System.Web.Helpers.Json.Encode(model.SupervisingProvidersData);
}
Saving Selected Values in Add Form :
The Selected Attributes is saved in the text box Provider_SupervisingProviders in comma separated
format like '2,5,6' and we can save these values directly into the database.
Displaying Saved Values in Edit Form:
string selectedSupervisingProviders= model.Provider.SupervisingProviders;
/// get the selected Supervising Providers
if (!string.IsNullOrWhiteSpace(selectedSupervisingProviders))
{
IEnumerable<int> SupervisingProvider = selectedSupervisingProviders.Split(',').Select(SupervisingProviders => int.Parse(SupervisingProviders));
var provide = providers.Where(rec => SupervisingProvider.Contains(rec.Id));
IEnumerable providerList = provide.Select(results => new { id = results.Id, name = results.FirstName + " " + results.LastName });
model.SupervisingProvidersData = System.Web.Helpers.Json.Encode(providerList);
}
Download the Token Input form the location:
http://loopj.com/jquery-tokeninput/
