I am using asp.net core MVC with bootstrap 5 and a library called bootstrap-select.
In the HTML I have a model of "prospects" that I iterate through and dynamically populate the select options.
One issue I have is when I set the value="@prospect" its auto selecting all the options.
The other issue is my on Change method is hit and i pass in the event.
I then create a variable and assign it the Json.stringfy value and console log it and it just seems to be putting the named type as the value.
Here's the HTML:
@model BusinessPlan.Core.Entities.BusinessPlan.FilteredList
<select class="selectpicker" id="mySelect" asp-for="Prospects"
data-live-search="true"
multiple
data-selected-text-format="count"
title="Add Prospects">
@foreach(var prospect in Model.Prospects)
{
<option value=@prospect>
<div class="prospect-list-item" style="float:left">
<div class="title">
<h3> @prospect.Name</h3>
</div>
<div class="address">
@prospect.Street1, @prospect.City, @prospect.StateProvince @prospect.PostalCode
</div>
<div class="activity">
Last Activity: @prospect.LastFeedbackDate
</div>
</div>
</option>
}
</select>
The JavaScript:
$(function () {
$('select').on('change', function (e) {
var prospect = JSON.stringify(e.target.value);
console.log(prospect);
addProspectToRouteEvaluation(prospect);
});
});
var addProspectToRouteEvaluation = function (prospect) {
$.ajax({
url: '/RouteEvaluation/AddProspect',
contentType: 'application/html; charset=utf-8',
type: 'Post',
data: {
ID: prospect.ID, Name: prospect.Name, District: prospect.District, MCO: prospect.MCO,
Route: prospect.Route, City: prospect.City, StateProvince: prospect.StateProvince,
Street1: prospect.Street1, PostalCode: prospect.PostalCode, Latitude: prospect.Latitude,
Longitude: prospect.Longitude, EntityStatusID: prospect.EntityStatusID,
LastFeedbackDate: prospect.LastFeedbackDate, EntityStatus: prospect.EntityStatus},
dataType: 'json'
});
}
Controller method that the Ajax call hits:
[HttpPost("AddProspect")]
[RequestFormLimits(ValueCountLimit = Int32.MaxValue, ValueLengthLimit = Int32.MaxValue, MultipartBodyLengthLimit = Int32.MaxValue)]
public async Task<IActionResult> AddProspect(int routeEvaluationId, int planId, string ID, string Name, string District,
string MCO, string Route, string City, string StateProvince, string Street1, string PostalCode, string Latitude,
string Longitude, string EntityStatusID, string LastFeedbackDate, string EntityStatus)
{
Prospect prospect = Prospect.From(ID, Name, District, MCO, Route, City, StateProvince,
Street1, PostalCode, Latitude, Longitude, EntityStatusID,
LastFeedbackDate, EntityStatus);

I have tried many things and none of them worked.