JSFiddle - React, Tailwind, and code Playground

by ltdeta

HTML

<div style="padding-bottom:5px;">Username:
  <br>
  <INPUT type="text" value="1" id="username" name="username" class="inputfield" maxlength="20" size="30">
  <br>
</div>
<div style="padding-bottom:5px;">Vorname:
  <br>
  <INPUT type="text" value="2" id="vorname" name="vorname" oldvalue="" class="inputfield" maxlength="40" size="30">
  <br>
</div>
<div style="padding-bottom:5px;">Nachname:
  <br>
  <INPUT type="text" value="3" id="nachname" name="nachname" oldvalue="" class="inputfield" maxlength="40" size="30">
  <br>
</div>
<div style="padding-bottom:5px;">Beschreibung:
  <br>
  <INPUT type="text" value="4" id="user_beschreibung" name="user_beschreibung" oldvalue="" class="inputfield" maxlength="100" size="30">
</div>
<input id="btntest" type='button' value='Testbtn'></input>

JavaScript

var $jq = jQuery.noConflict();

$jq(document).ready(function() {

  $jq('#btntest').click(function(event) {
    testen();
  })

  function testen() {
    var arrcheckInput = [];
    arrcheckInput.push({
      name: 'Username',
      value: $jq('#username').prop('value'),
      type: 0,
      result: 0
    });
    arrcheckInput.push({
      name: 'Vorname',
      value: $jq('#vorname').prop('value'),
      type: 1,
      result: 0
    });
    arrcheckInput.push({
      name: 'Nachname',
      value: $jq('#nachname').prop('value'),
      type: 1,
      result: 0
    });
    arrcheckInput.push({
      name: 'Beschreibung',
      value: $jq('#user_beschreibung').prop('value'),
      type: 1,
      result: 0
    });

    if (arrcheckInput.length > 0) {
      var newValue = '';
      var jsarray = new Array();
      var regEx0 = new RegExp('[a-zA-Z0-9]', 'g');
      var regEx1 = new RegExp('[A-Za-z0-9äöüÄÖÜ+_\-\s]', 'g');
      var errMsg = new Array('F\u00FCr die folgenden Felder sind nur Buchstaben, Zahlen und Umlaute erlaubt:\n', 'F\u00FCr die folgenden Felder sind nur Buchstaben, Zahlen, Umlaute, Plus, Minus, Bindestrich und Unterstrich erlaubt:\n');
      var errFields = new Array();
      errFields[0] = [];
      errFields[1] = [];
      $jq.each(arrcheckInput, function(key, obj) {
        regEx0.lastIndex = 0;
        regEx1.lastIndex = 0;
        console.log(' Name: ' + obj.name + ' / Value: ' + obj.value + ' / Type:' + obj.type + ' / ' + ((obj.type == 0) ? 'reg[0]: ' + regEx0.test(obj.value) : 'reg[1]: ' + regEx1.test(obj.value)));
        regEx0.lastIndex = 0;
        regEx1.lastIndex = 0;
        if (obj.type == 0) {
          if (regEx0.test(obj.value) == false) {
            errFields[0].push(obj.name);
            console.log('Err[0]-Name: ' + obj.name);
          }
          //alert(errMsg[0]);
        } else if (obj.type == 1) {
          if (regEx1.test(obj.value) == false) {
            errFields[1].push(obj.name);
           ...