Lightbox with form_blocks -> Checkbox and Select do not work

Scheduler Javascript
#1

Hello everyone,

i have a select field and checkbox in the form_blocks. How can I check which select field is selected or if the checkbox is activated when sending?

scheduler.form_blocks[“name”] = {
render:function(sns) {
html="<select id=“title” name=“title”>";
html+="<option value="" selected=“selected”>–";
html+=“Female”;
html+=“Male”;
html+="";
html+="
return html;
},
set_value:function(node, value, ev) {
How can I select an option here?
How can I activate the checkbox here?
},
get_value:function(node, ev) {
How can I query the select field here?
How can I check whether the checkbox is activated?
},

		};

All my attempts do not work. The checkbox always sends True, even if it is not activated.

THANK YOU
Ciao Thomas

#2

scheduler.form_blocks[‘name’] = {
render:function(sns) {
html="";
html+="<option value="" selected=‘selected’>–";
html+="<option value=“Female”>Female</>";
html+="<option value=“Male”>Male</>";
html+="</select>";
html+="<input type=‘checkbox’ name=‘test’ id=‘test’ value=‘true’>";
return html;
},
set_value:function(node, value, ev) {
How can I select an option here?
How can I activate the checkbox here?
},
get_value:function(node, ev) {
How can I query the select field here?
How can I check whether the checkbox is activated?
},

#3

Hello @thomas-9991,

As I don’t see the part of your code that relates to getting/setting values, I can’t suggest what is wrong.
Basically you should get the node element in the lightbox, and get/set its value. In the case of “checkbox” - it’s value will be the “checked” attribute. With the select element- it’s value will be the value attribute of options.

Here is the example of code which shows how to work with them:

// HTML
var html = `<div><select id="title" name="title">
<option value="Male">Male</option>
<option  value="Female">Female</option>
</select>
<input type="checkbox" name="check1" id="check1">
</div> `

// JS

scheduler.form_blocks["name_editor"]={
  render:function(sns){
    return html;
    ;
  },
  set_value:function(node,value,ev){
    // Set the checked of the checkbox to event.checked property, or left empty
    node.querySelector("[name='check1']").checked = ev.checked||"";
    // Set the value of the select to value of the "Female" option 
    node.querySelector("[name='title']").value= "Female";
    },
    get_value:function(node,ev){
      	// Get the "checked" attribute of the ckeckbox
        ev.checked = node.querySelector("[name='check1']").checked;
    	// Get the selected option  "value" 
        ev.owner =  node.querySelector("[name='title']").value;
      	console.log(ev)
       	return node.querySelector("[name='title']").value;
    },
    focus:function(node){
     // Focus on the select
       var select = node.querySelector("[name='title']") 
        select.focus(); 
    }
};

You can check it in the demo(open the console in addition):
http://snippet.dhtmlx.com/5/20cbf9fa9