changing CSS "on the fly" for a textbox?

Zim

unread,

Feb 11, 2021, 7:08:19 PM2/11/21

to Annex WiFi RDS

Hi Gents
I am having grief trying to change a "textbox background color" when the parameter exceeds a given value.( >30 humidity)
Please see the example on what I need below....Please see the code under "update:"
This doesn't work. Any suggestions please?
Thanks

Zim

CODE: xxxx.bas
onHtmlReload create_page 
onhtmlchange update
D1 = 5    ' temp/hum sensor DTH22
DHT.SETUP 5, 22 
tmp = DHT.TEMP
hm = DHT.HUM
wtr$ = "NO"
txtbtmp$ = "background-color:white;text-align:center;display:block;width:54px;height:42px;font-size:30;font-weight:bold"
txtbwtr$ = "background-color:white;text-align:center;display:block;width:60px;height:42px;font-size:30;font-weight:bold"
txtbhm$ = "background-color:red;text-align:center;display:block;width:54px;height:42px;font-size:30;font-weight:bold"
gosub create_page
timer0 2000, update
wait

create_page:
cls
A$ = ""
A$ = A$ + |<!DOCTYPE html><html><body><style>|
A$ = A$ + |body {background-color: black;}|
A$ = A$ + |p {font-size:24px;}|
A$ = A$ + |</style>|
A$ = A$ + |<table align='center' width='300' height='100' bgcolor='lightgreen' border='1' cellpadding='8'>|
A$ = A$ + |<th>|
A$ = A$ + |<p>Basement<br>Temp.</p></th></center>|
A$ = A$ + |<th><center>|
A$ = A$ + textbox$(tmp, "txt1")
A$ = A$ + |</th></center>|
A$ = A$ + cssid$("txt1", txtbtmp$)
A$ = A$ + |</table>|
A$ = A$ + |<table align='center' width='300' height='100' bgcolor='lightgreen' border='1' cellpadding='8'>"|
A$ = A$ + |<center><th>|
A$ = A$ + |<p>Basement<br>Humidity</p>|
A$ = A$ + |</th></center>|
A$ = A$ + |<th><center>|
A$ = A$ + textbox$(hm, "txt2") 
A$ = A$ + |</th></center>|
A$ = A$ + cssid$("txt2", txtbhm$)
A$ = A$ + |</table>|
A$ = A$ + |<table align='center' width='300' height='100' bgcolor='lightgreen' border='1' cellpadding='8'>"|
A$ = A$ + |<center><th>|
A$ = A$ + |<p>Water<br>Detection</p>|
A$ = A$ + |</th></center>|
A$ = A$ + |<th><center>|
A$ = A$ + textbox$(wtr$, "txt3")
A$ = A$ + |</th></center>|
A$ = A$ + cssid$("txt3", txtbwtr$)
A$ = A$ + |</table>|
HTML A$
A$ = ""
autorefresh 1000
return


update:
tmp = DHT.TEMP
hm = DHT.HUM
pause 200

if hm > 30 then txtbhm$ = "background-color:red;text-align:center;display:block;width:54px;height:42px;font-size:30;font-weight:bold" else txtbhm$ = "background-color:white;text-align:center;display:block;width:54px;height:42px;font-size:30;font-weight:bold"


refresh
return

Bugs

unread,

Feb 12, 2021, 5:25:08 AM2/12/21

to Annex WiFi RDS

I thought my program worked ok doing this - but when I extracted the relevant parts to try, I found similar to you. Have not worked out how my (very large) program (ESP32) is managing this.

With the extracted part I find that changing the value in a textbox does not trigger the onhtmlchange so createpage does not get called. I added a wlog "HTML done" at the end of the createpage routine and it only logs the initial call.

Colour me puzzled...

Bugs

unread,

Feb 12, 2021, 8:27:32 AM2/12/21

to Annex WiFi RDS

This does not do what I expected when the textbox contents change:-

CODE: xxxx.bas

'html test

a$=""
  gosub dohtml
  onhtmlchange dohtmlchange
  ONHTMLRELOAD  dohtml
  timer0 2000, doscan
wait

doscan:
a$=a$ & "*"
refresh
return

dohtmlchange:
  wlog HtmlEventVar$
  wlog "done change"
  print "done change"
return

dohtml:
cls
html textbox$( a$)
wlog "done html"
print"done html"
return

Electroguard

unread,

Feb 12, 2021, 9:01:05 AM2/12/21

to Annex WiFi RDS

Best not to cause confusion by asking questions or adding content to the old forum which is now superseded by the new forum.

So if you ask the same question on the new forum I will offer the solution to your problem over there.

Bugs

unread,

Feb 12, 2021, 9:43:45 AM2/12/21

to Annex WiFi RDS

But I don't get any email notifications from the new forum so can't keep track of the posts.

Electroguard

unread,

Feb 12, 2021, 11:05:18 AM2/12/21

to Annex WiFi RDS

I've just posted how to get email notifications in the new forum News

Reply all

Reply to author

Forward