ajax| Dynamic | condition
In one of my Java projects, you need to add filtering on top of the list of data to generate different filtering scripts based on the filter criteria that the user chooses:
Here is the first line of the table script ***************************//
<TD align= "center" width= "15%" height= ">" Select query Criteria:</td>
<TD align= "left" width= "30%" ><select name= "FilterName" id= "FilterName"
style= "width:100%" >
<option value= "" ></option>
<option value= ' buginfo_title ' <%=buginfolist.getselected ("Buginfo_title")%>>bug title </option>
<option value= ' Buginfo_buguser ' <%=buginfolist.getselected ("Buginfo_buguser")%>> Install user </option>
<option value= ' Buginfo_bugsystem ' <%=buginfolist.getselected ("Buginfo_bugsystem")%>> installation system </option >
<option value= ' buginfo_bugtime ' <%=buginfolist.getselected ("Buginfo_bugtime")%>> submission time </option>
<option value= ' buginfo_donetime ' <%=buginfolist.getselected ("Buginfo_donetime")%>> completion time </option >
</select></TD>
<TD align= "left" width= "37%" id= "Filter" ><%=buginfolist.getfilterhtml ()%></td>
<TD align= "center" width= "18%" ><a class= "TextUrl9" href= "Javascript:dofilter" (); >
Start filtration </A>
<a class= "TextUrl9" href= "Javascript:doall ();" >Src= "Http://www.pushad.com/images/image/cx.gif" align= "absmiddle" border= "0" > All </A>
</TD>
</TR>
Here is the JavaScript script ******************************************************//
/* Get client XMLHttpRequest Request Object * *
function Getrequest () {
var request = false;
try {
Request = new XMLHttpRequest ();
} catch (Trymicrosoft) {
try {
Request = new ActiveXObject ("Msxml2.xmlhttp");
} catch (Othermicrosoft) {
try {
Request = new ActiveXObject ("Microsoft.XMLHTTP");
} catch (Failed) {
Request = false;
}
}
}
if (!request) alert ("Error initialization XMLHttpRequest Object!");
return request;
}
var request=getrequest ();
Change the filter condition
function Changefilter () {
if (request==null) request=getrequest ();
var name = FrmBugInfo.FilterName.value;
var url = ".. /ajaxfilter?name= "+name;
Request.onreadystatechange = Updatefilter;
Request.open ("Get", url, True);
Request.send (NULL);
}
Change the filter condition
function Updatefilter () {
if (request.readystate = = 4) {
if (Request.status = = 200) {
var Text=request.responsetext;
document.getElementById ("Filter"). Innerhtml=text;
} else{
Alert ("State is:" + request.status);
}
Delete request[' onreadystatechange '];
request=null;//must be emptied.
}
}
The following is the Ajaxfilter source code, it is a servlet*********************************************//
Static final string[] time={"smalldatetime", "datetime", "timestamp"};
Static final string[] NUM ={"tinyint", "smallint", "int", "bigint", "decimal", "Numeric",
"Float", "real", "smallmoney", "money", "Binary",};
Static final String SQL = "SELECT * from Datadict where tablename= '%s ' and fieldname= '%s '";
Static final String default= "<input type= ' text ' name= ' filtervalue ' id= ' ' filtervalue ', ' value= ' @value ' style= ' width:100 % ' ></input> ';
Static final String DATE = "<input id=\" @name \ "type=\" text\ "name=\" @name \ "value= ' @value ' \ n"
+ "class=\" textbox\ "readonly=\" readonly\ "style=\" width:100px;\ "/> \ n"
+ "+ "alt=\" Select Date \ "Src=\". /images/image/date.gif\ "width= ' align= ' middle ' >";
The source code in Doget and Dopost
Response.setcontenttype (Content_Type);
PrintWriter Out=response.getwriter ();
String name=request.getparameter ("name");
Out.print (Pagelist.getfilter (name));
/**
* Get Filter type
* @param name filter Select names (including table names and field names)
* @param isadd whether to add Classid,bindfield and other information
* @return
*/
public static string Getfiltertype (String Name,boolean isadd) {
if (name!=null) {
int Index=name.indexof ("_");
if (index>=0) {
String[] Str=new string[2];
Str[0]=name.substring (0,index);
Str[1]=name.substring (index+1);
ResultSet rs=dbaccess.getinstance (). Opencommand (Common.format (SQL,STR));
try{
if (Rs.next ()) {//Time
if (Common.in (time,rs.getstring ("FieldType"))) {
return "1";
}else if (!isdbnull (rs.getstring ("ClassID")) {//fixed code
if (Isadd)
Return "2_" +rs.getstring ("ClassID");
Else
Return "2";
}else if (!isdbnull (rs.getstring ("bindtable")) {//FOREIGN Key Association
if (Isadd)
Return "3_" +rs.getstring ("bindtable")
+ "_" +rs.getstring ("Bindfield")
+ "_" +rs.getstring ("Bindshowfield");
Else
Return "3";
}else if (common.in (num,rs.getstring ("FieldType")) {//numeric
Return "4";
}
}
}catch (Exception e) {}
}
}
return "0";//Normal string
}
/**
* Get filter string
* @param name Filter type names
* The first filter value @param value
* @param value1 Second filter value (mainly for time)
* @return
*/
public static string GetFilter (String name,string value,string value1) {
String Type=getfiltertype (name,true);
int Flag=0,pos=type.indexof ("_");
String[] Other=type.split ("_");
if (pos>=0) {
Flag=integer.parseint (type.substring (0,pos));
}else{
Flag=integer.parseint (type);
}
Return GetFilter (flag,other,value,value1);
}
/**
* Get filter string
* @param type Filter types
* @param Other fixed code number, etc.
* The first filter value @param value
* @param value1 Second filter value (mainly for time)
* @return
*/
public static String getfilter (int type,string[] other,string value,string value1) {
if (value==null) value= "";
if (value1==null) value1= "";
Switch (type) {
Case 0:return Default.replaceall ("@value", value);//String
Case 1:return ("From:" +date.replaceall ("@name", "FromDate"). ReplaceAll ("@value", value)
+ "To:" +date.replaceall ("@name", "ToDate"). ReplaceAll ("@value", value1));/Time
Case 2:if (other.length==2)
Return Html.getinstance (). GetList ("Exec p_getbasecode '")
+other[1]+ "'", True,true, "FilterValue", "100%", value)/fixed code
Case 3:if (other.length==4)
Return Html.getinstance (). GetList ("SELECT distinct" +other[2]+ "," +other[3)
+ "from" +other[1],true,true, "FilterValue", "100%", value);//FOREIGN Key Association
Case 4:return Default.replaceall ("@value", value);//numeric value
}
Return "";
}
/**
* Get filter string
* @param name filter names
* @return
*/
public static string GetFilter (string name) {
Return GetFilter (Name, "", "");
}
/**
* Check to see if empty
* @param obj object to check
* @return
*/
public static Boolean isNull (Object obj) {
if (Obj==null | | obj.tostring (). Equals (""))
return true;
Else
return false;
}
/**
* Determine if NULL, including blank fields
* @param obj to judge the object
* @return
*/
public static Boolean isdbnull (Object obj) {
if (isNull (obj) | | obj.tostring (). Trim (). toLowerCase (). Equals ("null"))
return true;
Else
return false;
}
//*****************************************************************************************//
Principle: According to the choice of different filter conditions, get the table name and field name in the condition, using AJAX to get its type in the data dictionary based on the table name and field name:
(1) If the date type: return date range selection
(2) If the code is fixed: return a drop-down list and initialize the fixed code
(3) If the Foreign Key association: then read out all the foreign keys corresponding to the name
(4) Otherwise return a text input box
This choice of different filter conditions (or filter fields), resulting in a different filter effect, and is asynchronous, the following display of data list does not need to refresh, in this project to obtain a better user experience.
Here's a screenshot: