Почему я получаю пустую запись для параметра 'CarLotID' с необнуляемым типом 'System.Int32' для метода 'ActionResult DisplaySearchResults () - PullRequest
1 голос
/ 11 апреля 2020

Я создаю приложение MVC и пытаюсь отобразить данные в моей таблице на основе выбранных значений для нескольких раскрывающихся списков после нажатия кнопки. Я думаю, что присваиваю все значения в своем коде, но я новичок в кодировании, поэтому я не уверен, что что-то упустил.

Это мой взгляд

@model IgnitionHub2._0.Models.Car
@{
    ViewBag.Title = "Car Search Page";
}

<h2>Cars</h2>
<div class="center-div">
    <div class="form-inline">
        @Html.DropDownListFor(model => model.CarLotID, new SelectList(Model.CarLotList, "CarLotID", "LotName"), "Select Car Lot", new { @class = "form-control" })
        @Html.DropDownListFor(model => model.Model.MakeID, new SelectList(Model.MakeList, "MakeID", "Name"), "Select Make", new { @class = "form-control" })
        @Html.DropDownListFor(model => model.ModelID, new SelectList(Model.ModelList, "ModelID", "Name"), "Select Model", new { @class = "form-control" })
        <button id="search">Search</button>
    </div>
</div>
<div id="searchResults">

</div>
@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
    <script src="~/Scripts/jquery-3.4.1.min.js"></script>
    <script src="~/Scripts/jquery.validate.min.js"></script>
    <script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

        <script type="text/javascript">
$(document).ready(
    function () {
    var makeUrl = '@Url.Action("GetCarDetails")';
    var models = $('#ModelID')
    $('#Model_MakeID').change(function () {
        models.empty();
            $.getJSON(makeUrl, { MakeID: $(this).val() },function(data){
                if (!data) {
                    return;
                }
                models.append($('<option></option>').val('').text('Please select'));
                $.each(data, function(index, item) {
                    models.append($('<option></option>').val(item.Value).text(item.Name));
                });
            });
        })
    })
    $(document).ready(function () {
     var url = '@Url.Action("DisplaySearchResults","Car")';
    $('#search').click(function () {
        var carLotID = $('#CarLotID').val();
        var makeID = $('#Model_MakeID').val();
        var modelID = $('#ModelID').val();
        alert(modelID);
        $('#searchResults').load(url, { CarLotID: carLotID, MakeID: makeID, ModelID: modelID });
    })

    })

Это мой частичный вид

@model IEnumerable<IgnitionHub2._0.Models.Car>

<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.Year)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Color)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Mileage)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.BodyType)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Drive)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Available)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Model.Name)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.CarLot.LotName)
        </th>
        <th></th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.Year)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Color)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Mileage)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.BodyType)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Drive)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Available)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Model.Name)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.CarLot.LotName)
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { id=item.CarID }) |
            @Html.ActionLink("Details", "Details", new { id=item.CarID }) |
            @Html.ActionLink("Delete", "Delete", new { id=item.CarID })
        </td>
    </tr>
}

</table>

А это мой контроллер

  public ActionResult Index()
    {

        var cars = db.Cars.Include(c => c.Model).Include(c => c.CarLot);
        var makeList = db.Makes.ToList();
        var modelList = db.Models.ToList();
        var carLotList = db.CarLots.ToList();
        var ViewModel = new Car
        {
        CarList = cars,
        MakeList = makeList,
        ModelList= modelList,
        CarLotList = carLotList
        };

        return View(ViewModel);
    }

    public ActionResult DisplaySearchResults(int CarLotID, int MakeID, int ModelID)
    {
        var model = db.Cars.Where(c => c.Model.MakeID == MakeID && c.ModelID == ModelID &&
        c.CarLotID == CarLotID).ToList();// build list based on parameter searchText
        return PartialView("_Index", model);
    }
    public ActionResult _Index()
    {
        var cars = new List<Car>(); 
        return PartialView(cars);
    }
    public JsonResult GetCarDetails(int MakeID)
    {

        db.Configuration.ProxyCreationEnabled = false;
        var data = GetModels(MakeID).ToList();
        //data = data.Where(x => x.Model.MakeID == MakeID).ToList();
        return Json(data, JsonRequestBehavior.AllowGet);
    }

Пожалуйста, помогите! Заранее спасибо!

1 Ответ

1 голос
/ 11 апреля 2020

Согласно документации, https://api.jquery.com/load/, .load() использует HTTP-запрос POST , если вы передаете объект в качестве параметра, который вы делаете прямо сейчас;

// {CarLotID:carLotID,MakeID:makeID,ModelID:modelID} is an object
$('#searchResults').load(url, { CarLotID: carLotID, MakeID: makeID, ModelID: modelID });

ВАРИАНТ 1 - Поскольку вы не написали свой метод действия как POST, вы можете просто настроить .load() на использование GET.

Используйте код ниже для .load();

$('#searchResults').load(url+"?CarLotID="+carLotID+"&MakeID="+makeID+"&ModelID="+modelID);

затем измените

@Html.DropDownListFor(model => model.ModelID, new SelectList(Model.ModelList, "ModelID", "Name"), "Select Model", new { @id="ModelID", @class = "form-control" })

В вашем l oop для пополнения выпадающего списка, используйте это вместо;

$.each(data, function(index, item) {
         models.append($('<option value="+item.MakeID+"></option>').text(item.Name));
});

обновленный скрипт:

$('#Model_MakeID').change(function(){
   models.empty();
   $.getJSON(makeUrl, { MakeID: $(this).val() }, function(data){
      if (!data) {
         return;
      }
      models.append($('<option></option>').val('').text('Please select'));

      // update this
      $.each(data, function(index, item) {
         models.append($('<option value="+item.Value+"></option>').text(item.Name));
      });
   });
});

ИЛИ ОПЦИЯ 2 - просто добавьте атрибут [HttpPOST] в действие вашего контроллера.

[HttpPost] // add this
public ActionResult DisplaySearchResults(int CarLotID, int MakeID, int ModelID)
{
        ...
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...