Inhalte aufrufen

Profilbild
- - - - -

Html Code / CSS Code / JQUERY Code wo hin?


  • Bitte melden Sie sich an, um eine Antwort zu verfassen.
3 Antworten zu diesem Thema

#1 Römu

Römu

    Newbie

  • Members
  • Punkt
  • 4 Beiträge

Geschrieben: 09 October 2017 - 07:05

Hallo Community
 

Habe da mal etwas tiefgehendere Frage betreffend theming.

 

Ich hatte bisher schon diverse Tool in unser .Net Projekt eingebunden anhand von CSS. Nun habe ich ein Date Time Picker

Tool gefunden das ich gerne in unsere Seite einbinden möchte.

 

Wo ich die HTML Code sowie die CSS Code hintun muss ist für mich mittlerweile kein Ding mehr. Jedoch habe ich keinen Plan wo

ich den JQUERY Code hintun muss. 

 

Ich hoffe jemand von euch kann mir da weiterhelfen.

 

 

HIER DAS TOOL DAS ICH EINBINDEN MÖCHtE:

https://codepen.io/a...aman/pen/wejQOO


Auf jedenfall schon mal vielen dank für das durchlesen meines Problems:)

 

Gruss Roman



#2 Murat Cakir

Murat Cakir

    SmartStore AG

  • Administrators
  • 1012 Beiträge

Geschrieben: 09 October 2017 - 18:17

Da gibt es mehrere Möglichkeiten. Wenn du den HTML-Code für den Picker in ein MVC EditorTemplate packst, bietet es sich an, die abhängigen Skripte per Html.AddScriptParts() hinzuzufügen:

Html.AddScriptParts(true, "https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.14.1/moment.min.js");
Html.AddScriptParts(true, "https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js");

Der erste Parameter (true) verhindert, dass die Dateien im Bundle aufgenommen werden. 

 

Man könnte diese beiden Dateien aber auch lokal einbinden und im Bundle aufnehmen im Template ~/Views/Shared/Layouts/_Document.cshtml. Dann benötigt man auch kein Html.AddScriptParts() mehr, da die Dateien als Teil des Bundles bei jedem Seitenaufruf bereits geladen werden.


Murat Cakir
SmartStore AG


#3 Römu

Römu

    Newbie

  • Members
  • Punkt
  • 4 Beiträge

Geschrieben: 10 October 2017 - 08:58

Hallo Murat

 

Wow vielen Dank für deine Antwort das weiß ich zu schätzen:)

Wenn ich die beiden Dateien lokal aufnehme. Muss ich dann diese einfach in die _Document.cshtml einfügen am schluss, und dann einfach den HTML code beim CMS einfügen?

 

Vielen Dank nochmals.

 

Gruss Roman



#4 Murat Cakir

Murat Cakir

    SmartStore AG

  • Administrators
  • 1012 Beiträge

Geschrieben: 10 October 2017 - 18:40

Wenn ich die beiden Dateien lokal aufnehme. Muss ich dann diese einfach in die _Document.cshtml einfügen am schluss [...]

 

Ja... am Schluss, in der Mitte, am Anfang... egal.

 

[...] und dann einfach den HTML code beim CMS einfügen?

 

Jein. Der Javaskript-Part fehlt ja noch, denn das Picker-Plugin muss ja noch per jQuery iniialisiert werden.

$('#datetimepicker').datetimepicker({
    icons: {
      time: "fa fa-clock-o",
      date: "fa fa-calendar",
      up: "fa fa-chevron-up",
      down: "fa fa-chevron-down",
      next: "fa fa-chevron-right",
      previous: "fa fa-chevron-left"
    }
})

Sorry, wenn ich jetzt hier kein jQuery Basics Tutorial abhalten kann (oder will)  :) Aber man kann diese Initialierung für jeden Picker einzeln vornehmen oder nur einmal an zentraler Stelle. Dann wird aus $('#datetimepicker') bspw. $('.my-datetimepicker').


Murat Cakir
SmartStore AG