📄 highquery0.3.htm

📁 javascript实现一个高级组合查询控件
💻 HTM
📖 第 1 页 / 共 3 页
字号:
上一页 1 23
			{
				objBContent.setAttribute("readOnly", "true");
				objBChoicePanel.innerHTML = isDate?getDateInHtml("bContent_" + id):getDateTimeInHtml("bContent_" + id);
			}
			else
			{
				objBContent.setAttribute("readOnly", "");
				objBChoicePanel.innerHTML = ""; // 清除date或datetime查询时留下的第一个内容文本"选择"面板内容(不论是否存在)
			}
			break;
		case "not_in": // 查询条件为not in时
			objBContent.maxLength = '2147483647'; // 设为最大值
			if(isDate || isDateTime) // 如果对应的字段类型是date或datetime时,给用户选择日期
			{
				objBContent.setAttribute("readOnly", "true");
				objBChoicePanel.innerHTML = isDate?getDateInHtml("bContent_" + id):getDateTimeInHtml("bContent_" + id);
			}
			else
			{
				objBContent.setAttribute("readOnly", "");
				objBChoicePanel.innerHTML = ""; // 清除date或datetime查询时留下的第一个内容文本"选择"面板内容(不论是否存在)
			}
			break;
		case "between": // 查询条件为between时
			var objEContent = document.getElementById("eContent_" + id); // between查询时才会出现的第二个条件内容对象
			var objEChoicePanel = document.getElementById("eChoicePanel_" + id); // between查询时才会出现的第二个内容文本"选择"面板对象
			objEContent.value = ""; // 如果查询条件使用了BETWEEN时，这个元素就存在
			objEContent.maxLength = objBContent.maxLength;
			if(isDate || isDateTime) // 如果对应的字段类型是date或datetime时,给用户选择日期
			{
				objBContent.setAttribute("readOnly", "true");
				objEContent.setAttribute("readOnly", "true");
				objBChoicePanel.innerHTML = isDate?getDateHtml("bContent_" + id):getDateTimeHtml("bContent_" + id);
				objEChoicePanel.innerHTML = isDate?getDateHtml("eContent_" + id):getDateTimeHtml("eContent_" + id);
			}
			else
			{
				objBContent.setAttribute("readOnly", "");
				objEContent.setAttribute("readOnly", "");
				objBChoicePanel.innerHTML = ""; // 清除date或datetime查询时留下的第一个内容文本"选择"面板内容(不论是否存在)
				objEChoicePanel.innerHTML = ""; // 清除date或datetime查询时留下的第二个内容文本"选择"面板内容(不论是否存在)
			}
			break;
		case "is": // 查询条件为is时
			objBContent.setAttribute("readOnly", "true");
			objSignPanel.innerHTML = getIsHtml(id);
			objBChoicePanel.innerHTML = ""; // 清除date或datetime查询时留下的第一个内容文本"选择"面板内容(不论是否存在)
			break;
		default: // 查询条件为其他时
			if(isDate || isDateTime) // 如果对应的字段类型是date或datetime时,给用户选择日期
			{
				objBContent.setAttribute("readOnly", "true");
				objBChoicePanel.innerHTML = isDate?getDateHtml("bContent_" + id):getDateTimeHtml("bContent_" + id);
			}
			else
			{
				objBContent.setAttribute("readOnly", "");
				objBChoicePanel.innerHTML = ""; // 清除date或datetime查询时留下的第一个内容文本"选择"面板内容(不论是否存在)
			}
			break;
	}
}

// 改变条件运算符时，相应改变界面。
function changeCondition()
{
	var objCondition = window.event.srcElement; // 取得条件运算符选择控件对象
	var id = objCondition.id.split("_")[1];
	var trRow = document.getElementById("row_" + id); // 取得行对象。
	var objField = document.getElementById("field_" + id); // 取得字段选择控件对象
	var objSignPanel = document.getElementById("signPanel_" + id); // 取得查询符号面板对象
	var objBChoicePanel = document.getElementById("bChoicePanel_" + id); // 取得第一个内容文本"选择"面板对象
	var objEContentPanel = document.getElementById("eContentPanel_" + id); // 取得第二个内容文本面板对象
	var objBContent = document.getElementById("bContent_" + id); // 取得第一个条件内容文件控件对象
	var isDate = arrType[objField.selectedIndex] == "date"?true:false;
	var isDateTime = arrType[objField.selectedIndex] == "datetime"?true:false;
	objBContent.maxLength = arrLength[objField.selectedIndex]; // 根据字段长度改变文本控件的长度
	
	// 如果文本内容长度大于最大长度(通常出现在in查询时)就清除内容或者条件运算符为"is"
	if(objBContent.value.length > objBContent.maxLength || objCondition.value == "is")
	{
		objBContent.value = "";
	}

	if(isDate || isDateTime || objCondition.value == "is")
		objBContent.setAttribute("readOnly", "true");
	else 
		objBContent.setAttribute("readOnly", "");

	switch(objCondition.value)
	{
		case "like": // 查询条件为like时
			objSignPanel.innerHTML = getLikeHtml(id);
			objEContentPanel.innerHTML = ""; // 清除between查询的第二个文本面板内容(不论是否存在)
			break;
		case "in": // 查询条件为in时
			objBContent.maxLength = '2147483647'; // 设为最大值
			if(isDate || isDateTime) // 如果对应的字段类型是date或datetime时,给用户选择日期
				objBChoicePanel.innerHTML = isDate?getDateInHtml("bContent_" + id):getDateTimeInHtml("bContent_" + id);
			else
				objBChoicePanel.innerHTML = "";
			objSignPanel.innerHTML= ""; // 清除查询符号面板内容(不论是否存在)
			objEContentPanel.innerHTML = ""; // 清除between查询的第二个文本面板内容(不论是否存在)
			break;
		case "not_in": // 查询条件为not in时
			objBContent.maxLength = '2147483647'; // 设为最大值
			if(isDate || isDateTime) // 如果对应的字段类型是date或datetime时,给用户选择日期
				objBChoicePanel.innerHTML = isDate?getDateInHtml("bContent_" + id):getDateTimeInHtml("bContent_" + id);
			else
				objBChoicePanel.innerHTML = "";
			objSignPanel.innerHTML= ""; // 清除查询符号面板内容(不论是否存在)
			objEContentPanel.innerHTML = ""; // 清除between查询的第二个文本面板内容(不论是否存在)
			break;
		case "between": // 查询条件为between时
			var maxLen = objBContent.maxLength;
			if(isDate || isDateTime) // 如果对应的字段类型是date或datetime时,给用户选择日期
			{
				objBChoicePanel.innerHTML = isDate?getDateHtml("bContent_" + id):getDateTimeHtml("bContent_" + id);
				objEContentPanel.innerHTML = "--<input class='HQ_TEXT' id='eContent_" + id + "' readOnly maxLength='" + maxLen + 
					"'><span id='eChoicePanel_" + id + "'>" + (isDate?getDateHtml("eContent_" + id):getDateTimeHtml("eContent_" + id)) + "</span>";
			}
			else
			{
				objBChoicePanel.innerHTML = "";
				objEContentPanel.innerHTML = "--<input class='HQ_TEXT' id='eContent_" + id + "' maxLength='" + maxLen + "'>" + 
					"<span id='eChoicePanel_" + id + "'></span>";
			}
			objSignPanel.innerHTML= ""; // 清除查询符号面板内容(不论是否存在)
			break;
		case "is": // 查询条件为is时
			objSignPanel.innerHTML = getIsHtml(id);
			objBChoicePanel.innerHTML = ""; // 清除date或datetime查询时留下的第一个内容文本"选择"面板内容(不论是否存在)
			break;
		default: // 查询条件为其他时
			if(isDate || isDateTime) // 如果对应的字段类型是date或datetime时,给用户选择日期
				objBChoicePanel.innerHTML = isDate?getDateHtml("bContent_" + id):getDateTimeHtml("bContent_" + id);
			objSignPanel.innerHTML= ""; // 清除查询符号面板内容(不论是否存在)
			objEContentPanel.innerHTML = ""; // 清除between查询的第二个文本面板内容(不论是否存在)
			break;
	}
}

/******************************以下为应用函数******************************/

// 添加模糊查询符号。
function addDarkSign(strFlag)
{
	var id = window.event.srcElement.id.split("_")[1];
	var objBContent = document.getElementById("bContent_" + id); // 取得当前的第一个条件内容文件控件对象
	var objDarkSign = document.getElementById("darkSign_" + id); // 取得当前的标记选择控件对象('%','_')

	if(objBContent.value != "")
	{
		if(objDarkSign.value == "0")
		{
			if(strFlag == 'b')
			{
				objBContent.value = objBContent.value.trimPS();	// 清除内容两边的"%"
				objBContent.value = "%" + objBContent.value + "%"; // 两边模糊。
			}
			else if(strFlag == 'l')
			{
				objBContent.value = objBContent.value.trimPS(); // 清除内容两边的"%"
				objBContent.value = "%" + objBContent.value; // 左边模糊。
			}
			else if(strFlag == 'r')
			{
				objBContent.value = objBContent.value.trimPS(); // 清除内容两边的"%"
				objBContent.value = objBContent.value + "%"; // 右边模糊。
			}
		}
		else if(objDarkSign.value == "1")
		{
			if(strFlag == 'b')
			{
				objBContent.value = "_" + objBContent.value + "_"; // 两边模糊。
			}
			else if(strFlag == 'l')
			{
				objBContent.value = "_" + objBContent.value; // 左边模糊。
			}
			else if(strFlag == 'r')
			{
				objBContent.value = objBContent.value + "_"; // 右边模糊。
			}
		}

	}
}

// 清除内容。
function clearContent(objTemp)
{
	objTemp.value = "";
}

//添加"(" 或 ")"
function addParenthesis(id, strFlag)
{
	if(strFlag == "l")
	{
		var objLParenthesisPanel = document.getElementById("lParenthesisPanel_" + id); // 取得左括号面板对象
		objLParenthesisPanel.innerText = objLParenthesisPanel.outerText + "(";
	}
	else if(strFlag == 'r')
	{
		var objRParenthesisPanel = document.getElementById("rParenthesisPanel_" + id); // 取得左括号面板对象
		objRParenthesisPanel.innerText = objRParenthesisPanel.outerText + ")";
	}
}

//删除"(" 或 ")"
function removeParenthesis(id, strFlag)
{
	if(strFlag == "l")
	{
		var objLParenthesisPanel = document.getElementById("lParenthesisPanel_" + id); // 取得左括号面板对象
		if(objLParenthesisPanel.outerText.length > 0)
			objLParenthesisPanel.innerText = objLParenthesisPanel.outerText.substring(0, objLParenthesisPanel.outerText.length - 1);
	}
	else if(strFlag == 'r')
	{
		var objRParenthesisPanel = document.getElementById("rParenthesisPanel_" + id); // 取得左括号面板对象
		objRParenthesisPanel.innerText = objRParenthesisPanel.outerText.substring(0, objRParenthesisPanel.outerText.length - 1);
	}
}

// 选择查询日期。
function selDate(objTemp)
{
	objTemp.value = showDateForm();
}

// 选择查询日期(in或not in查询专用)。
function selDateIn(objTemp)
{
	if(objTemp.value == "")
		objTemp.value = showDateForm();
	else
	{
		var strTemp = showDateForm();
		objTemp.value += (strTemp==""?strTemp:"," + strTemp);
	}
}

// 选择查询日期时间。
function selDateTime(objTemp)
{
	objTemp.value = showDateTimeForm();
}

// 选择查询日期时间(in或not in查询专用)。
function selDateTimeIn(objTemp)
{
	if(objTemp.value == "")
		objTemp.value = showDateTimeForm();
	else
	{
		var strTemp = showDateTimeForm();
		objTemp.value += (strTemp==""?strTemp:"," + strTemp);
	}
}

// 测试用
function show()
{
	txtAlias.value = "";
	txtField.value = ""
	var arrReturn = interpreter();
	txtAlias.value = arrReturn[0];
	txtField.value = arrReturn[1];
}

//-->
</script>
<br>
<input type="button" class="HQ_BUTTON" onClick="show();" value="查看条件文本">
<br>
别名形式：<br>
<textarea class="HQ_TEXTAREA" id="txtAlias" rows="6" cols="100"></textarea>
<br>
字段名形式：<br>
<textarea class="HQ_TEXTAREA" id="txtField" rows="6" cols="100"></textarea>
</body>
</html>
上一页 1 23
💿 文件大小 12 K
👤 上传用户 yhw002
📂 所属分类 JavaScript
🏷️ 相关标签

#javascript #组合 #查询 #控件
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -