An error with ComboBox and Calendar in Form

Suite and Optimus Suite 5
#1

Hi I have a bug where a form is not executed properly but only in Chrome and Firefox, in Internet Explorer and above works perfectly.

Could you help me please ? .

This is the code …

[code]







<script src="Librerias/dhtmlxLayout/codebase/dhtmlxcommon.js"></script>
<script src="Librerias/dhtmlxLayout/codebase/dhtmlxcontainer.js"></script>
<script src="Librerias/dhtmlxLayout/codebase/dhtmlxlayout.js"></script>
<script src="Librerias/dhtmlxForm/codebase/dhtmlxform.js"></script>
<script src="Librerias/dhtmlxTabbar/codebase/dhtmlxtabbar.js"></script>
<script src="Librerias/dhtmlxGrid/codebase/dhtmlxgrid.js"></script>
<script src="Librerias/dhtmlxGrid/codebase/dhtmlxgridcell.js"></script>
<script  src="Librerias/dhtmlxGrid/codebase/ext/dhtmlxgrid_filter.js"></script>  

<script src="Librerias/dhtmlxForm/codebase/ext/dhtmlxform_item_combo.js"></script>
<script src="Librerias/dhtmlxCombo/codebase/dhtmlxcombo.js"></script>
<script src="Librerias/dhtmlxForm/codebase/ext/dhtmlxform_item_calendar.js"></script>

<link rel="stylesheet" type="text/css" href="Librerias/dhtmlxCombo/codebase/dhtmlxcombo.css">
<link rel="stylesheet" type="text/css" href="Librerias/dhtmlxCalendar/codebase/dhtmlxcalendar.css"></link>
<link rel="stylesheet" type="text/css" href="Librerias/dhtmlxCalendar/codebase/skins/dhtmlxcalendar_dhx_skyblue.css"></link>
<script src="Librerias/dhtmlxCalendar/codebase/dhtmlxcalendar.js"></script>


<div id="layout" style="position: relative; top: -8px; left: -8px; width: 1228px; height: 582px; aborder: #B5CDE4 1px solid;"></div>


<script>
	
	dhtmlx.skin = "dhx_skyblue";
	window.dhx_globalImgPath = "Librerias/dhtmlxCombo/codebase/imgs/";


	var myForm, formData;
	var dhxLayout;
	
	function doOnLoad() {
		formData = [
		{type: "settings", position: "label-left", labelWidth: 160, inputWidth: 160 }, 
		{type: "label", label: "Selecciona la hora .... "}, 
		{type: "combo", name: "hora_ini" , label: "Hora de inicio", options: [
		{text: "00-00", value: "00-00" , selected: true },
		{text: "01-00", value: "01-00" },
		{text: "02-00", value: "00-00" },
		{text: "03-00", value: "00-00" },
		{text: "04-00", value: "00-00" },
		{text: "05-00", value: "00-00" },
		{text: "06-00", value: "00-00" },
		{text: "07-00", value: "00-00" },
		{text: "08-00", value: "00-00" },
		{text: "09-00", value: "00-00" },
		{text: "10-00", value: "00-00" },
		{text: "11-00", value: "00-00" },
		{text: "12-00", value: "00-00" },
		{text: "13-00", value: "00-00" },
		{text: "14-00", value: "00-00" },
		{text: "15-00", value: "00-00" },
		{text: "16-00", value: "00-00" },
		{text: "17-00", value: "00-00" },
		{text: "18-00", value: "00-00" },
		{text: "19-00", value: "00-00" },
		{text: "20-00", value: "00-00" },
		{text: "21-00", value: "00-00" },
		{text: "22-00", value: "00-00" },
		{text: "23-00", value: "00-00" },
		{text: "24-00", value: "00-00" },]},
		{type: "combo", name: "hora_fin" , label: "Hora de fin", options: [
		{text: "00-00", value: "00-00" },
		{text: "01-00", value: "01-00" },
		{text: "02-00", value: "00-00" },
		{text: "03-00", value: "00-00" },
		{text: "04-00", value: "00-00" },
		{text: "05-00", value: "00-00" },
		{text: "06-00", value: "00-00" },
		{text: "07-00", value: "00-00" },
		{text: "08-00", value: "00-00" },
		{text: "09-00", value: "00-00" },
		{text: "10-00", value: "00-00" },
		{text: "11-00", value: "00-00" },
		{text: "12-00", value: "00-00" },
		{text: "13-00", value: "00-00" },
		{text: "14-00", value: "00-00" },
		{text: "15-00", value: "00-00" },
		{text: "16-00", value: "00-00" },
		{text: "17-00", value: "00-00" },
		{text: "18-00", value: "00-00" },
		{text: "19-00", value: "00-00" },
		{text: "20-00", value: "00-00" },
		{text: "21-00", value: "00-00" },
		{text: "22-00", value: "00-00" },
		{text: "23-00", value: "00-00" },
		{text: "24-00", value: "00-00" , selected: true},]},
		{type: "newcolumn"},
		{type: "label", label: "Selecciona la fecha ...."},
		{type: "calendar", name: "begin_date", label: "Fecha de inicio", dateFormat: "%Y-%m-%d", calendarPosition: "left"},
		{type: "calendar", name: "end_date", label: "Fecha de fin", dateFormat: "%Y-%m-%d", calendarPosition: "left"},
		{type: "newcolumn"},
		{type: "button", value: "Graficar"}];
		
	}// FUNCIONT onload 
	
	
		dhxLayout = new dhtmlXLayoutObject("layout", "3U");
		statusBar = dhxLayout.attachStatusBar();
		//statusBar.setText("Se cargo correctamente la pagina de estadisticas de PRTG.");
		dhxLayout.cells("a").setText("Sensor");
		dhxLayout.cells("b").setText("Fecha/Hora");
		dhxLayout.cells("c").setText("Grafica");
		dhxLayout.cells("c").setHeight(350);
		dhxLayout.cells("a").setWidth(800);
		
		tabbar=dhxLayout.cells("a").attachTabbar();
		
		tabbar.setSkin('dhx_skyblue');
        tabbar.setImagePath("Librerias/dhtmlxTabbar/codebase/imgs/");

        tabbar.addTab("a1","POP Internet","100px");
        tabbar.addTab("a2","Enlaces Alta Capacidad","150px");
        tabbar.addTab("a3","Core","100px");
        tabbar.addTab("a4","Conexiones OLT","110px");
       
        tabbar.setTabActive("a1")

		var grid = tabbar.cells("a1").attachGrid();
		grid.setImagePath("Librerias/dhtmlxGrid/codebase/imgs/");
		grid.attachHeader("#text_search,#select_filter,#text_search,#text_search")			
		grid.loadXML("Data/POPs.xml");
		grid.attachEvent("onRowSelect", doOnRowSelected);
		
		// SE cargan enlaces de alta capacidad
		
		var grid2 = tabbar.cells("a2").attachGrid();
		grid2.setImagePath("Librerias/dhtmlxGrid/codebase/imgs/");
		grid2.attachHeader("#text_search,#select_filter,#text_search,#text_search")
		grid2.loadXML("Data/Enlaces.xml");
		grid2.attachEvent("onRowSelect", doOnRowSelected);
		
		// SE cargan KPI'S BD
		
		var grid3 = tabbar.cells("a3").attachGrid();
		grid3.setImagePath("Librerias/dhtmlxGrid/codebase/imgs/");
		grid3.attachHeader("#text_search,#select_filter,#text_search,#text_search")
		grid3.loadXML("Data/Equipment_KPI_2.xml");
		grid3.attachEvent("onRowSelect", doOnRowSelected);
		
		
		// SE CARGAN SENSORES DE OLT

		var grid4 = tabbar.cells("a4").attachGrid();
		grid4.setImagePath("Librerias/dhtmlxGrid/codebase/imgs/");
		grid4.attachHeader("#text_search,#select_filter,#select_filter,#text_search,#select_filter")
		grid4.loadXML("Data/olt.xml");
		grid4.attachEvent("onRowSelect", doOnRowSelected);


		// Funcion para traer los datos del FORM
		
		


		dhxLayout.cells("c").progressOn(true);
		dhxLayout.cells("b").progressOn(true);

// var name_tab = tabbar.getLabel();
// statusBar.setText("Se selecciono "+ name_tab);

		function doOnRowSelected(id) {

		//var seleccion = dhxGrid.cells(id,0).getValue();
		
		if (tabbar.getActiveTab()=="a1")
		{
		
		var sensor_selected = grid.cells(id,0).getValue();
		statusBar.setText("Se selecciono el sensor con ID " + sensor_selected);
		myForm = dhxLayout.cells("b").attachForm(formData);
		dhxLayout.cells("b").progressOff(true);
		dhxLayout.attachEvent("onContentLoaded", doOnContentLoaded);
		myForm.attachEvent("onButtonClick", function() {
		var hor_ini= myForm.getCombo("hora_ini").getComboText();
		var hor_fin= myForm.getCombo("hora_fin").getComboText();
		var date_ini = myForm.getCalendar("begin_date").getFormatedDate("%Y-%m-%d");
		var date_fin = myForm.getCalendar("end_date").getFormatedDate("%Y-%m-%d");
		dhxLayout.cells("c").attachURL("http://172.19.235.191:8080/chart.png?id="+sensor_selected+"&avg=60&sdate="+date_ini+"-"+hor_ini+"-00&edate="+date_fin+"-"+hor_fin+"-00&width=1210&height=320&graphstyling=baseFontSize='12'%20showLegend='1'&graphid=-1&username=prtgadmin&passhash=2918781178");

});

		function doOnContentLoaded(itemId) {
		dhxLayout.cells("c").progressOff(true);
		statusBar.setText("Se cargo correctamente el contenido del Layout");

}

		}
		
		if (tabbar.getActiveTab()=="a2")
		{
		
		var sensor_selected = grid2.cells(id,0).getValue();
		statusBar.setText("Se selecciono el sensor con ID " + sensor_selected);
		myForm = dhxLayout.cells("b").attachForm(formData);
		dhxLayout.cells("b").progressOff(true);
			myForm.attachEvent("onButtonClick", function() {
		var hor_ini= myForm.getCombo("hora_ini").getComboText();
		var hor_fin= myForm.getCombo("hora_fin").getComboText();
		var date_ini = myForm.getCalendar("begin_date").getFormatedDate("%Y-%m-%d");
		var date_fin = myForm.getCalendar("end_date").getFormatedDate("%Y-%m-%d");
		dhxLayout.cells("c").attachURL("http://172.19.235.191:8080/chart.png?id="+sensor_selected+"&avg=60&sdate="+date_ini+"-"+hor_ini+"-00&edate="+date_fin+"-"+hor_fin+"-00&width=1210&height=320&graphstyling=baseFontSize='12'%20showLegend='1'&graphid=-1&username=prtgadmin&passhash=2918781178");

});

		function doOnContentLoaded(itemId) {
		dhxLayout.cells("c").progressOff(true);
		statusBar.setText("Se cargo correctamente el contenido del Layout");

}
}

		if (tabbar.getActiveTab()=="a3")
		{
		
		var sensor_selected = grid3.cells(id,0).getValue();
		statusBar.setText("Se selecciono el sensor con ID " + sensor_selected);
		myForm = dhxLayout.cells("b").attachForm(formData);
		dhxLayout.cells("b").progressOff(true);	
			myForm.attachEvent("onButtonClick", function() {
		var hor_ini= myForm.getCombo("hora_ini").getComboText();
		var hor_fin= myForm.getCombo("hora_fin").getComboText();
		var date_ini = myForm.getCalendar("begin_date").getFormatedDate("%Y-%m-%d");
		var date_fin = myForm.getCalendar("end_date").getFormatedDate("%Y-%m-%d");
		dhxLayout.cells("c").attachURL("http://172.19.235.191:8080/chart.png?id="+sensor_selected+"&avg=60&sdate="+date_ini+"-"+hor_ini+"-00&edate="+date_fin+"-"+hor_fin+"-00&width=1210&height=320&graphstyling=baseFontSize='12'%20showLegend='1'&graphid=-1&username=prtgadmin&passhash=2918781178");

});

		function doOnContentLoaded(itemId) {
		dhxLayout.cells("c").progressOff(true);
		statusBar.setText("Se cargo correctamente el contenido del Layout");

}
}

		if (tabbar.getActiveTab()=="a4")
		{
		
		var sensor_selected = grid4.cells(id,0).getValue();
		statusBar.setText("Se selecciono el sensor con ID " + sensor_selected);
		myForm = dhxLayout.cells("b").attachForm(formData);
		dhxLayout.cells("b").progressOff(true);
			myForm.attachEvent("onButtonClick", function() {
		var hor_ini= myForm.getCombo("hora_ini").getComboText();
		var hor_fin= myForm.getCombo("hora_fin").getComboText();
		var date_ini = myForm.getCalendar("begin_date").getFormatedDate("%Y-%m-%d");
		var date_fin = myForm.getCalendar("end_date").getFormatedDate("%Y-%m-%d");
		dhxLayout.cells("c").attachURL("http://172.19.235.191:8080/chart.png?id="+sensor_selected+"&avg=60&sdate="+date_ini+"-"+hor_ini+"-00&edate="+date_fin+"-"+hor_fin+"-00&width=1210&height=320&graphstyling=baseFontSize='12'%20showLegend='1'&graphid=-1&username=prtgadmin&passhash=2918781178");

});

		function doOnContentLoaded(itemId) {
		dhxLayout.cells("c").progressOff(true);
		statusBar.setText("Se cargo correctamente el contenido del Layout");

}
}

} // Termina función en Sensores

</script>
</body>[/code]

And these are the print screen on Chrome and Internet Explorer


Thanks in advance …

#2

Hello.

Your form works well for us in all browsers.
try to update your version of dhtmlxForm.

form.png1226×698 30.6 KB