Weiter-Button erst anzeigen, wenn Mindestanzahl an Wörtern erfüllt

Question

Guten Abend,

mit der Antwort ist es möglich, die eingegebenen Wörter in mehreren Textfeldern in einer Summe zu zählen. Wie kann ich realisieren, dass der Teilnehmer erst den Weiter-Button sieht, wenn er die Mindestanzahl von 300 Wörtern geschrieben hat? Zunächst hatte ich dies über

$cnt1 = preg_match_all('/\w{3,}/', value('AB01_01'));
$cnt2 = preg_match_all('/\w{3,}/', value('AB01_02'));
$cnt3 = preg_match_all('/\w{3,}/', value('AB01_03'));
$cnt4 = preg_match_all('/\w{3,}/', value('AB01_04'));
$cnt5 = preg_match_all('/\w{3,}/', value('AB01_05'));
$sum = $cnt1 + $cnt2 + $cnt3 + $cnt4 + $cnt5;
if ($sumcnt < 300) {
repeatPage('fehler_wortanzahl');
}

realisiert. Jedoch möchte ich nun verhindern, dass der Teilnehmer überhaupt auf den Weiter-Button drückt, bevor er die Wort-Summe geschrieben hat.

Kann man ggf.
SoSciTools.submitButtonsHide();
hierzu nutzen?

Vielen Dank!

Answer 1

Kann man ggf.
SoSciTools.submitButtonsHide();
hierzu nutzen?

Ja - die eigentliche Frage ist, wie Sie den Weiter-Knopf wieder einblenden, wenn genug Wörter vorhanden sind. Dafür müssen Sie den Filter nochmal in JavaScript-Code schreiben. Und zwar legen Sie eine Funktion in JavaScript an, welche die Wörter zählt und je nach Anzahl den Weiter-Knopf anzeigt oder ausblendet.

Diese Funktion lassen Sie dann über einen sog. Event-Handler immer dann aufrufen, wenn eine Taste in einem der Textfelder gedrückt wurde. Keine Sorge, das erledigt JavaScript selbst, wenn Sie addEventListener() oder SoSciTools.attachEvent() verwenden.

Sehen SIe mal, wie weit Sie kommen (nutzen Sie auch die JavaScript-Fehlerkonsole Ihres Browsers) und fragen Sie dann gerne wieder nach.

Comments

Danke für die Antwort!
Nach einigen Versuchen habe ich folgende Funktion eingebaut. Sicherlich nicht die schönste Lösung aber für einen Laien (wie mich) funktional:

<script type="text/javascript" src="../plugins/XRegExp/xregexp-all.min.js"></script>
<script type="text/javascript">
<!--
 
function WordCounter(inputID, outputID) {
  var textinput = document.getElementById(inputID);
  var textout = document.getElementById(outputID);

  // Wörter sind hier definiert als 2+ Buchstaben
  var tester = new XRegExp("\\p{L}{2,}", "Ag");
 
  function refresh() {
    var text = textinput.value;
    var words1 = XRegExp.match(document.getElementById("AB04_01").value, tester);
    var words2 = XRegExp.match(document.getElementById("AB04_02").value, tester);
    var words3 = XRegExp.match(document.getElementById("AB04_03").value, tester);
    var words4 = XRegExp.match(document.getElementById("AB07_01").value, tester);
    var words5 = XRegExp.match(document.getElementById("AB07_02").value, tester);
    textout.innerHTML = words1.length + words2.length + words3.length + words4.length + words5.length;

}

function CounterCheck() {
  if (textout.innerHTML <= 299)
    return SoSciTools.submitButtonsHide();
  else
    return SoSciTools.submitButtonsDisplay();
}

  textinput.addEventListener("keyup", refresh);
  refresh();
  textinput.addEventListener("keyup", CounterCheck);
  CounterCheck();
  
  }
    
//
new WordCounter("AB04_01", "wordcount");
new WordCounter("AB04_02", "wordcount");
new WordCounter("AB04_03", "wordcount");
new WordCounter("AB07_01", "wordcount");
new WordCounter("AB07_02", "wordcount");
 
// -->
</script>

Falls deutliche Verbesserungen ins Auge stechen, freue ich mich natürlich über einen Tipp ;)

---

Respekt - die Mehrheit der Nutzer hätte das so nicht hinbekommen.

Technisch könnte man beim Event-Aufruf noch ein wenig optimieren, aber das ist nicht ästhetischer Natur. Wenn es so funktioniert, dann lassen Sie es genau so :)