Hinzufügen jquery Validierung, um die Gewählte drop-down-Liste auf der post in ASP.NET MVC Seite
Ich bin mit einer Standard-Website-Vorlage von Visual Studio 2013 preview integriert Bootstrap standardmäßig (die ich ersetzt mit v3)
In einer form, die Jquery Validierung auf POST richtig highlights-Fehler-Felder, außer für das drop-down-Boxen, die habe ich gestaltet mit den Gewählten plugin.
Mein code für das drop-down-Liste in Frage:
@Html.DropDownListFor(
x => x.Job.State,
Model.States,
"Select a State", new { @class = "form-control chosen-select"})
@Html.ValidationMessageFor(model => model.Job.State)
Macht dies wie folgt:
<select class="input-validation-error form-control chosen-select" id="Job_State" name="Job.State" style="width: 50%; display: none;">
<option value="">Select a State</option>
<option value="ACT">ACT</option>
<option value="NSW">NSW</option>
<option value="QLD">QLD</option>
<option value="TAS">TAS</option>
<option value="NT">NT</option>
<option value="VIC">VIC</option>
<option value="WA">WA</option>
</select>
<div class="chosen-container chosen-container-single" style="width: 135px;" title="" id="Job_State_chosen"><a class="chosen-single" tabindex="-1"><span>Select a State</span><div><b></b></div>
</a>
<div class="chosen-drop">
<div class="chosen-search">
<input type="text" autocomplete="off"></div>
<ul class="chosen-results">
<li class="active-result result-selected" style="" data-option-array-index="0">Select a State</li>
<li class="active-result" style="" data-option-array-index="1">ACT</li>
<li class="active-result" style="" data-option-array-index="2">NSW</li>
<li class="active-result" style="" data-option-array-index="3">QLD</li>
<li class="active-result" style="" data-option-array-index="4">TAS</li>
<li class="active-result" style="" data-option-array-index="5">NT</li>
<li class="active-result" style="" data-option-array-index="6">VIC</li>
<li class="active-result" style="" data-option-array-index="7">WA</li>
</ul>
</div>
</div>
<span class="field-validation-error">State is required.</span>
Beachten Sie, dass die input-validation-error-Klasse wird auf ein element Hinzugefügt, dass die Gewählten sets an display:none so offensichtlich der Rand nicht angezeigt bekommt.
Ideal, wenn ich hinzufügen kann, der die input-validation-error-Klasse für das div-Element innerhalb der select -, dann wird dieses Update mein problem, aber ich weiß nicht, wie zu tun, also jede Hilfe wäre sehr willkommen!
Hinweis - ich bin eigentlich nicht nach client-seitige Validierung, ich bin nur mit der überprüfung auf POST.
- Sind Sie mit jQuery Validierung für die client-Validierung?
- Ja, die eine, die kommt als Teil der Standard-Vorlagen, denke, es ist jquery.überprüfen und jquery.überprüfen.aufdringlich
- Wenn eine der Antworten, die Ihnen geholfen, dann möchten Sie vielleicht, um diese als solche markieren.
Du musst angemeldet sein, um einen Kommentar abzugeben.
@Bartek Marnane, sind Sie gehen zu müssen, um überschreiben Sie die highlight und unhighlight ist Rückrufe, jQuery Validierung standardmäßig verwendet, wenn die Anwendung es ist die Prüfung nicht bestanden css-Klasse. Das, was Sie wollen zu tun ist, untersuchen Sie das element markieren und unhighlight ist, um zu sehen, ob es ein ausgewähltes drop-down-Liste anwenden/entfernen der css-Klasse aus dem element, das präsentieren der Liste.
Habe ich noch nicht verifiziert markieren und unhighlight ist Funktion gewählt, denn ich habe nicht gearbeitet mit diesem plugin vor. Wenn alles, was Sie werden am Ende tweaking meine css-Klasse schauen Sie auf das element, um zu sehen, wenn es ein ausgewähltes drop-down-oder nicht. Erkennen, dass das element, das Feuer Validierung wird die eine, die nicht sichtbar ist. Wenn es nicht brennen Validierung dann gibt es eine Einstellung in jQuery validate ignorieren bestimmter Elemente.
Ich habe nie gewählt, aber ich glaube, Sie könnten in der Lage sein, den input-validation-error-Klasse, die in Ihrer Sicht durch die überprüfung der ModelState: