razor MVC-EF, wie zum ein-und ausblenden eines div-basierend auf Modell-Zustand

Total noob hier 🙂
Ich habe einfache form auf meinem index.cshtml zum senden von Werten von m y-controller und die zeigt auch die Ergebnisse. Ich möchte diese form als hidden @if (Model != null). Es sieht wie folgt aus:

HTML:

<div id="inputform" class="visible">
    <form id="certlookup" class="form-inline" role="form" method="get">
        <div class="input-group">
            <div><input class="form-control" name="prefix" placeholder="99" maxlength="2" type="number" required /></div>
            <div><select class="form-control dropdown" name="type" id="type"><option value="A">A</option><option value="B">B</option></select></div>
            <div>
                <input class="form-control" name="suffix" placeholder="9999" maxlength="4" type="number" required />
            </div>
            <div>
                <input class="btn btn-primary" type="submit" value="Go!" />
            </div>
        </div>
    </form>
</div>
@if (Model != null)
{...}

Ich bin mir nicht sicher, was der beste Weg, dies zu tun ist. Ich habe versucht, eine variable nach meinem Modell != null-Anweisung, die Einstellung der Klasse=@hidden, aber diese variable nicht in das Formular.

Ist das möglich? Dies ist für ein mobile-first-site so, ich möchte die Eingabe in ein Formular zu gehen Weg, nachdem die Ergebnisse werden zur Verfügung gestellt, aber im Idealfall möchte ich nicht verwenden Sie eine separate Seite für die form und die Ergebnisse.
Danke!

InformationsquelleAutor VACoder | 2015-09-19
  1. 6

    Nur prüfen, ob das Modell null ist, bevor die form:

    @if (Model == null)
{
<div id="inputform" class="visible">
    <form id="certlookup" class="form-inline" role="form" method="get">
        <div class="input-group">
            <div><input class="form-control" name="prefix" placeholder="99" maxlength="2" type="number" required /></div>
            <div><select class="form-control dropdown" name="type" id="type"><option value="A">A</option><option value="B">B</option></select></div>
            <div>
                <input class="form-control" name="suffix" placeholder="9999" maxlength="4" type="number" required />
            </div>
            <div>
                <input class="btn btn-primary" type="submit" value="Go!" />
            </div>
        </div>
    </form>
</div>
}

    Oder vielleicht legen Sie die Klasse im "inputformdiv":

    @{
   string cssClass = Model == null ? "visible" : "hidden";
}
<div id="inputform" class="@cssClass">
<form id="certlookup" class="form-inline" role="form" method="get">
    <div class="input-group">
        <div><input class="form-control" name="prefix" placeholder="99" maxlength="2" type="number" required /></div>
        <div><select class="form-control dropdown" name="type" id="type"><option value="A">A</option><option value="B">B</option></select></div>
        <div>
            <input class="form-control" name="suffix" placeholder="9999" maxlength="4" type="number" required />
        </div>
        <div>
            <input class="btn btn-primary" type="submit" value="Go!" />
        </div>
    </div>
</form>

    • Danke Stefano! Ich machte einen kleinen zwicken, um Ihre zweite empfohlene Variante: Modell.Count() == 0 ? "visible" : "hidden"; und es funktioniert wie gewünscht! Danke!!!
    • Wie kann ich das gleiche tun, aber mit teilweisen Ansichten und Html.RenderAction. Dem partial view rendert, egal was die if-Bedingung ist
    InformationsquelleAutor Stefano Castriotta
Schreibe einen Kommentar