function setStatusColors

DJGBN
Autor
Offline

Mehr

2 Jahre 7 Monate her #8154 von DJGBN

function setStatusColors wurde erstellt von DJGBN

Hallo Zusammen,
ich bräuchte mal Hilfe.
Ich würde gerne diese Funktion function setStatusColors auf 2 Formulare anweden Problem ist JS ist mal so garnicht meins.

function setStatusColors () {
//adapt 89 in data-f89 to your field id
var elements = jQuery(".vfdvvalue.data-f86");
if (elements) {
      jQuery.each(elements, function (index, element) {
          var status = jQuery(element).text();
          switch (status) {
              case 'vergeben' :
                  jQuery(element).css('color', 'red');
                  break;
              case 'offen' :
                  jQuery(element).css('color', 'green');
                  break;
              default:
                  //"Neu" does not have a special color
                  break;
          }
      });
}
}

jQuery(document).ready(function () {setStatusColors()});

function setStatusColors () {
//adapt 89 in data-f89 to your field id
var elements = jQuery(".vfdvvalue.data-f89");
if (elements) {
      jQuery.each(elements, function (index, element) {
          var status = jQuery(element).text();
          switch (status) {
              case 'vergeben' :
                  jQuery(element).css('color', 'red');
                  break;
              case 'offen' :
                  jQuery(element).css('color', 'green');
                  break;
              default:
                  //"Neu" does not have a special color
                  break;
          }
      });
}
}

jQuery(document).ready(function () {setStatusColors()});

so Fuktioniert immer nur ein Formular.
Vielen Dank schon mal.
MFG Marcel

Administrator IV
Offline

Mehr

2 Jahre 7 Monate her - 2 Jahre 7 Monate her #8158 von Administrator IV

Administrator IV antwortete auf function setStatusColors

Hallo Marcel,

du musst einfach nur eindeutige Funktionsnamen sicherstellen.

In diesem Beispiel JavaScript (das reine JavaScript Äquivalent der jQuery Funktion $.ready) wird immer nur die zweite der beiden Funktionen 'test' aufgerufen:
stackoverflow.com/questions/9899372/pure...ll-a-function-when-t

Code:

<script type="text/javascript">
    (function() {
        // Pure JavaScript equivalent of jQuery's $.ready()
        console.log('console logged: document ready 1')
        test();
    })();

    (function() {
        // Pure JavaScript equivalent of jQuery's $.ready()
        console.log('console logged: document ready 2')
        test();
    })();

    function test() {console.log('console logged: function test1 called');}
    function test() {console.log('console logged: function test2 called');}
</script>

Consolen-Output:
console logged: document ready 1
console logged: function test2 called
console logged: document ready 2
console logged: function test2 called

Und so funktioniert es:

Code:

<script type="text/javascript">
    (function() {
        // Pure JavaScript equivalent of jQuery's $.ready()
        console.log('console logged: document ready 1')
        test1();
    })();

    (function() {
        // Pure JavaScript equivalent of jQuery's $.ready()
        console.log('console logged: document ready 2')
        test2();
    })();

    function test1() {console.log('console logged: function test1 called');}
    function test2() {console.log('console logged: function test2 called');}
</script>

Consolen-Output:
console logged: document ready 1
console logged: function test1 called
console logged: document ready 2
console logged: function test2 called

Gruß, Ingmar

I recommend you the new and up-to-date documentation for Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/en/docs/
Most of this also applies retrospectively to Joomla 3.
Please only ask 1 question per topic :-)

Ich empfehle Dir die neue und aktuelle Dokumentation für Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/docs/
Das meiste gilt rückwirkend auch für Joomla 3.
Bitte immer nur 1 Frage pro Thema stellen :-)

Letzte Änderung: 2 Jahre 7 Monate her von Administrator IV.

DJGBN
Autor
Offline

Mehr

2 Jahre 7 Monate her #8159 von DJGBN

DJGBN antwortete auf function setStatusColors

Hallo Ingmar, vielen Dank!
Das war wirklich super einfach. Aber wenn man vorhher mit JS nicht soviel zutun hatte ist auch sowas einfaches schwer :-)

aber die erklärung war super.

DANKE!
Gruß, Marcel

DJGBN
Autor
Offline

Mehr

2 Jahre 7 Monate her #8160 von DJGBN

DJGBN antwortete auf function setStatusColors

Hallo nochmal, Ich habe zu dem gleichen Thema nochmal eine Frege:

kann man zumbeispiel zahlenabhänig die farben ändern?
1-4 = orange 5-10=rot und 0=grün

Ich hoffe ich habe es möglichst gut erklärt.

MFG Marcel

Administrator IV
Offline

Mehr

2 Jahre 7 Monate her #8161 von Administrator IV

Administrator IV antwortete auf function setStatusColors

Hallo Marcel,
schon.

So:

Code:

var status = jQuery(element).text();
switch (true) {
    case (status < 1):
        jQuery(element).css('color', 'green');
        break;
    case (status < 5):
        jQuery(element).css('color', 'orange');
        break;
    case (status < 11):
        jQuery(element).css('color', 'red');
        break;
    default:
        break;
}

Oder auch so:

Code:

switch (status) {
    case 0:
        jQuery(element).css('color', 'green');
        break;
    case 1:
    case 2:
    case 3:
    case 4:
        jQuery(element).css('color', 'orange');
        break;
    case 5:
    case 6:
    case 7:
    case 8:
    case 9:
    case 10:
        jQuery(element).css('color', 'red');
        break;
    default:
        break;
}

Siehe auch:
stackoverflow.com/questions/5619832/swit...tegers-in-javascript

Gruß, Ingmar

Administrator IV
Offline

Mehr

2 Jahre 7 Monate her - 2 Jahre 7 Monate her #8162 von Administrator IV

Administrator IV antwortete auf function setStatusColors

Hallo Marcel,
ich empfehle dir die beiden oder sogar noch weitere Funktionen zu einer einzigen Funktion zusammen zu fassen.
Hier mit Hilfsfunktion 'setStatusColors_helper()'.
Geht auch ohne Hilfsfunktion - ist aber so ganz gut zu lesen.

Code:

function setStatusColors() {
    const fields = ['.vfdvvalue.data-f86', '.vfdvvalue.data-f86'];
    fields.forEach(field => setStatusColors_helper(field));
}

function setStatusColors_helper(field) {
    var elements = jQuery(field);
    if (elements) {
        jQuery.each(elements, function (index, element) {
        var status = jQuery(element).text();
        switch (status) {
            ....
        }
    }
}

Siehe auch:

stackoverflow.com/questions/9329446/for-...-array-in-javascript
developer.mozilla.org/en-US/docs/Web/Jav...bjects/Array/forEach

Gruß, Ingmar

Letzte Änderung: 2 Jahre 7 Monate her von Administrator IV.

Moderatoren: Administrator AV, Administrator IV

Joomla 5 Mitteilung

Forum

function setStatusColors

Visforms Subscription

Visforms Erweiterungen