[GH-ISSUE #134] Add boolean parameters. #102

Closed
opened 2026-02-28 01:23:25 +03:00 by kerem · 11 comments
Owner

Originally created by @fngstudios on GitHub (Mar 23, 2016).
Original GitHub issue: https://github.com/tzapu/WiFiManager/issues/134

Hi, thank you for your great library, I am using it in every esp8266 project.
It would be nice to add different types of parameters, mainly boolean parameters so the user could choose wich parameters they want to use. In my case I have a standard node which can send a variety of parameters but each node actually send only one or two of those parameters. With boolean parameters in the configuration portal the user may specify which parameter the node will send and in the main code the program read only those parameters from the sensors. I have made some changes to enable this in my local repo, but it is an ugly hack and I was waiting for you to add the custom CSS option to do this in a more elegant and efficient way. If you want I could do a pull request with my changes.
Thank you again.

Originally created by @fngstudios on GitHub (Mar 23, 2016). Original GitHub issue: https://github.com/tzapu/WiFiManager/issues/134 Hi, thank you for your great library, I am using it in every esp8266 project. It would be nice to add different types of parameters, mainly boolean parameters so the user could choose wich parameters they want to use. In my case I have a standard node which can send a variety of parameters but each node actually send only one or two of those parameters. With boolean parameters in the configuration portal the user may specify which parameter the node will send and in the main code the program read only those parameters from the sensors. I have made some changes to enable this in my local repo, but it is an ugly hack and I was waiting for you to add the custom CSS option to do this in a more elegant and efficient way. If you want I could do a pull request with my changes. Thank you again.
kerem closed this issue 2026-02-28 01:23:25 +03:00
Author
Owner

@tzapu commented on GitHub (Mar 23, 2016):

hi, custom css is there in the latest github
there is also the ability to add custom html to the configuration form, but it won t save those parameters as it doesn t know they exist yet...
i m not entirely sure how i would go about saving custom params, as they could be anything (you only want 2 options, but the next user might want 3 or 4)
ideas are welcome :)

<!-- gh-comment-id:200189635 --> @tzapu commented on GitHub (Mar 23, 2016): hi, custom css is there in the latest github there is also the ability to add custom html to the configuration form, but it won t save those parameters as it doesn t know they exist yet... i m not entirely sure how i would go about saving custom params, as they could be anything (you only want 2 options, but the next user might want 3 or 4) ideas are welcome :)
Author
Owner

@fngstudios commented on GitHub (Mar 24, 2016):

Hi, I really don't know if my idea would be useful to anyone besides me, thats why I asked.
Imagine you have a "standard" board which can send a number of parameters, temperature, digital inputs, i2c sensor data, etc. But the user only connect one or two sensors, in the code you have all those possible parameters declared as booleans so in the configuration portal they select which parameters they want to use and then in the code you can read and send to the server only those sensors.
The boolean parameters appear as checkboxes in the configuration portal with a label.

Sorry for my bad english.

<!-- gh-comment-id:200948104 --> @fngstudios commented on GitHub (Mar 24, 2016): Hi, I really don't know if my idea would be useful to anyone besides me, thats why I asked. Imagine you have a "standard" board which can send a number of parameters, temperature, digital inputs, i2c sensor data, etc. But the user only connect one or two sensors, in the code you have all those possible parameters declared as booleans so in the configuration portal they select which parameters they want to use and then in the code you can read and send to the server only those sensors. The boolean parameters appear as checkboxes in the configuration portal with a label. Sorry for my bad english.
Author
Owner

@dronov commented on GitHub (Aug 7, 2017):

Hello @fngstudios
Could you make the PR to show how you solved your task?
I think that boolean parameters at the configuration portal will be useful for others. Yeas, we have an ability to add custom html and css, but it would be ok to have also the default way to make basic html objects/labels/radiobuttons/etc (like in Twitter Bootstrap).

I think, boolean parameters with radiobuttons could be look like these:
idea

And it seems to be ok to add a type of form label for custom parameters like:

// id/name, placeholder/prompt, type, default, length
WiFiManagerParameter custom_mqtt_server("server", "mqtt server", "label", mqtt_server, 40);
wifiManager.addParameter(&custom_mqtt_server);
WiFiManagerParameter custom_dht22_param("dht22", "dht22 on", "radio_button", dht22, 20);
wifiManager.addParameter(&custom_dht22_param);
WiFiManagerParameter custom_ds18b20_param("ds18b20", "ds18b20 on", "radio_button", ds18b20, 20);
wifiManager.addParameter(&custom_ds18b20_param)

Maybe it needs to make a new handler for these inputs to store data depends on element type (e.g. store boolean in json for radiobutton elements).

@tzapu what do you think?
2others: Any ideas? :)

<!-- gh-comment-id:320632513 --> @dronov commented on GitHub (Aug 7, 2017): Hello @fngstudios Could you make the PR to show how you solved your task? I think that boolean parameters at the configuration portal will be useful for others. Yeas, we have an ability to add custom html and css, but it would be ok to have also the default way to make basic html objects/labels/radiobuttons/etc (like in Twitter Bootstrap). I think, boolean parameters with radiobuttons could be look like these: ![idea](http://i.imgur.com/WTsI4Bx.jpg) And it seems to be ok to add a type of form label for custom parameters like: ``` // id/name, placeholder/prompt, type, default, length WiFiManagerParameter custom_mqtt_server("server", "mqtt server", "label", mqtt_server, 40); wifiManager.addParameter(&custom_mqtt_server); WiFiManagerParameter custom_dht22_param("dht22", "dht22 on", "radio_button", dht22, 20); wifiManager.addParameter(&custom_dht22_param); WiFiManagerParameter custom_ds18b20_param("ds18b20", "ds18b20 on", "radio_button", ds18b20, 20); wifiManager.addParameter(&custom_ds18b20_param) ``` Maybe it needs to make a new handler for these inputs to store data depends on element type (e.g. store boolean in json for radiobutton elements). @tzapu what do you think? 2others: Any ideas? :)
Author
Owner

@sooth-sayer commented on GitHub (Aug 7, 2017):

👍

<!-- gh-comment-id:320632951 --> @sooth-sayer commented on GitHub (Aug 7, 2017): 👍
Author
Owner

@clooosha commented on GitHub (Aug 7, 2017):

👍

<!-- gh-comment-id:320632988 --> @clooosha commented on GitHub (Aug 7, 2017): 👍
Author
Owner

@alevmaltsev commented on GitHub (Aug 7, 2017):

👍

<!-- gh-comment-id:320637332 --> @alevmaltsev commented on GitHub (Aug 7, 2017): 👍
Author
Owner

@fundix commented on GitHub (Aug 7, 2017):

👍🏿

Odesláno z iPhone

    1. 2017 v 13:17, Alexander Maltsev notifications@github.com:

👍


You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub, or mute the thread.

<!-- gh-comment-id:320639445 --> @fundix commented on GitHub (Aug 7, 2017): 👍🏿 Odesláno z iPhone 7. 8. 2017 v 13:17, Alexander Maltsev <notifications@github.com>: > 👍 > > — > You are receiving this because you are subscribed to this thread. > Reply to this email directly, view it on GitHub, or mute the thread. >
Author
Owner

@teplovoyneytron commented on GitHub (Aug 7, 2017):

👍

<!-- gh-comment-id:320648012 --> @teplovoyneytron commented on GitHub (Aug 7, 2017): :+1:
Author
Owner

@fngstudios commented on GitHub (Aug 8, 2017):

Hi, im using asyncwifimanager now since asynctcp is much faster. I did it really quickly and ugly, I´ll search for the code and post it here. I also found necesary to add an external function call for functions you need to be called periodically while the configuration portal is running. I want to use it becouse I have some nodes with buttons that need to be able to respond even when the wifi is not configured. Im working on make this elegant and readable.

<!-- gh-comment-id:321033257 --> @fngstudios commented on GitHub (Aug 8, 2017): Hi, im using asyncwifimanager now since asynctcp is much faster. I did it really quickly and ugly, I´ll search for the code and post it here. I also found necesary to add an external function call for functions you need to be called periodically while the configuration portal is running. I want to use it becouse I have some nodes with buttons that need to be able to respond even when the wifi is not configured. Im working on make this elegant and readable.
Author
Owner

@fngstudios commented on GitHub (Aug 11, 2017):

This is what I did for the bool parameters:
Added the getType method to WiFiManagerParameter and modifyed the constructor:
WiFiManagerParameter::WiFiManagerParameter(const char *id, const char *placeholder, const char *defaultValue, int length,bool isBoolean) {
.
.
_isBoolean = isBoolean;
.
}
bool WiFiManagerParameter::getType(){
return _isBoolean;
}

Then when you render the parameters:
// add the extra parameters to the form
for (int i = 0; i < _paramsCount; i++) {
if (_params[i] == NULL) {
break;
}
if (!_params[i]->getType()){
String pitem = FPSTR(HTTP_FORM_PARAM);
pitem.replace("{i}", _params[i]->getID());
pitem.replace("{n}", _params[i]->getID());
pitem.replace("{p}", _params[i]->getPlaceholder());
snprintf(parLength, 2, "%d", _params[i]->getValueLength());
pitem.replace("{l}", parLength);
pitem.replace("{v}", _params[i]->getValue());
page += pitem;
}else{
String pitem = FPSTR(HTTP_FORM_BOOL_PARAM);
pitem.replace("{i}", _params[i]->getID());
pitem.replace("{n}", _params[i]->getID());
pitem.replace("{p}", _params[i]->getPlaceholder());
snprintf(parLength, 2, "%d", _params[i]->getValueLength());
pitem.replace("{l}", parLength);
if (_params[i]->getValue()){
pitem.replace("{c}", "checked");
}else{
pitem.replace("{c}", "");
}
page += pitem;
}
}

And in the .h:
const char HTTP_FORM_BOOL_PARAM[] PROGMEM = "
{p}<input type='checkbox' id='{i}' name='{n}' length='{l}' value='1' {c}>";

<!-- gh-comment-id:321829477 --> @fngstudios commented on GitHub (Aug 11, 2017): This is what I did for the bool parameters: Added the getType method to WiFiManagerParameter and modifyed the constructor: WiFiManagerParameter::WiFiManagerParameter(const char *id, const char *placeholder, const char *defaultValue, int length,bool isBoolean) { . . _isBoolean = isBoolean; . } bool WiFiManagerParameter::getType(){ return _isBoolean; } Then when you render the parameters: // add the extra parameters to the form for (int i = 0; i < _paramsCount; i++) { if (_params[i] == NULL) { break; } if (!_params[i]->getType()){ String pitem = FPSTR(HTTP_FORM_PARAM); pitem.replace("{i}", _params[i]->getID()); pitem.replace("{n}", _params[i]->getID()); pitem.replace("{p}", _params[i]->getPlaceholder()); snprintf(parLength, 2, "%d", _params[i]->getValueLength()); pitem.replace("{l}", parLength); pitem.replace("{v}", _params[i]->getValue()); page += pitem; }else{ String pitem = FPSTR(HTTP_FORM_BOOL_PARAM); pitem.replace("{i}", _params[i]->getID()); pitem.replace("{n}", _params[i]->getID()); pitem.replace("{p}", _params[i]->getPlaceholder()); snprintf(parLength, 2, "%d", _params[i]->getValueLength()); pitem.replace("{l}", parLength); if (_params[i]->getValue()){ pitem.replace("{c}", "checked"); }else{ pitem.replace("{c}", ""); } page += pitem; } } And in the .h: const char HTTP_FORM_BOOL_PARAM[] PROGMEM = "<br/><label>{p}</label><input type='checkbox' id='{i}' name='{n}' length='{l}' value='1' {c}>";
Author
Owner

@tablatronix commented on GitHub (Sep 8, 2017):

How much larger is async ?

<!-- gh-comment-id:328210636 --> @tablatronix commented on GitHub (Sep 8, 2017): How much larger is async ?
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
starred/WiFiManager#102
No description provided.