3.AjaxSearchClientScript.js
var tbPanel = null; //用于展示組合條件的表控件
var tableName = null; //記錄查詢的表
var fieldsInfo = null; //保存從服務(wù)端取得的對(duì)應(yīng)表的字段信息
var no = 0; //為防止出現(xiàn)重復(fù)id保存的計(jì)數(shù)器
//添加條件編輯行
function addTerm(tbPanelId)
{
tbPanel = document.getElementById(tbPanelId);
if(tableName == null) tableName = document.getElementById("transValue").value;
// 添加一待填模板行
var row = tbPanel.insertRow();
no++;
row.id = "row"+no;
//*****************************step 1:添加字段選擇部分*****************************
var cell = row.insertCell();
var fieldInputId = "field"+row.id;
var newElement = document.createElement("<SELECT ID='"+fieldInputId+"' onchange='javascript:getOpts("+row.id+");getInput("+row.id+")'></SELECT>");
cell.insertBefore(newElement);
//取出字段信息,首次從服務(wù)端取得
if(fieldsInfo == null)
{
fieldsInfo = WebUI.AjaxSearchSystem.AjaxSearchMethod.GetFields(tableName.toString()).value;
}
//分解字段信息，格式為“字段中文名|字段名”
var fieldsInfoLen;
var i,index;
var fieldValue;
fieldsInfoLen = fieldsInfo.length
for(i=0;i<fieldsInfoLen;i++)
{
fieldValue = fieldsInfo[i];
index = fieldValue.indexOf("|");
newElement.options[newElement.options.length] = new Option(fieldValue.substring(0,index),fieldValue.substring(index+1,fieldValue.length));
}
//*****************************step 2:提取默認(rèn)（首個(gè)）字段對(duì)應(yīng)的運(yùn)算符*************
cell = row.insertCell();
var optInputId = "opt" +row.id;
newElement = document.createElement("<SELECT ID='"+optInputId+"' style='WIDTH: 88px'></SELECT>");
cell.insertBefore(newElement);
getOpts(row);
//*****************************step 3:設(shè)置字段條件值的錄入（選擇）框***************
getInput(row);
//*****************************step 4:生成連接條件選擇框***************************
cell = row.insertCell();
var relateInputId = "relate"+row.id;
newElement = document.createElement("<SELECT ID='"+relateInputId+"'></SELECT>");
cell.insertBefore(newElement);
newElement.options[newElement.options.length] = new Option("并且","And");
newElement.options[newElement.options.length] = new Option("或者","Or");
//*****************************step 5:生成刪除當(dāng)前行按紐***************************
cell = row.insertCell();
var deleteBtnId = "delete"+row.id;
newElement = document.createElement("<INPUT ID='"+deleteBtnId+"' type='Button' class='redButtonCss' value='刪除' onclick='javascript:DelRow("+row.id+")'>");
cell.insertBefore(newElement);
//*****************************step 6:生成增加下一行按紐***************************
cell = row.insertCell();
var addBtnId = "add"+row.id;
newElement = document.createElement("<INPUT ID='"+addBtnId+"' type='Button' class='redButtonCss' value='新增' onclick='javascript:addRow("+row.id+")'>");
cell.insertBefore(newElement);
}
//取得并設(shè)置運(yùn)算符
function getOpts(row)
{
var rowId = row.id;
var fieldSelId = "field"+rowId;
var field = document.getElementById(fieldSelId);
var elemID = "opt"+rowId;
var element = document.getElementById(elemID);
var optInfo = WebUI.AjaxSearchSystem.AjaxSearchMethod.GetOpts(tableName.toString(),field.value).value;
var optValue;
var j,index;
//先移除原有項(xiàng)
while (element.options.length > 0)
{
element.options.remove(element.options.length-1);
}
for(j=0;j<optInfo.length;j++)
{
optValue = optInfo[j];
index = optValue.indexOf("|");
element.options[element.options.length] = new Option(optValue.substring(0,index),optValue.substring(index+1,optValue.length));
}
}
//設(shè)置值錄入控件,取得可能存在的枚舉值
function getInput(row)
{
var rowId = row.id;
var fieldSelId = "field"+rowId;
var field = document.getElementById(fieldSelId);
var inputId = "input"+rowId;
var inputElement = document.getElementById(inputId);
if (inputElement != null)
{
row.deleteCell(2);
}
//獲取可能存在的枚舉值
var enums = WebUI.AjaxSearchSystem.AjaxSearchMethod.GetEnums(tableName.toString(),field.value).value;
var oCell;
if (enums.length <= 1)//不存在枚舉值，使用text
{
var elementSyntax = "<INPUT ID='"+elemID+"' type='text' style='WIDTH: 144px'>";
oCell = row.insertCell(2);
var elemID = "input"+rowId;
switch(enums[0])
{
case "int":
elementSyntax = "<INPUT ID='"+elemID+"' type='text' style='WIDTH: 144px' onKeyPress='javascript:return controlNumberKeyPress(this)' onKeyUp='return controlNumberOnKeyUp(this)' onfocus='this.select()' style='TEXT-ALIGN:right' onpaste='return !clipboardData.getData(\"text\").match(/\D/);'>"
break;
case "decimal":
elementSyntax = "<INPUT ID='"+elemID+"' type='text' style='WIDTH: 144px' onKeyPress='javascript:return controlMoneyKeyPress(this)' onKeyUp='return controlMoneyOnKeyUp(this,10,4)' onfocus='this.select()' style='TEXT-ALIGN:right' onpaste='return !clipboardData.getData(\"text\").match(/\D/);'>"
break;
case "datetime":
elementSyntax = "<INPUT ID='"+elemID+"' type='text' style='WIDTH: 144px' onfocus='setday(this)'onkeypress='return false' onselectstart='return false;' readonly='true' onpaste='return false;' >"
break;
default:
elementSyntax = "<INPUT ID='"+elemID+"' type='text' style='WIDTH: 144px'>"
break;
}
var oNewItem = document.createElement(elementSyntax);
oCell.insertBefore(oNewItem);
}
else //存在枚舉值，使用select
{
oCell = row.insertCell(2);
var elemID = "input"+rowId;
var oNewItem = document.createElement("<SELECT ID='"+elemID+"' style='WIDTH: 144px'></SELECT>");
oCell.insertBefore(oNewItem);
var enumValue;
var j,index;
var element = document.getElementById(elemID);
for(j=1;j<enums.length;j++)
{
enumValue = enums[j];
index = enumValue.indexOf("|");
element.options[element.options.length] = new Option(enumValue.substring(0,index),enumValue.substring(index+1,enumValue.length));
}
}
//用于值的數(shù)據(jù)類型
var fieldType= document.createElement("<INPUT id='type"+rowId+"'type='hidden'>");
oCell.insertBefore(fieldType);
document.getElementById("type"+rowId).value = enums[0];
}
//刪除當(dāng)前行
function DelRow(row)
{
var rowOfIndex = row.rowIndex;
if(tbPanel.rows.length == 1)
{
return
}
else if (rowOfIndex == tbPanel.rows.length-1)
{
//刪除最后一行時(shí)，保持增加按紐在最后一行
var cell = tbPanel.rows[rowOfIndex-1].insertCell();
var addBtnId = "add"+tbPanel.rows[rowOfIndex-1].id;
newElement = document.createElement("<INPUT ID='"+addBtnId+"' type='Button' class='redButtonCss' value='新增' onclick='javascript:addRow("+tbPanel.rows[rowOfIndex-1].id+")'>");
cell.insertBefore(newElement);
}
tbPanel.deleteRow(rowOfIndex);
}
//新增行
function addRow(row)
{
row.deleteCell(5);
addTerm(tbPanel.id);
}
//得到組合條件
function getCombinTerm()
{
var lenOfRows = tbPanel.rows.length;
var i=0;
var combinTerm = "";
var field="",opt="",inputValue="",jointMode="",fieldType="";
for(i=0;i<lenOfRows;i++)
{
field = tbPanel.rows[i].cells[0].childNodes[0].value;
opt = tbPanel.rows[i].cells[1].childNodes[0].value;
inputValue = tbPanel.rows[i].cells[2].childNodes[0].value;
//判斷字段類型
fieldType =tbPanel.rows[i].cells[2].childNodes[1].value;
switch(fieldType)
{
case "char":
if (inputValue == ""|| inputValue == null)
{
if(opt.toLowerCase() == "like" || opt.toLowerCase() == "not like")
{
inputValue = "'%%'";
}
else
{
inputValue = "''";
}
}
else
{
if(opt.toLowerCase() == "like" || opt.toLowerCase() == "not like")
{
inputValue = "'%"+inputValue+"%'"
}
else
{
inputValue = "'"+inputValue+"'"
}
}
break;
case "int":
if (inputValue == ""|| inputValue == null) inputValue = 0;
break;
case "decimal":
if (inputValue == ""|| inputValue == null) inputValue = 0;
break;
case "datetime":
if (inputValue == ""|| inputValue == null)
{
inputValue = "''";
}
else
{
inputValue = "'"+inputValue+"'"
}
break;
default:
break;
}
//拼接條件
combinTerm += " "+tableName+"."+field + " " + opt + " " + inputValue;
if (i<lenOfRows-1)
{
jointMode = tbPanel.rows[i].cells[3].childNodes[0].value;
combinTerm += " " + jointMode
}
}
document.getElementById("transValue").value = combinTerm;
//return combinTerm;
}
//
var oldValue = "";
var MONEY_FLAG = "";
var THOUSAND_FLAG = ",";
function controlNumberKeyPress(textbox)
{
oldValue = textbox.value.replace(MONEY_FLAG,'');
return /\d/.test(String.fromCharCode(event.keyCode))||(textbox.value.indexOf('+')<0?String.fromCharCode(event.keyCode)=="+":false);
}
//
function controlMoneyKeyPress(textbox)
{
var val = textbox.value.replace(MONEY_FLAG,'');
if(isNumber(event.keyCode))
{
return true;
}
if (textbox.value.indexOf('+') < 0)
{
if ( String.fromCharCode(event.keyCode)=="+" && val.length < 1)
return true;
}
if ( textbox.value.indexOf('.') < 0)
{
if (String.fromCharCode(event.keyCode)==".")
return true;
}
return false;
}
//控制金額錄入keyUp事件
function controlNumberOnKeyUp(textbox)
{
//處理"后退"鍵
//alert(event.keyCode);
if (event.keyCode == 8)
{
return true;
}
if (String.fromCharCode(event.keyCode) != '\t' && event.keyCode != 13)
{
if( !/\d/.test(String.fromCharCode(event.keyCode)) &&
event.keyCode != 190/**//* 如果錄入"."則不執(zhí)行 */ )
{
//textbox.value = "";
textbox.value = oldValue;
oldValue = textbox.value;
return false;
}
}
return true;
}
//控制金額錄入keyUp事件
function controlMoneyOnKeyUp(textbox, intBit , dotBit)
{
//處理"后退"鍵
if (event.keyCode == 8)
{
if (textbox.value.indexOf(MONEY_FLAG) < 0)
{
textbox.value = MONEY_FLAG + textbox.value;
}
return true;
}
if (String.fromCharCode(event.keyCode) != '\t' && event.keyCode != 13)
{
if( ! isNumber (event.keyCode) &&
event.keyCode != 190/**//* 如果錄入"."則不執(zhí)行 */ )
{
//textbox.value = "";
textbox.value = MONEY_FLAG + oldValue;
oldValue = textbox.value.replace(MONEY_FLAG,"");
return false;
}
textbox.value = MONEY_FLAG + textbox.value.replace(MONEY_FLAG,'');
var val = textbox.value;
var dotBehind = "";
val = val.replace(MONEY_FLAG,'').replace(/\,/g,'');
var iIndex = val.indexOf('.');
if (iIndex > 0)
{
var valDot = val.substring(val.indexOf('.') + 1,val.length);
if (iIndex > intBit)
{
val = val.substring(0,intBit);
}
if (valDot.length > dotBit)
{
textbox.value = addThousandFlag(val.substring(0,val.indexOf('.'))) + '.' + valDot.substring(0,dotBit);
return;
}
dotBehind = val.substring(val.indexOf('.'),val.length);
val = val.substring(0,val.indexOf('.'));
}
else if (val.length >= intBit)
{
if (val.length > intBit)
{
val = val.substring(0,intBit);
val = addThousandFlag(val);
360docimg_501_ }
360docimg_502_ textbox.value = val + '.';
360docimg_503_ return;
360docimg_504_ }
360docimg_505_
360docimg_506_ //val = noOtherInfoNumber;
360docimg_507_ textbox.value = addThousandFlag(val) + dotBehind;
360docimg_508_ }
360docimg_509_}
360docimg_510_
360docimg_511_
360docimg_512_//添加千分位號(hào)
360docimg_513_function addThousandFlag(val)
360docimg_514_360docimg_515_360docimg_516_{
360docimg_517_ var strTemp = MONEY_FLAG;
360docimg_518_ if (val.length < 4)
360docimg_519_360docimg_520_ 360docimg_521_{
360docimg_522_ return MONEY_FLAG + val;
360docimg_523_ }
360docimg_524_
360docimg_525_ var flag = false;
360docimg_526_ if (val.length % 3 != 0)
360docimg_527_360docimg_528_ 360docimg_529_{
360docimg_530_ strTemp += val.substring(0,(val.length % 3));
360docimg_531_ }
360docimg_532_ else
360docimg_533_ flag = true;
360docimg_534_
360docimg_535_ for(var i = val.length; i > 0; i = i - 1)
360docimg_536_360docimg_537_ 360docimg_538_{
360docimg_539_ if (i % 3 != 0)
360docimg_540_360docimg_541_ 360docimg_542_{
360docimg_543_ continue;
360docimg_544_ }
360docimg_545_
360docimg_546_ if (flag)
360docimg_547_360docimg_548_ 360docimg_549_{
360docimg_550_ strTemp += val.substring(val.length - i,val.length - i + 3);
360docimg_551_ flag = false;
360docimg_552_ }
360docimg_553_ else
360docimg_554_360docimg_555_ 360docimg_556_{
360docimg_557_ strTemp += THOUSAND_FLAG + val.substring(val.length - i,val.length - i + 3);
360docimg_558_ }
360docimg_559_ }
360docimg_560_
360docimg_561_ if (strTemp.indexOf(MONEY_FLAG) > 0)
360docimg_562_360docimg_563_ 360docimg_564_{
360docimg_565_ strTemp = MONEY_FLAG + strTemp.replace(/￥/g,'');
360docimg_566_ }
360docimg_567_
360docimg_568_ return strTemp;
360docimg_569_}
360docimg_570_
360docimg_571_//判斷是否是數(shù)字
360docimg_572_
360docimg_573_function isNumber(param)
360docimg_574_360docimg_575_360docimg_576_{
360docimg_577_ return /\d/.test(String.fromCharCode(param)) || (param >= 96 && param <= 105);//加上小鍵盤處理
360docimg_578_
360docimg_579_} 4.AjaxSeachPage.aspx
360docimg_580_360docimg_581_<%360docimg_582_@ Page language="c#" Codebehind="AjaxSeachPage.aspx.cs" AutoEventWireup="false" Inherits="WebUI.AjaxSearchSystem.AjaxSeachPage" %>
360docimg_583_<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
360docimg_584_<HTML>
360docimg_585_ <HEAD>
360docimg_586_ <title>查詢條件</title>
360docimg_587_ <meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
360docimg_588_ <meta content="C#" name="CODE_LANGUAGE">
360docimg_589_ <meta content="JavaScript" name="vs_defaultClientScript">
360docimg_590_ <meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
360docimg_591_ <base target="_self">
360docimg_592_ <LINK href="BasicStyle.css" type="text/css" rel="stylesheet">
360docimg_593_360docimg_594_ <script language="javascript" src="AjaxSearchClientScript.js">360docimg_595_
360docimg_596_ </script>
360docimg_597_ <script language="javascript" src="Calendar.js"></script>
360docimg_598_ </HEAD>
360docimg_599_ <body onload="javascript:addTerm('tbPanel');" MS_POSITIONING="GridLayout">
360docimg_600_ <form id="Form1" method="post" runat="server">
360docimg_601_ <TABLE id="Table1" style="Z-INDEX: 101; LEFT: 0px; POSITION: absolute; TOP: 0px" cellSpacing="0"
360docimg_602_ cellPadding="0" width="100%" border="0">
360docimg_603_ <TR>
360docimg_604_ <TD style="HEIGHT: 23px" align="center"><asp:button id="btnOK" runat="server" CssClass="redButtonCss" Text="確定"></asp:button><INPUT class="redButtonCss" type="button" value="取消" onclick="javascript:window.close();">
360docimg_605_ </TD>
360docimg_606_ </TR>
360docimg_607_ <TR>
360docimg_608_ <TD align="center">
360docimg_609_ <TABLE id="tbPanel" cellSpacing="0" borderColorDark="aliceblue" cellPadding="0" border="1">
360docimg_610_ </TABLE>
360docimg_611_ </TD>
360docimg_612_ </TR>
360docimg_613_ <TR>
360docimg_614_ <TD align="center"></TD>
360docimg_615_ </TR>
360docimg_616_ </TABLE>
360docimg_617_ <INPUT id="transValue" style="Z-INDEX: 102; LEFT: 8px; POSITION: absolute; TOP: 64px" type="hidden"
360docimg_618_ name="Hidden1" runat="server">
360docimg_619_ </form>
360docimg_620_ </body>
360docimg_621_</HTML>
360docimg_622_
AjaxSeachPage.aspx.cs
360docimg_623_using System;
360docimg_624_using System.Collections;
360docimg_625_using System.ComponentModel;
360docimg_626_using System.Data;
360docimg_627_using System.Drawing;
360docimg_628_using System.Web;
360docimg_629_using System.Web.SessionState;
360docimg_630_using System.Web.UI;
360docimg_631_using System.Web.UI.WebControls;
360docimg_632_using System.Web.UI.HtmlControls;
360docimg_633_using System.Text;
360docimg_634_
360docimg_635_namespace WebUI.AjaxSearchSystem
360docimg_636_{
360docimg_637_ /// <summary>
360docimg_638_ /// AjaxSeachPage 的摘要說明。
360docimg_639_ /// </summary>
360docimg_640_ public class AjaxSeachPage : System.Web.UI.Page
360docimg_641_ {
360docimg_642_ protected System.Web.UI.HtmlControls.HtmlInputHidden transValue;
360docimg_643_ protected System.Web.UI.WebControls.Button btnOK;
360docimg_644_ public const string SEARCH_WHERE_SESSION = "SearchWhere";
360docimg_645_
360docimg_646_ private void Page_Load(object sender, System.EventArgs e)
360docimg_647_ {
360docimg_648_ if (!IsPostBack)
360docimg_649_ {
360docimg_650_ try
360docimg_651_ {
360docimg_652_ //tableName.Value = Request.QueryString["table"].Trim();
360docimg_653_ transValue.Value = "employee";
360docimg_654_ }
360docimg_655_ catch(NullReferenceException ee)
360docimg_656_ {
360docimg_657_ throw new ArgumentOutOfRangeException("table","參數(shù)不正確，請(qǐng)傳入預(yù)先定義的表名");
360docimg_658_ }
360docimg_659_
360docimg_660_
360docimg_661_ AjaxPro.Utility.RegisterTypeForAjax(typeof(AjaxSearchMethod));
360docimg_662_
360docimg_663_ this.btnOK.Attributes.Add("OnClick","getCombinTerm()");
360docimg_664_ }
360docimg_665_ }
360docimg_666_
360docimg_667_ #region Web 窗體設(shè)計(jì)器生成的代碼
360docimg_668_ override protected void OnInit(EventArgs e)
360docimg_669_ {
360docimg_670_ //
360docimg_671_ // CODEGEN: 該調(diào)用是 ASP.NET Web 窗體設(shè)計(jì)器所必需的。
360docimg_672_ //
360docimg_673_ InitializeComponent();
360docimg_674_ base.OnInit(e);
360docimg_675_ }
360docimg_676_
360docimg_677_ /// <summary>
360docimg_678_ /// 設(shè)計(jì)器支持所需的方法 - 不要使用代碼編輯器修改
360docimg_679_ /// 此方法的內(nèi)容。
360docimg_680_ /// </summary>
360docimg_681_ private void InitializeComponent()
360docimg_682_ {
360docimg_683_ this.btnOK.Click += new System.EventHandler(this.btnOK_Click);
360docimg_684_ this.Load += new System.EventHandler(this.Page_Load);
360docimg_685_
360docimg_686_ }
360docimg_687_ #endregion
360docimg_688_
360docimg_689_ private void btnOK_Click(object sender, System.EventArgs e)
360docimg_690_ {
360docimg_691_ Session[SEARCH_WHERE_SESSION] = transValue.Value.Trim();
360docimg_692_
360docimg_693_ Response.Write(ClosePage());
360docimg_694_ }
360docimg_695_
360docimg_696_ private string ClosePage()
360docimg_697_ {
360docimg_698_ StringBuilder js = new StringBuilder();
360docimg_699_360docimg_700_ js.Append("<script language=\"JavaScript\">360docimg_701_");
360docimg_702_ js.Append("window.close();");
360docimg_703_ js.Append("</script>");
360docimg_704_ return js.ToString();
360docimg_705_ }
360docimg_706_ }
360docimg_707_}
360docimg_708_
運(yùn)行效果：
360docimg_709_
下載源碼
AjaxGeneralSearch.rar 請(qǐng)大家提出寶貴意見，在此感謝我的同事
命運(yùn)有自己的夢(mèng)！提供的幫助！感謝日歷控件提供者meizz
