Neu Freitextfeld über Variation - Zeichenbeschränkung für Gravur

[TobiTrouble]

Hallo Zusammen,

ich hatte das Thema bereits in einer anderen Kategorie eröffnet, ich vermute es war dort nicht ganz richtig aufgehoben, da keine Antworten kamen, deshalb probiere ich es hier noch einmal, denke mal ich bin nicht der einzige mit solch einer Anforderung

Ich möchte bei bestimmten Artikeln im Shop 5 die Möglichkeit einer Gravur anbieten.
Je nachdem welche Größenvariante ausgewählt wird, sollen im Shop dann 3, 4 oder 6 Zeilen für Freitext eingeblendet werden. Probiert habe ich das mit Anlegen einer Variation, Freitextauswahl. Sieht auch soweit gut aus (falls es weitere Möglichkeiten gibt, würde ich auch das in Betracht ziehen).

Allerdings ist die Zeichenanzahl in den jeweiligen Feldern begrenzt, z.B. mal sind es nur 12, mal 14 Zeichen.

Soweit ich im Browser erkennen kann, ist das Textfeld JTL seitig auf 255 Zeichen eingestellt, das könnte man auf jeden Fall überschreiben und eingrenzen auf z.B. 12 (funktioniert nach Einstellung im Browser auch).

Wie bzw. mit welcher Variable kann ich das aber nun global im Backend steuern, dass wenn ich "Gravur1" anlege (Name erstmal egal), dieses Feld immer nur 12 Zeichen zulässt und wenn ich "Gravur2" mit einblende/anlege, dieses Feld eben 14 Zeichen zulässt.

Wenn jetzt auch noch eine Beschriftung bzw. ein Hinweis möglich wäre, wie viele Zeichen noch übrig sind oder gar, dass manche Zeichen eingeschränkt bzw. nicht zugelassen sind, wäre das das sehr elegant Die Begrenzung selbst würde aber im ersten Schritt genügen.


Hier seht ihr wie ich es im Shop bei mir meine:






So würde ich es mir wünschen:




Danke.

 

[artm]

Das ordentlich mit Validierung zu machen ist nur mit Plugin möglich.

Aber es gibt immer noch einfache und unsichere Möglichkeit, das mit der Template zu lösen. Alles, was Sie tun müssen, ist, die Variation nach dem Namen zu überprüfen und dann "maxlength" zu ändern.

Die Datei befindet sich hier:
"productdetails/variation.tpl"

maxlength={if $variation->cName==="Gravour Text 1"}12{elseif $variation->cName==="Gravour Text 2"}14{else}255{/if}

 

[TobiTrouble]

Danke für die erste Antwort und einem Ideenansatz.
Grundlegend - welches Plugin wäre für Shop 5 dafür geeignet?

Den Code wollte ich probieren, das funktioniert aber leider nicht so richtig.
Den Ansatz finde ich allerdings super, wenn das funktioniert, dürfte das auch erst einmal ausreichen und meine Anforderung erfüllen.

Wenn ich die variation.tpl bearbeite und den Code so einfüge:



bekomme ich auf jeder Variationsseite einen Error 500, die Seite wird nicht mehr geladen. Ursprünglich stand hinter maxlength "maxlength=255", ich habe Ihren Code mit der richtigen Beschriftung aus der Wawi eingefügt.

Wenn ich die Freitextzeile im Browser untersuche, steht der Name aus der WaWi allerdings unter dem "js-btn-slider-wrapper" ist hier evtl. etwas im Code zu verändern, damit der Bezug stimmt, oder habe ich etwas komplett falsch eingefügt?

 

[css-umsetzung]

Es heisst $Variation->cName} und nicht $variation->cName

 

[artm]

Grundlegend - welches Plugin wäre für Shop 5 dafür geeignet?

Ob so ein Plugin bereits existiert kann ich nicht sagen, ich meinte aber die individuelle Entwicklung von Service-Partner.

bekomme ich auf jeder Variationsseite einen Error 500, die Seite wird nicht mehr geladen. Ursprünglich stand hinter maxlength "maxlength=255", ich habe Ihren Code mit der richtigen Beschriftung aus der Wawi eingefügt.

Ich habe den meinen obigen Code nicht ausprobiert. Dieser sollte funktionieren:

{block name='productdetails-variation-info-variation-text'}
    {if $Variation->cName==="Gravour Text 1"}
        {assign var=maxlength value=12}
    {elseif $Variation->cName==="Gravour Text 2"}
        {assign var=maxlength value=14}
    {else}
        {assign var=maxlength value=255}
    {/if}
    <label for="vari-{$Variation->kEigenschaft}" class="sr-only">{$Variation->cName}</label>
    {input id="vari-{$Variation->kEigenschaft}" name='eigenschaftwert['|cat:$Variation->kEigenschaft|cat:']'
       value=$oEigenschaftWertEdit_arr[$Variation->kEigenschaft]->cEigenschaftWertNameLocalized|default:''
       data=['key' => $Variation->kEigenschaft] required=$Variation->cTyp === 'PFLICHT-FREIFELD'
       maxlength=$maxlength}
{/block}

 

[TobiTrouble]

Super - Perfekt.
Der Code funktioniert, so habe ich mir das vorgestellt, das kann ich nun so adaptieren auf verschiedene Artikel Vielen Dank!
Hättest du noch eine Idee, wie man in den Code Zeichen die nicht zulässig sind integrieren kann?

Freue mich auch über Ideen, wie man die Anzeige am Freifeld (z.B. " Max 12 Zeichen") einblenden könnte und ggfls. eine Art Zeichenzähler, wie viele Zeichen noch zum Eintragen verfügbar sind!

 

[artm]

Hättest du noch eine Idee, wie man in den Code Zeichen die nicht zulässig sind integrieren kann?

Die Werte kann man mit pattern-Attribut begrenzen.

Freue mich auch über Ideen, wie man die Anzeige am Freifeld (z.B. " Max 12 Zeichen") einblenden könnte und ggfls. eine Art Zeichenzähler, wie viele Zeichen noch zum Eintragen verfügbar sind!

Zeichenzähler ausgeben kann man nur mit JS.

Wie ich beretis erwähnt habe, für die Validierung, Plugin wäre hier die sicherste Lösung.

Ich habe hier ein neues Beispiel basierend auf dem vorherigen gebastelt, sollte ziemlich einfach und verständlich sein.

{block name='productdetails-variation-info-variation-text'}
    {if $Variation->cName==="Gravour Text 1"}
        {assign var=maxlength value=12}
        {assign var=variPattern value="[A-Za-z0-9]"}
    {elseif $Variation->cName==="Gravour Text 2"}
        {assign var=maxlength value=14}
        {assign var=variPattern value="[A-Za-z0-9]"}
    {else}
        {assign var=maxlength value=255}
        {assign var=variPattern value=""}
    {/if}
    <label for="vari-{$Variation->kEigenschaft}" class="sr-only">{$Variation->cName}</label>
    {input id="vari-{$Variation->kEigenschaft}" name='eigenschaftwert['|cat:$Variation->kEigenschaft|cat:']'
       value=$oEigenschaftWertEdit_arr[$Variation->kEigenschaft]->cEigenschaftWertNameLocalized|default:''
       data=['key' => $Variation->kEigenschaft] required=$Variation->cTyp === 'PFLICHT-FREIFELD'
       maxlength=$maxlength}
    <script>
        let variInput = "#vari-{$Variation->kEigenschaft}";
        let variInputInfo = "#vari-info-{$Variation->kEigenschaft}";
        $(variInput).attr("pattern", "{$variPattern}" + "{literal}{{/literal}" + {$maxlength} + "{literal}}{/literal}");
        $(variInput).parent().prev("dt").html("{$Variation->cName} (Max {$maxlength} Zeichen)");
        $(variInput).after('<span id="' + variInputInfo + '"></span>');
        $(variInput).keyup(function() {
            let cLeft = {$maxlength} - $(variInput).val().length;
            $(document.getElementById(variInputInfo)).html(cLeft + " Zeichen noch");
        });
    </script>
{/block}

 

[TobiTrouble]

Cool, das gefällt mir immer besser
Funktioniert an sich mit dem Skript, allerdings leider nicht vollständig.

Oberes Eingabefeld ist anders benannt, dann greifen die Standard 255 Zeichen - das ist ok, mit dem Skript zählt er sogar herunter.
Unteres Feld wird durch den Code angesprochen, damit die Zeichenanzahl auf 14 begrenzt ist - auch gut, mit dem Skript allerdings wird hier nicht gezählt, fehlt da etwas im Code?
Du hast als Value Wert im Code für die Zeichen selbst angegeben: {assign var=variPattern value="[A-Za-z0-9]"}, er nimmt allerdings in beiden Fällen auch alle anderen Zeichen, kann ich das im Code anpassen und wenn ja wo?

 

[artm]

s. PM, die Anpassung für mehrere Felder