MultiSelect ComboBox in DHTMLX Touch

Discontinued products DHTMLX Touch
#1

HI ,

I need to implement a multiselect drop down in my applicaiton.
As per my knowledge DHTMLX touch doesnot have a multiselect component.

I am not sure how to implement this compoenent. Any inputs or guidlines will be very helpful.

Thanks,
Yogesh

#2

Hi,

Existent popups and dropdown controls like richselect and combo are closed on ItemClick. And your control should provide possibility to select multiple items (more then one click). For this reason you need to create a custom control. Here are docs about creation of custom control:

docs.dhtmlx.com/touch/doku.php?i … rm_control

#3

Hi Alexandra,

Thanks for the link.

I tried the sample code provided on the link , but I am getting the below error:

touchui.js:291 TypeError: ‘undefined’ is not an object (evaluating ‘this.Y().stylle’)

I have attached the sample code I tried in the attached zip.

Please let me know if I need to set some more properties for the custom control.
customcontrol.zip (653 Bytes)
Regards,
Yogesh

#4

Hi,

Sorry, there was incorrect template in the sample. We have corrected it:

docs.dhtmlx.com/touch/doku.php?i … ge_example

#5

Alexandra can you help with the multi-select please:
I keep getting an error: Cannot read property ‘0’ of undefined

dhx.protoUI({
name:“multi-select”,
defaults:{
template: getMulti,
setValue:function(value){
this.getInput().value = value;
},
getValue:function(){
return this.getInput().value;
}
}
}, dhx.ui.text);

			function getMulti(config){ 
				var z=0, select_options_length=config.options.length;
			 	alert(config.options.length)
	 			for (; z<select_options_length; z++){
        			select_options =+ "<option value='"+(config.options.value[z] || "")+"' selected=''>"+(config.options.label[z] || "")+"</option>"
        		}
	            return (config.label + "&nbsp" || "label") + "<select multiple style='width:" + (config.inputWidth || 300) + "px; height:" + (config.height || 100) + "px;'>" + select_options + "</select>"
	        }
#6

Alexandra can you help with the multi-select please:
I keep getting an error: Cannot read property ‘0’ of undefined

dhx.protoUI({
name:“multi-select”,
defaults:{
template: getMulti,
setValue:function(value){
this.getInput().value = value;
},
getValue:function(){
return this.getInput().value;
}
}
}, dhx.ui.text);

			function getMulti(config){ 
				var z=0, select_options_length=config.options.length;
			 	alert(config.options.length)
	 			for (; z<select_options_length; z++){
        			select_options =+ "<option value='"+(config.options.value[z] || "")+"' selected=''>"+(config.options.label[z] || "")+"</option>"
        		}
	            return (config.label + "&nbsp" || "label") + "<select multiple style='width:" + (config.inputWidth || 300) + "px; height:" + (config.height || 100) + "px;'>" + select_options + "</select>"
	        }

view={
view:“richselect”,
id:‘documentCollection’,
name:‘documentCollection’,
label: ‘Collection’,
value: “1”, // selected option
yCount:“3”, // visible rows
inputWiidth:300,
height:100,

							options:[
									{ value:"1", label:"Option 1"   },
									{ value:"2", label:"Option 2"   },
									{ value:"3", label:"Option 3"   }
							]
						},
#7

FIRST sorry for the multiple POSTS :slight_smile:

I figured it out sorta…

elements:[
{
view:“multi-select”,
id:‘documentCollection’,
name:‘documentCollection’,
label:’’,
labelWidth:0,
inputWidth:390,
width:390,
height:100,
options:[
{ value:“1”, label:“Option 1” },
{ value:“2”, label:“Option 2” },
{ value:“3”, label:“Option 3” }
]
}
]

…

dhx.protoUI({
name:“multi-select”,
defaults:{
template: getMulti
}
}, dhx.ui.select);

function getMulti(config){
var z=0, select_options_length=config.options.length,select_options=’’;
for (; z<select_options_length; z++){
select_options = select_options+ “”+(config.options[z].label || “”)+""
}
return “<select ID=’” + (config.name || “”) + “‘name=’” + (config.name || “”) + “’ multiple=‘multiple’ style='border:1px solid #ababab; border-radius:6px; padding:3px; width:” + (config.width || 400) + “px; height:” + (config.height || 100) + “px;’>” + select_options + “”
}