ASP.NET-Kern - HTML-Codeblock Wiederverwendung

Question

Ich arbeite an einem ASP.NET Core-Projekt mit Bootstrap 4 und ich habe einige Bootstrap Modalverben, die ich in mehreren Ansichten zeigen möge.

Diese Modals haben einige Javascript-Funktionen für interne Elemente wie Buttons und Eingänge.

Was ist der richtige Ansatz, um diese Modale (mit ihrem Javascript) in mehreren Ansichten zu laden?

Ich dachte, ich PartialViews verwenden würde, aber ich weiß nicht, wo Sie den Javascript-Code setzen (ich weiß, dass es in PartialViews setzt eine schlechte Praxis ist).

Answer 1

Erstellen Sie eine separate JS-Datei, und verweisen Sie sie am Ende jeder Seite, die diese Teilansicht verwendet, so dass das Skript das Seitenrendering nicht blockiert.

Alternativ könnten Sie eine Layout-Datei erstellen, die sowohl die Modalverben HTML und JS enthält, und lassen Sie Ihren Blick von dieser erben. Ich würde zwar aufgrund der Zusammensetzung über Vererbung grundsätzlich von diesem Ansatz abraten.

Answer 2

Tag helpers gebrauchte besser dafür sein könnte, hier ist ein Beispiel für ein Bootstrap-modal-Tag Helfer ModalTagHelper

Dann, wenn Sie diese Datei in Ihrem _ViewImports setzen:

@using AssemblyNameWithTagHelpers 
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers 
@addTagHelper "*, AssemblyNameWithTagHelpers" 

Sie einen Tag Helfer verwenden können, wie dies:

<modal id="simpleModalFromAnchor" title="Modal Title"> 
    <modal-body> 
     <h4>Something happened</h4> 
     <p>Something happened</p> 
    </modal-body> 
</modal> 

Mit dem Javascript, steckt es in einer separaten Datei js und verweisen Sie von jeder Seite, die Sie verwenden th e modal in, besser noch, lege es in ein Bündel mit anderen gut verwendeten Komponenten und schließe es in den unteren Bereich deiner _Layout-Datei ein