Bootstrap 4 модальных ответов ASP.NET MVC 5 - как отображать без нажатия кнопки - PullRequest
0 голосов
/ 18 декабря 2018

У меня есть приложение ASP.NET MVC 5, которое содержит частичное представление на главной странице.В частичном представлении есть форма, которая автоматически отправляется, когда длина ввода составляет == 6 символов.Все работает нормально, но у меня есть 2 модальных режима, которые мне нужно отобразить - 1 успех и 1 ошибка - в зависимости от значений в TempData.Я пробовал несколько вещей, но ни одна из них не работает.Любая помощь приветствуется ...

_RegistrationPartial просмотр (форма отправляется отсюда)

@using (Ajax.BeginForm("BarcodeRecord", "Attendance", null, new AjaxOptions() { HttpMethod = "POST" }, new { @class = "form-group", id = "barcodeform", autocomplete = "off" }))
    {
        <div class="input-group mt-sm-3">
            @Html.TextBox("query", null, new { placeholder = "Barcode", @class = "form-control-sm col-sm-12 mw-100", id = "barcode" })
        </div>
    }

jQuery для автоматической отправки формы (скрипт в главном представлении - индекс):

$(document).ready(function () {
        $('#barcode').on('input', function (e) {
            var val = $(this).val();
            var len = val.length;

            if (len === 6) {
                $('#barcodeform').submit();
                $('#barcode').val('');
            }
            e.preventDefault();
        });
        $('#barcode').focus();
    });

Отображаемые модалы (в режиме _RegistrationPartial)

<!--Free Book Modal-->
<div class="modal fade" id="freeBookModal" tabindex="-1" role="dialog" aria-labelledby="freeBookModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg text-white" role="document">
        <div class="modal-content transparent-success">
            <div class="modal-header">
                <h6 class="modal-title" id="freeBookModalLabel">Free Book!</h6>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">@Ajax.ActionLink(@"Close", "Replace", "Registration", new AjaxOptions(), new { @class = "text-white" })</button>
            </div>
        </div>
    </div>
</div>

<!--Error Message Modal-->
<div class="modal fade" id="errorMessageModal" tabindex="-1" role="dialog" aria-labelledby="errorMessageModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg text-white" role="document">
        <div class="modal-content transparent-danger">
            <div class="modal-header">
                <h6 class="modal-title" id="errorMessageModalLabel">Error Message:</h6>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">@Ajax.ActionLink(@"Close", "Replace", "Registration", new AjaxOptions(), new { @class = "text-white" })</button>
            </div>
        </div>
    </div>
</div>

Действие контроллера для формы POST:

public async Task<ActionResult> BarcodeRecord(string query)
    {
        var familyMemberId = await _context.Barcodes.Where(b => b.BarcodeId == query).Select(b => b.FamilyMemberId).SingleAsync();

        if (familyMemberId == 0)
        {
            TempData["sErrMsg"] = "Barcode not found.";
            return Redirect("../Registration/RegistratonPartial");
        }

        var viewModel = Session["AttendedEvent"] as EventAttendanceViewModels;
        viewModel.FamilyMemberId = familyMemberId;

        var model = new EventAttendance
        {
            LocationId = viewModel.LocationId,
            FamilyMemberId = viewModel.FamilyMemberId,
            EventId = viewModel.EventId,
            EventDate = viewModel.EventDate,
            EventTime = viewModel.EventTime,
            StaffMemberId = viewModel.StaffMemberId
        };

        var familyMemberInDb = await _context.FamilyMembers.SingleAsync(fm => fm.Id == familyMemberId);

        if (familyMemberInDb.IsActive != true)
        {
            TempData["sErrMsg"] = familyMemberInDb.FirstName + " " + familyMemberInDb.LastName +
                                  " is more than 5 years old, and no longer eligible.";

            return Redirect("../Registration/RegistratonPartial");
        }

        if (familyMemberInDb.AttendanceYear != viewModel.AttendanceYear)
        {
            familyMemberInDb.AttendanceYear = viewModel.AttendanceYear;
            familyMemberInDb.NumberOfEventsAttendedCurrentYear = 0;
        }

        familyMemberInDb.NumberOfEventsAttendedCurrentYear++;
        familyMemberInDb.NumberOfEventsAttendedOverall++;

        if (familyMemberInDb.NumberOfEventsAttendedCurrentYear == 6 && DateTime.Today.DayOfYear > 92)
        {
            //send survey via email
        }

        if (familyMemberInDb.NumberOfEventsAttendedOverall % 10 == 0)
        {
            TempData["sBokMsg"] = familyMemberInDb.FirstName + " " + familyMemberInDb.LastName +
                                  " has earned a free book today with a total of " +
                                  familyMemberInDb.NumberOfEventsAttendedOverall + " visits!";

        }

        _context.EventAttendances.Add(model);

        await _context.SaveChangesAsync();

        TempData["sSucMsg"] = familyMemberInDb.FirstName + " " + familyMemberInDb.LastName +
                              " attendance recorded successfully.";

        return Redirect("../Registration/RegistrationPartial");
    }

1 Ответ

0 голосов
/ 18 декабря 2018

Как насчет этого, когда tempDataResult получает значение скрытого поля ввода, содержащего значение временных данных:

 $(document).ready(function () {

       var tempDataResult = $('#tempDataField').val();

       if (tempDataResult == 1) 
       {
          $('#freeBookModal').modal('show');
       }
       else
       {
          $('#errorMessageModal').modal('show');
       }

    });
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...