FHEM Forum

FHEM - Entwicklung => FHEM Development => Thema gestartet von: Sidey am 03 Dezember 2018, 21:44:02

Titel: JQuery in einer GET Rückgabe verwenden
Beitrag von: Sidey am 03 Dezember 2018, 21:44:02
Hallo zusammen,

ich blicke aktuell nicht durch die Möglichkeiten durch, die FHEMWEB UI anzupassen.

Konkret habe ich eine HTML Tabelle gebaut, die von einem GET Befehl zurück geliefert wird.
In dieser Tabelle möchte ich Schaltflächen anbieten um weitere Aktionen ausführen zu können.

Aktuell habe ich einfach einen Link eingebaut, der ein Attribut auf einen neuen Wert setzt.
Dabei wird natürlich die komplette Seite neu geladen.

Jetzt habe ich zwei Ideen, weiss aber nicht, an welcher Stelle ich diese Anpassungen vornehmen könnte.

Idee 1: Ich schaffe es, dass der Aufruf des Links über JQuery keinen page reload ausführt. (AJAX)

Idee 2: Ich baue Checkboxen ein. Den OK Button müsste ich dann aber durch einen "Save" und "Cancel" Button ändern.


Ich weiss aber aktuell nicht, wie ich das overlay Fenster mit der Rückgabe des get Fensters anpassen kann.

Grüße Sidey
Titel: Antw:JQuery in einer GET Rückgabe verwenden
Beitrag von: rudolfkoenig am 03 Dezember 2018, 22:22:26
ZitatKonkret habe ich eine HTML Tabelle gebaut, die von einem GET Befehl zurück geliefert wird.
Wie genau soll das ueber das telnet Interface abgebildet werden?
Titel: Antw:JQuery in einer GET Rückgabe verwenden
Beitrag von: Sidey am 03 Dezember 2018, 22:26:08
Zitat von: rudolfkoenig am 03 Dezember 2018, 22:22:26
Wie genau soll das ueber das telnet Interface abgebildet werden?


Diese Funktionalität lässt sich über das telnet interface überhaupt nicht abbilden. Da muss der Anwender halt alles händisch machen und es gibt keine Erleichterung.
Titel: Antw:JQuery in einer GET Rückgabe verwenden
Beitrag von: Sidey am 04 Dezember 2018, 17:03:20
Hi Rudi,

habe ich dich mit meiner Antwort jetzt so geschockt oder geht das was ich mir vorgestellt habe nicht?


Grüße Sidey
Titel: Antw:JQuery in einer GET Rückgabe verwenden
Beitrag von: rudolfkoenig am 04 Dezember 2018, 20:31:00
Zitathabe ich dich mit meiner Antwort jetzt so geschockt oder geht das was ich mir vorgestellt habe nicht?
Ja und weiss nicht. Bin nicht sicher, ob solche "hacks" durch Aenderungen/Optimierungen irgendwannmal nicht kaputtgehen.

Waere FW_detailFn nicht eher was fuer dich?
Siehe at, notify, ZWDongle, etc.
Titel: Antw:JQuery in einer GET Rückgabe verwenden
Beitrag von: Sidey am 04 Dezember 2018, 20:45:14
Vermutlich hast Du recht.

Ich habe mich durch den Quellcode noch ein wenig durchgewühlt und dabei auch festgestellt, dass teilweise die Rückgabe des GET Befehles in <pre> tags gepackt wird.
Damit wird das natürlich nichts.

Also baue ich eine Schaltfäche ein, die ein Fenster ählich wie  FW_okDialog öffnet und darin rufe ich Funktionen auf der Serverseite via FW_cmd auf?
Titel: Antw:JQuery in einer GET Rückgabe verwenden
Beitrag von: Ralf9 am 11 Dezember 2018, 12:09:59
Hallo,

Sidey hat es inzwischen hinbekommen, er hat in die FW_detailFn folgendes eingefügt:

<script>
$( "#showProtocolList" ).click(function(e) {
e.preventDefault();
FW_cmd(FW_root+\'?cmd={SIGNALduino_FW_getProtocolList("'.$FW_detail.'")}&XHR=1\', function(data){SD_plistWindow(data)});

});

function SD_plistWindow(txt)
{
  var div = $("<div id=\"SD_protocolDialog\">");
  $(div).html(txt);
  $("body").append(div);
  var oldPos = $("body").scrollTop();
  $(div).dialog({
    dialogClass:"no-close", modal:true, width:"auto", closeOnEscape:true,
    maxWidth:$(window).width()*0.9, maxHeight:$(window).height()*0.9,
    buttons: [ {text:"OK", click:function(){
        $(this).dialog("close");
        $(div).remove();
        location.reload();
    }}]
  });
}
</script>';


In die dargestellte Protokoll Liste ist in jeder Zeile ein Lampensymbol, wenn man darauf klickt, wird über die "click(function()" direkt das Attribut whitelist_IDs verändert. Dies finde ich nicht so gut.
Ich hätte gerne u.a. ein Button "save to whitelist".


Ich habe durch probieren folgendes hinbekommen:
    buttons: [{text:"whitelist active (blacklist and development ignored) - not saved "},
      {text:"deaktivate all IDs", click:function(){
          FW_cmd(FW_root+ \'?XHR=1&cmd={SIGNALduino_FW_test($name)}\');
      }},
      {text:"save to whitelist", click:function(){}},
      {text:"OK", click:function(){
        $(this).dialog("close");
        $(div).remove();
        location.reload();
    }}]


Bei der Übergabe der Variable passt was nicht
ERROR evaluating {SIGNALduino_FW_test($name)}: Global symbol "$name" requires explicit package name at (eval 69) line 1.


Lässt sich links von den buttons auch ein Text schreiben (siehe Anlage), der sich z.B. beim klicken auf "deaktivate all IDs" ändert?
Ich habe den Text nur mit einem Button hinbekommen.

Gruß Ralf