jQWidgets Forums

This topic contains 2 replies, has 2 voices, and was last updated by maorui 12 years, 1 month ago.

Viewing 3 posts - 1 through 3 (of 3 total)

Author

A Window cannot initialize correctly Posts

May 24, 2013 at 4:24 am A Window cannot initialize correctly #21815

maorui

Member

I’m totally no idea now. I checked the HTML structure but could not find anything wrong. But the ‘cloneWindows’ was always showed in the bottom of webpage, and could not function as expected. I also checked in Firebug and found it was not initialized correctly as the other jqxWindow widget. Pls kindly help me, thanks!

HTML source:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title id='Description'>Feature Management</title>
<link rel="stylesheet" href="../../../theme/default/css/style.css" type="text/css" />
</head>
<body>
<link rel="stylesheet" href="../../third_party/jqwidgets/jqwidgets/styles/jqx.base.css" type="text/css" />
<link rel="stylesheet" href="../../third_party/jqwidgets/jqwidgets/styles/jqx.classic.css" type="text/css" />
<link rel="stylesheet" href="../../third_party/jqwidgets/jqwidgets/styles/jqx.summer.css" type="text/css" />
<script type="text/javascript" src="../../third_party/jqwidgets/scripts/gettheme.js"></script>
<script type="text/javascript" src="../../third_party/jqwidgets/scripts/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="../../third_party/jqwidgets/jqwidgets/jqx-all.js"></script>
<script type="text/javascript" src="../../lib/header.js"></script>
<script type="text/javascript" src="../../lib/jscommon.js"></script>
<div id='header'>
  <table border="0" cellspacing="0" cellpadding="1">
    <tr>
      <td rowspan="2" class="page_title">cLab Portal</td>
      <td class="h4">&nbsp;</td>
      <td class="h4">
		<form name="form_prjselect" action="/index.php">
		  <span class="h4a">Active Project:</span>
		  <select name="prj_sel" class="form-element-commonsize" id="prj_sel" onchange="go_project();" style="width:150">
			<option value='16845' >SFW 6.0.2</option>
			<option value='16705' >DDI 2012</option>
			<option value='15908' >UxRT 6.0.3 (6.0MR3)</option>
			<option value='15606' selected>UxRT 6.1 Falcon</option>
			<option value='14346' >UxRT 5.1SP1RP3</option>
			<option value='12126' >UxRT 6.0SP1</option>
			<option value='-1'>--------------------------</option>
		  </select>
		  <input type="hidden" id="project" name="project" value=''/>
		  &nbsp;|&nbsp;
		  <span class="h4a">Current User :</span> Rui Mao(rmao) [Admin] <a href="http://10.198.92.168/logout.php">logout</a>
		</form>
      </td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td>
        <script type="text/javascript">
          $(document).ready(function () {
            $.data(document.body, 'theme', 'summer');
            var theme = getTheme();
            // Create a jqxMenu
            $("#jqxMenu").jqxMenu({ width: '800', height: '30px', theme:theme, animationShowDuration: 200, animationHideDuration: 100, animationShowDelay: 100, disabled: false, enableHover: true, autoOpen: true, showTopLevelArrows: false });
            $("#jqxMenu").css('visibility', 'visible');
          });
        </script>
		<div id='jqxMenu' style='margin-left: 0px;'>
		  <ul>
			<li><a href="#">Dashboard</a>
			  <ul style='width: 250px;'>
			    <li><a href="http://10.198.92.168/index.php" >Home Page</a></li>
				<li type='separator'></li>
			    <li><a href="http://10.198.92.168/gui/usermanagement/user_edit.php?action=edit" >My Account</a></li>
			  </ul>
			</li>
			<li><a href="#">Plan</a>
			  <ul style='width: 250px;'>
			    <li><a href="http://10.198.92.168/gui/testplan/project.php" >Project</a></li>
				<li type='separator'></li>
			    <li><a href="http://10.198.92.168/#" >HCP</a></li>
			    <li><a href="http://10.198.92.168/gui/testplan/qualification_list.php" >Qualification List</a></li>
			    <li><a href="http://10.198.92.168/gui/metrics/feature_map.php" >Feature Mapping</a></li>
				<li type='separator'></li>
			    <li><a href="http://10.198.92.168/gui/testplan/teststart.php?action=new&qualid=0" >TestStart</a></li>
			  </ul>
			</li>
			<li><a href="#">Metrics</a>
			  <ul style='width: 250px;'>
			    <li><a href="http://10.198.92.168/gui/metrics/projects_all.php" >Projects Dashboard</a></li>
				<li type='separator'></li>
			    <li><a href="http://10.198.92.168/gui/metrics/array_matrix.php" >Array Statistics</a></li>
			    <li><a href="http://10.198.92.168/gui/metrics/SF_general.php" >Project Status</a></li>
			    <li><a href="http://10.198.92.168/gui/metrics/SF_extended.php" >Extended Testing Summary</a></li>
			    <li><a href="http://10.198.92.168/gui/metrics/feature_stat.php" >Advanced Feature Summary</a></li>
				<li type='separator'></li>
			    <li><a href="http://10.198.92.168/gui/metrics/par_list.php" >PAR</a></li>
			    <li><a href="http://10.198.92.168/gui/metrics/partner_list.php" >Partner</a></li>
				<li type='separator'></li>
			    <li><a href="http://10.198.92.168/cgi-bin/ex_matrix" target='_blank'>Previous Metrics</a></li>
			  </ul>
			</li>
			<li><a href="#">Admin</a>
			  <ul style='width: 250px;'>
			    <li><a href="http://10.198.92.168/gui/testplan/update_array.php" >Array List Management</a></li>
			    <li><a href="http://10.198.92.168/gui/testplan/platform_list.php" >Platform Management</a></li>
			    <li><a href="http://10.198.92.168/gui/metrics/feature_list.php" >Feature Management</a></li>
				<li type='separator'></li>
			    <li><a href="http://10.198.92.168/gui/usermanagement/user_list.php" >User Management</a></li>
				<li type='separator'></li>
			    <li><a href="#" >Admin Log</a></li>
			  </ul>
			</li>
		  </ul>
        </div>
      </td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
    <tr> </tr>
  </table>
</div>
 
<script type="text/javascript" src="../metrics/feature_map.js"></script> 
<div id='content'>
  <div id='list'>
    <form id="form_list" name="form_list" method="get">
      <input name="newid" type="button" class="h4a" id="newid" onclick="edit(0);" value="New" style="margin-right: 10px" />
      <input name="updatename" type="button" class="h4a" id="updatename" onclick="updatenames();" value="Update TC names" />
      <input name="clone" type="button" class="h4a" id="clone" onclick="showclone();" value="Clone to Another Project" />
      <br>
      <table border="1" cellspacing="0">
        <tr class="table_caption">
          <td width="5%">Action</td>
          <td>Feature</td>
          <td>Pattern</td>
          <td>TC List</td>
          </tr>
        <tr class="h4">
          <td width="5%" style="text-align:center">
            <img src="../../../theme/default/images/b_edit.png" width="16" height="16" alt="edit" onclick="edit(10);" />
            <img src="../../../theme/default/images/spacer.png" width="5" height="1" />
            <img src="../../../theme/default/images/b_drop.png" width="16" height="16" alt="delete" onclick="del(10);" /></td>
          <td>Controller Reboot</td>
          <td>2477629,2319804,2392879,2392890</td>
          <td>2477629</td>
        </tr>
        <tr class="h4">
          <td width="5%" style="text-align:center">
            <img src="../../../theme/default/images/b_edit.png" width="16" height="16" alt="edit" onclick="edit(16);" />
            <img src="../../../theme/default/images/spacer.png" width="5" height="1" />
            <img src="../../../theme/default/images/b_drop.png" width="16" height="16" alt="delete" onclick="del(16);" /></td>
          <td>BCV/SRDF</td>
          <td>/ndu/i</td>
          <td>2477627</td>
        </tr>
        <tr class="h4">
          <td width="5%" style="text-align:center">
            <img src="../../../theme/default/images/b_edit.png" width="16" height="16" alt="edit" onclick="edit(12);" />
            <img src="../../../theme/default/images/spacer.png" width="5" height="1" />
            <img src="../../../theme/default/images/b_drop.png" width="16" height="16" alt="delete" onclick="del(12);" /></td>
          <td>BCV/SRDF</td>
          <td>/reset/i</td>
          <td>2392916</td>
        </tr>
        <tr class="h4">
          <td width="5%" style="text-align:center">
            <img src="../../../theme/default/images/b_edit.png" width="16" height="16" alt="edit" onclick="edit(17);" />
            <img src="../../../theme/default/images/spacer.png" width="5" height="1" />
            <img src="../../../theme/default/images/b_drop.png" width="16" height="16" alt="delete" onclick="del(17);" /></td>
          <td>TrueCopy</td>
          <td>2477629,2319804,2392879</td>
          <td>2477629</td>
        </tr>
      </table>
      <br>
      <input type="hidden" name="action" id="action" />
      <input type="hidden" name="s_id" id="s_id" />
      <input type="hidden" name="s_pid" id="s_pid" value="15606" />
      <input type="hidden" name="s_fid" id="s_fid" />
      <input type="hidden" name="s_pattern" id="s_pattern" />
      <input type="hidden" name="s_tclist" id="s_tclist" />
      <input type="hidden" name="s_optional" id="s_optional" />
    </form>
    </p>
  </div>
</div>
<div class="default" style="visibility: none;" id="jqxWidgets">
  <div style="width: 100%; height: 10px; border: 0px solid #ccc; margin-top: 10px;" id="mainContainer">
    <div id="eventWindows">
      <div class="h4a" id="header_mapping">Feature &amp; Toro TC Name Pattern Mapping</div>
      <div id="content_mapping">
        <table border="0" cellspacing="0" style="margin-top: 15px;">
          <tr>
            <td width="1%"><span class="h4a">Feature</span></td>
            <td><img src="../../../theme/default/images/spacer.png" width="18" height="1" /></td>
            <td class="h4">
              <select name="fid" id="fid">
                <option value=6>BCV/SRDF</option>
                <option value=4>Controller Reboot</option>
                <option value=5>DMP-DR</option>
                <option value=3>NDU</option>
                <option value=7>TrueCopy</option>
            </select>
            </td>
          </tr>
          <tr>
            <td><span class="h4a">Search<br>Pattern</span></td>
            <td>
              <img src="../../../theme/default/images/ajax_clock_small.gif" alt="Loading..." width="16" height="16" style="display: none" name="loading" id="loading"/>
            </td>
            <td>
              <input name="pattern" type="text" class="h4" id="pattern" onblur="gettclistbypattern(15606,this.value);" value="" size="32" />
              <br />
              <span class="h4a">(ID list separated by comma, or Regular Expression)</span></td>
          </tr>
          <tr>
            <td class="h4a">TC List</td>
            <td>&nbsp;</td>
            <td>
              <div id="tclist" style="width: 500px; height: 100px; border-width: 1px; border-style: solid;"></div>
            </td>
          </tr>
        </table>
        <div style="margin-top: 15px; float: left;" name="div_new" id="div_new">
          <input type="button" id="select_all" value="Select All" style="margin-right: 10px" />
          <input type="button" id="select_clear" value="Clear Selected" style="margin-right: 20px" />
          <input name="ok_pattern" type="submit" id="ok_pattern" style="margin-right: 10px" value="Add Pattern" />
          <input name="ok_id" type="submit" id="ok_id" style="margin-right: 10px" value="Add Selected ID(s)" />
        </div>
        <div style="margin-top: 15px; float: left; visibility: none;" name="div_update" id="div_update">
          <input name="ok_update" type="submit" id="ok_update" style="margin-right: 10px" value="Update" />
        </div>
        <div style="margin-top: 15px;"><input type="button" id="cancel" value="Cancel" /></div>
      </div>
    </div>
    <div id="CloneWindows">
      <div class="h4a" id="header_clone">Clone Mapping to Other Project</div>
      <div id="content_clone">
        <form id="form_clone" name="form_clone" method="get">
          <table border="0" cellspacing="0" style="margin-top: 15px;">
            <tr>
              <td width="5%"><span class="h4a">Project</span></td>
              <td><img src="../../../theme/default/images/spacer.png" width="18" height="1" /></td>
              <td class="h4">
                <select name="tpid" id="tpid">
                  <option value=16845>SFW 6.0.2</option>
                  <option value=16705>DDI 2012</option>
                  <option value=15908>UxRT 6.0.3 (6.0MR3)</option>
                  <option value=14346>UxRT 5.1SP1RP3</option>
                  <option value=12126>UxRT 6.0SP1</option>
                </select>
              </td>
            </tr>
            <tr>
              <td><span class="h4a">Overwrite</span></td>
              <td>&nbsp;</td>
              <td><input type="checkbox" name="overwrite" id="overwrite" /></td>
            </tr>
          </table>
          <div style="margin-top: 15px;">
            <input name="ok_clone" type="submit" id="ok_clone" style="margin-right: 10px" value="Clone" />
            <input type="button" name="cancel_clone" id="cancel_clone" value="Cancel" />
          </div>
        </form>
      </div>
    </div>
  </div>
</div>
<div id='footer'>
	<table width="90%" border="0" cellpadding="1" cellspacing="0">
	  <tr class="h5">
	    <td class="nav_bar">PROPRIETARY/CONFIDENTIAL - Internal Use Only.</td>
	  </tr>
	</table>
</div>
</body>
</html>

JS file:

////////////////////////////////////////////////////
// Main
$(document).ready(function() {
	var theme = getTheme();
	addEventListeners();
	createElements(theme);
	$("#jqxWidgets").css('visibility', 'visible');
	//$("#jqxWidget_clone").css('visibility', 'visible');
});
function addEventListeners(theme) {
	//	$('#eventWindows').on('close', function(event) {
	//		Event_edit(event);
	//	});
	$("#ok_pattern").on('click', function(event) {
		Event_submit(event, "pattern");
	});
	$("#ok_id").on('click', function(event) {
		Event_submit(event, "id");
	});
	$("#ok_update").on('click', function(event) {
		Event_submit(event, "update");
	});
	$("#select_all").on('click', function(event) {
		Event_selectall(event)
	});
	$("#select_clear").on('click', function(event) {
		Event_selectclear(event)
	});
	$("#ok_clone").on('click', function(event) {
		Event_clone(event);
	});
}
function createElements(theme) {
	$('#eventWindows').jqxWindow({
		autoOpen: false,
		maxHeight: 600,
		maxWidth: 800,
		minHeight: 30,
		minWidth: 250,
		height: 500,
		width: 800,
		theme: theme,
		resizable: true,
		isModal: true,
		modalOpacity: 1,
		showAnimationDuration: 200,
		closeAnimationDuration: 200,
		cancelButton: $('#cancel'),
		initContent: function() {
			$('#tclist').jqxGrid({
				theme: theme,
				pageable: false,
				width: 700,
				height: 300,
				autoheight: false,
				sortable: true,
				altrows: true,
				enabletooltips: true,
				editable: false,
				selectionmode: 'multiplerows',
				columnsresize: true,
				pagesize: 10,
				columns: [{
					text: 'ID',
					datafield: 'ID'
				}, {
					text: 'Name',
					datafield: 'Name'
				}, {
					text: 'Class',
					datafield: 'Class'
				}]
			});
			$('#select_all').jqxButton({
				theme: theme,
				width: '100px'
			});
			$('#select_clear').jqxButton({
				theme: theme,
				width: '100px'
			});
			$('#ok_pattern').jqxButton({
				theme: theme,
				width: '150px'
			});
			$('#ok_id').jqxButton({
				theme: theme,
				width: '150px'
			});
			$('#cancel').jqxButton({
				theme: theme,
				width: '80px'
			});
			$('#ok_update').jqxButton({
				theme: theme,
				width: '80px'
			});
			//$('#ok').focus();
		}
	});
	$('#cloneWindows').jqxWindow({
		autoOpen: false,
		maxHeight: 600,
		maxWidth: 800,
		minHeight: 30,
		minWidth: 250,
		height: 500,
		width: 800,
		theme: theme,
		resizable: true,
		isModal: false,
		modalOpacity: 1,
		showAnimationDuration: 200,
		closeAnimationDuration: 200,
		//okButton: $('#ok_clone'),
		cancelButton: $('#cancel_clone'),
		initContent: function() {
			$('#ok_clone').jqxButton({
				theme: theme,
				width: '80px'
			});
			$('#cancel_clone').jqxButton({
				theme: theme,
				width: '80px'
			});
			//$('#ok_clone').focus();
		}
	});
	return;
}
////////////////////////////////////////////////////
// mapping edit
function edit(id) {
	var theme = getTheme();
	//createElements(theme);
	//addEventListeners(theme);
	getfmap(id);
	$("#s_id").val(id);
	if (id == 0) {
		$("#fid").val(0)
		$("#pattern").val('');
		$('#tclist').jqxGrid('clear');
		document.getElementById("div_new").style.display = 'block';
		document.getElementById("div_update").style.display = 'none';
	} else {
		document.getElementById("div_new").style.display = 'none';
		document.getElementById("div_update").style.display = 'block';
	}
	$('#eventWindows').jqxWindow('open');
}
function del(id) {
	msg = "Are you sure to delete the feature mapping?";
	if (confirm(msg) == 1) {
		document.form_list.target = '_self';
		document.form_list.method = 'get';
		$("#action").val('delete');
		$("#s_id").val(id);
		document.form_list.submit();
		return true;
	}
	return false;
}
function updatenames() {
	if (confirm("This procss may take a long time to complete. Continue?") == 1) {
		document.form_list.target = '_self';
		document.form_list.method = 'get';
		$("#action").val('updatenames');
		document.form_list.submit();
		return true;
	}
	return false;
}
function Event_submit(event, type) {
	document.form_list.target = '_self';
	document.form_list.method = 'get';
	document.form_list.action.value = 'save';
	$("#s_pid").val($("#pid").val());
	$("#s_fid").val($("#fid").val());
	$("#s_optional").val($("#optional").val());
	if (type == 'pattern' || type == 'update') {
		$('#tclist').jqxGrid('selectallrows');
	}
	var rows = $("#tclist").jqxGrid('getselectedrowindexes');
	var tclist = "";
	var pattern = "";
	for (var i = 0; i < rows.length; i++) {
		var data = $("#tclist").jqxGrid('getrowdata', rows[i]);
		tclist += "<tc>";
		tclist += "<toroid>" + data.ID + "</toroid>";
		tclist += "<name>" + data.Name + "</name>";
		tclist += "<class>" + data.Class + "</class>";
		tclist += "</tc>";
		pattern += data.uid + ",";
	}
	tclist = "<tclist>" + tclist + "</tclist>";
	pattern = pattern.replace(/,$/, "");
	$("#s_pattern").val(pattern);
	$("#s_tclist").val(tclist);
	if (type == 'pattern' || type == 'update') {
		$("#s_pattern").val($("#pattern").val());
	}
	document.form_list.submit();
}
function gettclistbypattern(pid, pattern) {
	if (pattern == '' || pattern == 0) {
		return;
	}
	document.getElementById("loading").style.display = 'block';
	$("#eventWindows").jqxWindow({
		disabled: true
	});
	$.ajax({
		url: '../../lib/ajax/ajax_get_toro.php.inc',
		data: "action=gettclist&pid=" + pid + "&pattern=" + pattern,
		type: 'GET',
		dataType: 'xml',
		timeout: 100000000,
		error: function(xml, textStatus, errorThrown) {
			alert('Error loading XML document!' + errorThrown);
			document.getElementById("loading").style.display = 'none';
			$("#eventWindows").jqxWindow({
				disabled: false
			});
		},
		success: function(xml) {
			var url = $(xml).find("filename").text();
			filltclist(url);
			document.getElementById("loading").style.display = 'none';
			$("#eventWindows").jqxWindow({
				disabled: false
			});
		}
	});
}
function getfmap(id) {
	if (id == 0) {
		return null;
	}
	$.ajax({
		url: '../../lib/ajax/ajax_get_toro.php.inc',
		data: "action=getfmap&pid=" + $("#s_pid").val() + "&id=" + id,
		type: 'GET',
		dataType: 'xml',
		timeout: 100000000,
		error: function(xml, textStatus, errorThrown) {
			alert('Error loading XML document!' + errorThrown);
			return false;
		},
		success: function(xml) {
			var url = $(xml).find("filename").text();
			$.ajax({
				url: url,
				type: 'GET',
				dataType: 'xml',
				timeout: 100000000,
				error: function(xml, textStatus, errorThrown) {
					alert('Error loading XML document!' + errorThrown);
					return false;
				},
				success: function(xml2) {
					var data = $(xml2).find("FeaturemapList").find("Featuremap");
					$("#fid").val(data.find("fid").text());
					$("#pattern").val(data.find("pattern").text());
					$.ajax({
						url: '../../lib/ajax/ajax_get_toro.php.inc',
						data: "action=gettclistfromdb&id=" + data.find("id").text(),
						type: 'GET',
						dataType: 'xml',
						timeout: 100000000,
						error: function(xml, textStatus, errorThrown) {
							alert('Error loading XML document!' + errorThrown);
							return false;
						},
						success: function(xml3) {
							var url = $(xml3).find("filename").text();
							filltclist(url);
						}
					});
				}
			});
		}
	});
}
function Event_selectall(event) {
	$('#tclist').jqxGrid('selectallrows');
}
function Event_selectclear(event) {
	$("#tclist").jqxGrid('clearselection');
}
function filltclist(url) {
	var source = {
		url: url,
		datatype: "xml",
		datafields: [{
			name: 'ID',
			map: 'toroid'
		}, {
			name: 'Name',
			map: 'name'
		}, {
			name: 'Class',
			map: 'class'
		}],
		root: "tclist",
		record: "tc",
		id: 'id'
	};
	var dataAdapter = new $.jqx.dataAdapter(source, {
		downloadComplete: function(data, status, xhr) {},
		loadComplete: function(data) {},
		loadError: function(xhr, status, error) {}
	});
	//source, { autoBind: true });
	dataAdapter.dataBind();
	$('#tclist').jqxGrid({
		source: dataAdapter
	});
	//$('#tclist').jqxGrid('autoresizecolumns');
}
////////////////////////////////////////////////////
// clone Windows
function showclone() {
	//var theme = getTheme();
	//createElements_clone(theme);
	//addEventListeners_clone(theme);
	$('#cloneWindows').jqxWindow('open');
}
function Event_clone(event) {
	document.form_clone.target = '_self';
	document.form_clone.method = 'get';
	document.form_clone.action.value = 'save';
	$("#s_pid").val($("#pid").val());
	$("#s_tpid").val($("#tpid").val());
	$("#s_overwrite").val($("#overwrite").val());
	//document.form_clone.submit();
}

May 27, 2013 at 7:27 am A Window cannot initialize correctly #21894

Dimitar

Participant

Hello maorui,

The id of the div from which initialize the window (CloneWindows) is different from your jQuery selection ($(‘#cloneWindows’)). That is the reason for your issue.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

May 28, 2013 at 1:47 am A Window cannot initialize correctly #21934

maorui

Member

OMG! I didn’t notice it is a capital C in HTML. A stupid mistake… Thank you so much!

BTW, for commands like $(‘#cloneWindows’).jqxWindow(), it should generate error messages somewhere. But where can I find it? I didn’t see such message in Firebug and the error cosole.

Author

Posts

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.