Валидатор Boostrap не проверяется и ajax запрос не работает - PullRequest
0 голосов
/ 04 марта 2020

Я просматривал множество тем с той же проблемой, но она не решила эту проблему для меня. В этом приложении уже есть формы, использующие проверку bootstrap, и они прекрасно работают, поэтому я в основном скопировал форму и изменил ее, чтобы она работала для меня, но ни проверка, ни запрос ajax не работают (он перенаправляет в другое представление вместо этого) ..

При попытке использовать другие формы я вижу, что классы "help block with error" отображаются, но они никогда не отображаются для меня ..

Я перепробовал все предложения в других темах, но безрезультатно.

Это код.

    //Reward form validation
    $('.form-validate-reward').bootstrapValidator({
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        trigger: "blur",
        fields: {
            firstname: {
                validators: {
                    notEmpty: {
                        message: 'Du måste fylla i förnamn'
                    }
                }
            },
            lastname: {
                validators: {
                    notEmpty: {
                        message: 'Du måste fylla i efternamn'
                    }
                }
            },
            email: {
                validators: {
                    notEmpty: {
                        message: 'E-postadress är obligatoriskt'
                    },
                    regexp: {
                        regexp: /^[^åäöÅÄÖ]*$/,
                        message: 'Vi stödjer tyvärr inte e-postadresser innehållande svenska tecken'
                    },
                    emailAddress: {
                        message: 'Ange en korrekt e-postadress'
                    }
                }
            },
            address: {
                validators: {
                    notEmpty: {
                        message: 'Du måste fylla i adress'
                    }
                }
            },
            zipcode: {
                validators: {
                    notEmpty: {
                        message: 'Du måste fylla i postnummer'
                    }
                }
            }
        }
    }).on('success.form.bv', function (e) {
        // Prevent form submission
        e.preventDefault();
        console.log('inne!!');

        // Get the form instance
        var $form = $(e.target);

        // Use Ajax to submit form data
        $.post($form.attr('action'), $form.serialize(), function (result) {
            var contentguid = $form.find('input[name="contentguid"]').val();

            var div = $('#' + contentguid);
            console.log('inne');

            div.fadeOut(function () {
                div.html(result);
                div.fadeIn();
            });

            dataLayer.push(
                {
                    'event': 'win',
                    'eventCategory': 'vinst',
                    'eventAction': $form.find('select[name="size"]').val(),
                    'eventLabel': '',
                    'eventValue': '0'
                });

        });
    });
    <div id="@Model.ContentGuid">
        <form method="POST" action="/rewardformblock/sendform/" class="form-validate-reward" role="form">
            <div class="form-group">
                <h3>@Html.Translate("/blocks/rewardformblock/form/presentation/yourmessage/header")</h3>
            </div>
            <div class="form-group validated-dropdown">
                <label for="size">@Html.Translate("/blocks/rewardformblock/form/choosesize/header")</label>
                <select class="form-control " name="size" id="size">
                    <option value="@Html.Translate("/blocks/rewardformblock/form/choosesize/size/medium")">@Html.Translate("/blocks/rewardformblock/form/choosesize/size/medium")</option>
                    <option value="@Html.Translate("/blocks/rewardformblock/form/choosesize/size/extra-large")">@Html.Translate("/blocks/rewardformblock/form/choosesize/size/extra-large")</option>
                </select>
            </div>

            <div class="form-group">
                <label for="firstname">@Html.Translate("/blocks/rewardformblock/form/firstname/header")</label>
                <input type="text" class="form-control" name="firstname" id="firstname">
            </div>
            <div class="form-group">
                <label for="lastname">@Html.Translate("/blocks/rewardformblock/form/lastname/header")</label>
                <input type="text" class="form-control" name="lastname" id="lastname">
            </div>
            <div class="form-group">
                <label for="address">@Html.Translate("/blocks/rewardformblock/form/address/header")</label>
                <input type="text" class="form-control" name="address" id="address">
            </div>
            <div class="form-group">
                <label for="zipcode">@Html.Translate("/blocks/rewardformblock/form/zipcode/header")</label>
                <input type="text" class="form-control" name="zipcode" id="zipcode">
            </div>
            <div class="form-group">
                <label for="email">@Html.Translate("/blocks/rewardformblock/form/email/header")</label>
                <input type="email" class="form-control" name="email" id="email">
            </div>
            <input type="hidden" name="contentguid" value="@Model.ContentGuid" />
            <p class="clearfix"><button type="submit" class="btn btn-primary pull-right">@Html.Translate("/general/buttons/send")</button></p>
        </form>
    </div>

это класс ..

        public override ActionResult Index(RewardFormBlock currentContent)
    {
        var model = new RewardFormViewModel {ContentGuid = currentContent.ContentGuid};

        return PartialView(model);
    }

    [HttpPost]
    public ActionResult SendForm(RewardFormViewModel model)
    {
        if (!ModelState.IsValid)
        {
            return PartialView("Index", model);
        }

        var mailService = ServiceLocator.Current.GetInstance<IEmailService>();

        try
        {
            mailService.SendMail(model.ToMailMessage());
        }
        catch (Exception ex)
        {
            var logger = ServiceLocator.Current.GetInstance<ILogger>();
            logger.Log(
                $"Error when sending mail from RewardFormBlock with contentguid: {model.ContentGuid} " +
                $"Name: {model.FirstName} {model.LastName}" + $"Email: {model.Email} ", LogType.Error, ex);

            return PartialView("SubmitError");
        }

        return PartialView(model);
    }

А это загрузка скриптов

enter image description hereenter image description here

...