Getting the value of a checkbox

580 views
Skip to first unread message

Andrew Apell

unread,
Dec 29, 2021, 10:37:01 AM12/29/21
to Google Apps Script Community
I have this tag for a checkbox in HTML servi ce:
<input id=myId type=checkbox name=myName value=unchecked>

How do I pass its "checked" status to the server side?

Alan Wells

unread,
Dec 29, 2021, 11:18:35 AM12/29/21
to Google Apps Script Community
Are you a jQuery user? Will you have other HTML inputs tags to collect user input from? The reason I ask is that there are different paths to the end result, and most people have preferences as to the way it's done. You can put input tags into a "form" tag and get the entire form as as object, or you can get individual input types and combine the data. One problem with using a form tag is that the action attribute can cause your web app to disappear unless you prevent the default action.

The way I do it is by getting all input elements by tag name and looping through them to retrieve the value. I give every element an "id" name so that your server code knows what value goes with what. 
If the html input element type is either checkbox or radio then the value must be retrieved by accessing the "checked" attribute rather than the "value" attribute.

This code lacks some detail but hopefully gives you the process of getting the input values. You should stringify the object before sending it to the server. There are other ways of doing it. This is my preference which may not be other people's idea of the best way to do it.

var o = {};//object for return
var b = ;//Get the element that is holding the input elements.
var thisArr = b.getElementsByTagName('input');//Assign all Inputs thisArr

for () {//Loop through the array of all the input elements

var thisEl = thisArr[i];//Get one element
var elementType = thisEl.type;//Get the type of the element
var elID = thisEl.id;//Get the element id
var inputValue = ['checkbox','radio'].indexOf( elementType) !== -1 ? thisEl.checked : thisEl.value;//If this input type is checkbox
      //or radio the use checked property else use value property
      //console.log(' inputValue  : ' +  inputValue  );

//Put the input value into an object
o[elID] = inputValue;
}

return o;

Andrew Apell

unread,
Dec 29, 2021, 11:41:27 AM12/29/21
to Google Apps Script Community
I generally keep away from jQuery.

This tag is part of a form and I seem to be successfully getting all the values from all the other tags except the checkbox's input tag.
I'm getting it by passing the form object to a server side function and then accessing the desired values by using the individual tag names.



Alan Wells

unread,
Dec 29, 2021, 12:13:23 PM12/29/21
to Google Apps Script Community
The "value" attribute of the checkbox is not for whether the box is checked or not. The attribute for whether the box is checked or not is the "checked" attribute and it can have no assignment operator. In other words, you can just enter the word checked.
For example:
<input type="checkbox" name="vehicle3" value="Boat" checked>
The above html code will check the box by default and ALWAYS have a value of "Boat"
Your use of:
value=unchecked
is an incorrect usage.


Andrew Apell

unread,
Dec 29, 2021, 12:44:17 PM12/29/21
to Google Apps Script Community
You are correct.
To verify if the checkbox is checked, I don't use the "Value" attribute... I guess my naming choices were poor in this instance.

However, I still wonder why this input isn't appearing in the form object.
I just verified that if the input type is "checkbox" or "radio", it is not passed to the server side.

Alan Wells

unread,
Dec 29, 2021, 1:22:08 PM12/29/21
to Google Apps Script Community
You should be able to log the form object before it's passed to the server and determine what's in that object. Do you stringify the form object before passing it? Can you post the contents of the stringified object so we can see what data is in it?
When the Google client side API processes objects before sending them to the server, some data can be lost. If the problem is that the client side API is removing a checkbox value, then you'd need to do something different on the client side before passing it to the server.

Andrew Apell

unread,
Dec 29, 2021, 3:04:33 PM12/29/21
to Google Apps Script Community
Yes, I logged the form object  (just before your last post) and that's how I determined that type "checkbox" and type "radio" are not being passed to the server side. I decided to use another type as a result of that.

I still have a feeling that there is a way of using checkboxes but it might require some serious Apps Script acrobatics at this point :)

Reply all
Reply to author
Forward
0 new messages