Я хочу установить значение по умолчанию, которое отсутствует при нажатии в раскрывающемся списке. Я хочу, чтобы я не мог выбрать значение «Пожалуйста, выберите»

Question

Я хочу установить значение по умолчанию, которое будет отсутствовать при нажатии в раскрывающемся списке. Я хотел бы, чтобы я не мог выбрать значение «Пожалуйста, выберите». Когда я нажимаю «Пожалуйста, выберите» значение в materialId или depotId, «» нулевое значение отправляется ajax, и я получаю ошибку. Как я могу предотвратить это?

Create.cshtml

  <div class="form-group">
        @Html.LabelFor(model => model.materialId, "Material names", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("materialId", null, "Please select", htmlAttributes: new { @class = "form-control chosen" })
            @Html.ValidationMessageFor(model => model.materialId, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.depotId, "Product Outlet", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("depotId", null, "Please select", htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.depotId, "", new { @class = "text-danger" })
        </div>
    </div>
    <script type="text/javascript">
            $(document).ready(function () {
                $('#depotId').change(function () { sendDataByAjax(); });
                $('#materialId').change(function () { sendDataByAjax(); });
        })
    function sendDataByAjax() {
        var materialId= $('#materialId option:selected').val();
        var depotId= $('#depotId option:selected').val();

        if (materialId == "" || depotId == "") {
          // I can not write this
        }
        $.ajax({
            type: "GET",
            url: "@Url.Action("GetStock", "OutgoingProduct")",
            data: {
                'materialId': materialId,
                'depotId': depotId
            },
            success: function (data) {
                $("#stock").html(data);
                }
        });
        }
    </script>
}

Я получаю ошибку здесь, когда "" идет к моему контроллеру. Потому что это не int.

OutgoingProductController.cs

public string GetStock(string materialId, string depotId)
{
    int did = int.Parse(depotId);
    int mid = int.Parse(materialId);

Answer 1

Поскольку в раскрывающемся списке выбранные значения передаются в виде числовых значений, вы можете использовать функцию parseInt(), чтобы попытаться проанализировать числовое значение со стороны клиента, а затем проверить по NaN, если значение является числовым, инициировать обратный вызов AJAX:

function sendDataByAjax() {
    var materialId = parseInt($('#materialId option:selected').val());
    var depotId = parseInt($('#depotId option:selected').val());

    if (isNaN(materialId) || isNaN(depotId)) {
        // do something, e.g. alert user
        return false;
    }
    else {
        $.ajax({
            type: "GET",
            url: "@Url.Action("GetStock", "OutgoingProduct")",
            data: {
                'materialId': materialId,
                'depotId': depotId
            },
            success: function (data) {
                $("#stock").html(data);
            }
        });
    }
}

Затем убедитесь, что ваш метод действия содержит тип int для обоих параметров, поэтому нет необходимости использовать int.Parse(), который будет выдавать исключение, если анализируемая строка имеет нулевое значение:

public ActionResult GetStock(int materialId, int depotId)
{
    int did = depotId;
    int mid = materialId;

    // other stuff
}

Answer 2

способ решить эту проблему не так, как вы пытаетесь это сделать.Для этого нужно использовать систему проверки, доступную для MVC.

Измените метод get для использования модели, например:

public class StockRequestModel
{
    [Required]    
    public int materialId { get; set }

    [Required]
    public int depoId { get;set; }
}

Ваш метод контроллера может стать чем-то вроденапример:

public string GetStock([FromUri] StockRequestModel model)
{
    if ( !ModelState.IsValid )
    {
         some code here
    } 

    //at this point your model is valid and you have IDs so can proceed with your code
}

Обычно в MVC вы возвращаете исходное представление с указанием состояния в результате, поэтому вы можете запустить проверку внешнего интерфейса.В вашем случае у вас, кажется, есть контроллер WebAPI в приложении MVC, но вы все еще можете использовать проверку интерфейса.

Есть и другие вопросы, связанные с вашим, такие как Проверка на стороне клиента с помощью Angularjs иПроверка на стороне сервера с помощью Asp.net MVC

Обычно я бы голосовал, чтобы закрыть его как дубликат, но в этом случае я думаю, что стоит указать на проблему и решение.

Еще одно место, куда можно пойти, - это https://angularjs.org/, а затем проверьте раздел проверки формы для чистой проверки внешнего интерфейса.Конечно, вы хотели бы сохранить проверки как внешнего, так и внутреннего интерфейса.

Answer 3

Попробуйте вернуть false, когда materialId == "" || depotId == "":

function sendDataByAjax() {
        var materialId= $('#materialId option:selected').val();
        var depotId= $('#depotId option:selected').val();

        if (materialId == "" || depotId == "") {
          return false;
        }
        $.ajax({
            type: "GET",
            url: "@Url.Action("GetStock", "OutgoingProduct")",
            data: {
                'materialId': materialId,
                'depotId': depotId
            },
            success: function (data) {
                $("#stock").html(data);
                }
        });
}