Dialog-Modal-HTML-Unterstützung

Hallo,

Auf einer Kategorieseite, auf der ein Benutzer kein Thema erstellen kann, verwende ich einen Bannertext mit einem Link zum Thema Vertrauensstufen.
Screenshot 2022-12-09 at 9.09.29

Das HTML funktioniert im Banner einwandfrei

Aber wenn man auf das + New Topic klickt, verarbeitet das Modal das HTML nicht.

Es wäre wirklich gut, wenn das Modal HTML genauso verarbeiten könnte wie das zuvor verwendete Bootbox-Modal.

Danke :slightly_smiling_face:

3 „Gefällt mir“

@pmusaraj hat eine Lösung bereitgestellt, die HTML-Inhalte unterstützt hier.

4 „Gefällt mir“

Hallo Tim,

Danke für den Tipp :slightly_smiling_face: Ich habe dies mit modifyClass geändert, aber ich denke, es wäre eine sinnvolle Änderung, diesen Dialog in core htmlSafe zu machen, da das Kategoriebanner auch HTML verarbeitet.

import { htmlSafe } from "@ember/template";

export default {
  name: "dialog-html-support",

  initialize() {
    withPluginApi("0.8.7", (api) => {
      api.modifyClass("component:d-navigation", {
        pluginId: "dialog-html-support",

        actions: {
          clickCreateTopicButton() {
            if (this.categoryReadOnlyBanner && !this.hasDraft) {
              this.dialog.alert({
                message: htmlSafe(this.categoryReadOnlyBanner),
              });
            } else {
              this.createTopic();
            }
          },
        },
      });
    });
  },
};
3 „Gefällt mir“

Hallo Team!

Für die unten stehende Einstellung würde ich mir die Option wünschen, einen Link verwenden zu können. In meinem Fall kann eine Kategorie von jedem eingesehen werden; um jedoch Themen zu erstellen und zu beantworten, muss man einer Gruppe angehören.

Bannertext, wenn ein Benutzer in dieser Kategorie kein Thema erstellen kann: “

Ich hatte also versucht, Text zu verwenden wie:

Um teilzunehmen, müssen Sie „Link zur Gruppe hinzufügen“.

Leider unterstützt diese Einstellung nur einfachen Text, keine Links. Könnte das Team eine Änderung in Betracht ziehen?

2 „Gefällt mir“

Ich habe deinen Beitrag zu diesem Thema verschoben, um die Anfragen für diese Änderung zusammenzuhalten. :+1:

2 „Gefällt mir“

Danke Jammydodger!

Manchmal kann es schwierig sein, zu erkennen, wo man Dinge am besten postet. Discourse ist riesig und das ist nicht unbedingt schlecht; es kann uns, die wir noch relativ neu sind, jedoch manchmal einschüchtern.

Aber hier ist Ihr fantastisches Team und die Community, die uns allen mehr als oft entscheidend hilft!

2 „Gefällt mir“

Hallo Don & @TimJensen wird diese Lösung auch Markdown wie in meinem Beispiel unten beheben? Zu verwenden:

Um an der Kategorie teilzunehmen, müssen Sie sich [bewerben](/g/groupname/members).

Der Code muss vermutlich auch eine Theme-Komponente sein. In welchem Abschnitt muss ich dies eingeben?


EDiT:
Hmmm.. das Hinzufügen einer JS-Datei ist im Moment vielleicht etwas über meine derzeitigen Fähigkeiten hinaus. :sad_but_relieved_face: Ich benötige etwas Hilfe, um dies erfolgreich zu erreichen.

1 „Gefällt mir“

Hallo Dan,

Das Banner unterstützt HTML. Bei diesem Thema geht es um den Dialog, der angezeigt wird, wenn Sie auf die Schaltfläche „Thema erstellen“ klicken.

Nein, es unterstützt HTML. Ihr Beispiel wäre so etwas wie dieses :arrow_down_small:

Um an der Kategorie teilzunehmen, müssen Sie sich hier bewerben: <a href="/g/groupname/members">Bewerben</a>.

Dies sollte im Header funktionieren, um HTML im Dialog zu unterstützen. :slightly_smiling_face:

<script type="text/discourse-plugin" version="0.8">
  const { htmlSafe } = require("@ember/template");

  api.modifyClass("component:d-navigation", {
    pluginId: "dialog-html-support",
        
    actions: {
      clickCreateTopicButton() {
        if (this.categoryReadOnlyBanner && !this.hasDraft) {
          this.dialog.alert({
            message: htmlSafe(this.categoryReadOnlyBanner),
          });
        } else {
          this.createTopic();
        }
      },
    },
  });
</script>
3 „Gefällt mir“

cool, ich muss also nur HTML anstelle von Markdown verwenden.

Funktioniert das Banner, wenn jemand versucht, innerhalb einer Kategorie zu antworten und/oder ein neues Thema zu erstellen? Wo, wenn ich Ihre Anfrage richtig verstehe, bezieht sich diese auf das Theme-Component des Buttons “Neues Thema”?

Würden Sie mit Ihrem JS einfach ein neues Theme-Component erstellen und die *.js-Datei hochladen? Wird sonst noch etwas im CSS usw. benötigt? Oder funktioniert es einfach?

Und wenn ich einen Dialog vor dem Link-Button möchte, was müsste ich dann programmtechnisch tun? Entschuldigen Sie, ich lerne noch.

1 „Gefällt mir“

Erstellen Sie einfach eine neue Komponente in Admin und fügen Sie den obigen Code in den Bereich Allgemein > Header ein. Es ermöglicht die Verarbeitung von HTML im Modal, wenn Sie auf die Schaltfläche Neues Thema klicken. :slightly_smiling_face:

Demo

Ohne Code
Wie Sie sehen können, unterstützt das Banner HTML, aber wenn ich auf die Schaltfläche Neues Thema klicke, wird das Modal (Dialogfeld) nicht unterstützt.


Mit Code


Ich bin mir nicht sicher, was Sie mit :arrow_down_small: meinen

2 „Gefällt mir“

Vielen Dank für die Erklärung, wo der Code für die HTML-Korrektur hinzugefügt werden soll.

Tatsächlich beantwortet Ihr erstes Video meine Frage perfekt und gibt mir Klarheit. Der Text vor dem Dialog vor dem Link-Button ist derselbe wie das Markdown-Verfahren. (Das erste Video zeigt es, wenn es ohne den Code fehlschlägt) Ich habe es auch in Ihrem Codebeispiel übersehen :facepalm:

d. h.

Um teilzunehmen “Markdown”
Um teilzunehmen “HTML”

Vielen Dank, dass Sie mir geholfen haben, mich zu erleuchten.

Dan

2 „Gefällt mir“

Entschuldigung für die Verzögerung hier, Leute, das sollte es beheben: FIX: Allow HTML in category read-only dialog by pmusaraj · Pull Request #20349 · discourse/discourse · GitHub

4 „Gefällt mir“

Dieses Thema wurde nach 2 Tagen automatisch geschlossen. Neue Antworten sind nicht mehr möglich.