Coursach/Course/ImplementerApp/Views/Home/CreateDetail.cshtml

@using Contracts.ViewModels;
@{
    ViewData["Title"] = "CreateDetail";
}
@model DetailViewModel;
<div class="text-center">
    <h2 class="display-4">Деталь</h2>
</div>
<form id="detailForm" method="post">
    <input type="text" name="id" id="id" value="@Model.Id" hidden="hidden" />
    <div class="row">
        <div class="col-4">Название:</div>
        <div class="col-8">
            <input type="text" name="name" id="name" value="@Model.Name" />
            <span id="nameError" class="text-danger"></span>
        </div>
    </div>
    <div class="row">
        <div class="col-4">Цена:</div>
        <div class="col-8">
            <input type="text" name="cost" id="cost" value="@Model.Cost" />
            <span id="costError" class="text-danger"></span>
        </div>
    </div>
    <div class="row">
        <div class="col-8"></div>
        <div class="col-4"><input type="submit" value="Сохранить" class="btn btn-primary" /></div>
    </div>
</form>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
    $(document).ready(function () {
        $('#detailForm').submit(function (event) {
            var name = $('#name').val();
            var cost = $('#cost').val();
            var isValid = true;

            $('#nameError').text('');
            $('#costError').text('');

            if (name.length < 2 || name.length > 50) {
                $('#nameError').text('Название должно быть от 2 до 50 символов.');
                isValid = false;
            }

            if (isNaN(cost) || cost <= 0) {
                $('#costError').text('Цена должна быть положительным числом.');
                isValid = false;
            }

            if (!isValid) {
                event.preventDefault();
            }
        });
    });
</script>