сообщение об ошибке при динамическом создании UL и LI и расположении переключателя - PullRequest
Новая
       6

сообщение об ошибке при динамическом создании UL и LI и расположении переключателя

0 голосов
/ 21 мая 2018

У меня есть код ниже, когда я проверил.Я вижу, что UL и элемент списка создаются динамически при проверке.Что ожидается.Однако сообщение об ошибке помещает следующий переключатель в группе на следующую строку и помещает сообщение в первую строку после первого переключателя.Любая идея, чтобы заставить сообщение перейти к следующей строке или, возможно, после 2-й кнопки-переключателя без расположения кнопок.

Я использую data-parsley-required = "required".Я планирую поместить div после метки, но не знаю, как изменить сообщение об ошибке, так как единственное, что я использую в метке, это data-parsley-required = "required", удаление которого не отображает ошибку.

<div class="col-pa" data-toggle="buttons">
    <label class="button err" aria-describedby="parsley-id-multiple-Units">
        <input data-parsley-required="required" id="Gender" name="Units" type="radio" value="Fixed" data-parsley-multiple="Units" data-parsley-id="12"> 
        Fixed
    </label><ul class="validation-errors filled" id="parsley-id-multiple-Units"><li class="parsley-required">This is mandatory</li></ul>
    <label class="button">
        <input data-parsley-required="required" id="Units" name="Units" type="radio" value="Variable" data-parsley-multiple="Units"> 
        Variable
    </label>
</div>

Мой код cshtml 

<div class="buttons" role="group" data-toggle="buttons">
                <label class="@fixedClass">
                    @Html.RadioButtonFor(m => m.Units, "Fixed", new { data_parsley_required = "required" }) 
                    @Translator.GetTextOrDefault("CMS.Value.Units", "Fixed")
                </label>
                <label class="@variableClass">
                    @Html.RadioButtonFor(m => m.Units, "Variable", new { data_parsley_required = "required" }) 
                    @Translator.GetTextOrDefault("CMS.Value.Units", "Variable")
                </label>
            </div>

1 Ответ

0 голосов
/ 21 мая 2018

Согласно parsley.js doc , вы можете настроить параметры при первом запуске .parsley(options).В этом случае вам нужно выбрать параметр errorsWrapper.

. Ниже приведен пример того, как можно настроить таргетинг на контейнер сообщения об ошибке. 

$(() => {
  var instance = $("#myform").parsley({
    errorsWrapper: ".errorsWrapper"
  });
});
.errorsWrapper {
  display: none;
  padding: 4px;
}

.errorsWrapper.filled {
  display: block;
  border: 1px solid red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/parsley.js/2.8.1/parsley.js"></script>

<form id="myform">
    <label class="button err" aria-describedby="parsley-id-multiple-Units">
        <input name="Units" type="radio" value="Fixed" data-parsley-multiple="Units" data-parsley-required="required" /> 
        Fixed
    </label>
    <label class="button">
        <input name="Units" type="radio" value="Variable" data-parsley-multiple="Units" data-parsley-required="required" /> 
        Variable
    </label>

    <ul class="errorsWrapper">
    </ul>
    
    <br />
    <input type="submit" class="btn btn-default validate" />
</form>

У них также есть несколько полезных демонстраций , которые очень полезны для понимания работы плагина.

...