[gelöst] Textfeld zerschossen

[KNUT345]

Hallo Leute,
ok ich weiß, man soll nicht an Dingen die man nicht versteht herumfummeln...
Ich hab es dennoch getan.

Ging auch ne ganze Weile gut.

Aber seit dem letzten update habe ich mein FHEMWEB etwas zerschossen.

Ich habe mir ein Textfeld mit 10 oder 15 Zeichen gebastelt
und hierzu die fhemweb.js manipuliert.

Code Auswählen Erweitern


FW_createTextField(elName, devName, vArr, currVal, set, params, cmd)
{
  if(vArr.length != 1 ||
     (vArr[0] != "textField" &&
      vArr[0] != "textField_10" &&
      vArr[0] != "textField_15" &&
      vArr[0] != "textFieldNL" &&
      vArr[0] != "textFieldNL_10" &&
      vArr[0] != "textFieldNL_15" &&
      vArr[0] != "textField-long" &&
      vArr[0] != "textFieldNL-long") ||
     (params && params.length))
    return undefined;
 
  var is_long = (vArr[0].indexOf("long") > 0);

  var newEl = $("<div style='display:inline-block'>").get(0);
  if(set && set != "state" && vArr[0].indexOf("_10") > 0)
    $(newEl).append('<input type="text" size="10">');
  else if(set && set != "state" && vArr[0].indexOf("_15") > 0)
    $(newEl).append('<input type="text" size="15">');
  else
    $(newEl).append('<input type="text" size="30">');
  $(newEl).append('<input type="text" size="30">');
  var inp = $(newEl).find("input").get(0);


Wie gesagt, hat funktioniert bis gestern, siehe Bild1 (nur Beispielhaft)
Aber mit dem Letzten update habe ich etwas verbogen, siehe Bild2, rote Markierung bzw. Feld rechts davon.

Auch ein komplettes neues Update brachte leider keine Lösung.

Optimal wäre, wenn ich eine Lösung außerhalb der fhemweb.js z.B. in der style.css fände,
aber da bräuchte ich mehr als nur einen Tipp.

Code Auswählen Erweitern


@import url("defaultCommon.css");

body     { font-size:16px;}
#logo    { margin-top:10px; margin-left:20px; width:120px; height:132px;
           background-image:url(../images/default/fhemicon.png); }
#menu    { margin-top:10px; margin-left:20px; width:140px; }
#hdr     { position:absolute; top:10px; left:180px; }
#content { position:absolute; top:50px; left:180px; bottom:20px; right:10px; }
#menuScrollArea { width: 175px; left:0px; top:0px; height:100%;
                  position:fixed; overflow-x:hidden; overflow-y:auto; }

div.dist { padding-top:0.3em; }
button.dist { margin:10px; background:transparent; border:0px; cursor:pointer; }

.datetimepicker-Zeit98 { width:50px; text-align:center; }
.datetimepicker-LEDKette_WZ_Set1 { width:60px; text-align:center; }
.datetimepicker-LEDKette_WZ_Set2 { width:60px; text-align:center; }
.datetimepicker-LEDKette_WZ_Set3 { width:60px; text-align:center; }
.datetimepicker-LEDKette_WZ_Set4 { width:60px; text-align:center; }


Die Datei muss ich zwar nach jedem Update auch wieder ergänzen,
aber da muss ich nicht in Basis-Modulen rum fummeln.

Danke im Voraus.

[KNUT345]

Keine Ahnung, ob ich den Fehler tatsächlich gefunden habe,
aber mit Weglassen von der letzten Zeile:

Code Auswählen Erweitern


  if(set && set != "state" && vArr[0].indexOf("_10") > 0)
    $(newEl).append('<input type="text" size="10">');
  else if(set && set != "state" && vArr[0].indexOf("_15") > 0)
    $(newEl).append('<input type="text" size="15">');
  else
    $(newEl).append('<input type="text" size="30">');
  $(newEl).append('<input type="text" size="30">');

sieht es wieder wie gewohnt aus.

Hat keiner einen Tipp wie ich dies professioneller lösen kann?