Util.js contains useful function functions that are called on the client page and can be separated from DWR and duliying for your system.
The main functions are as follows:
1, $ () get the page parameter value
2, AddOptions and Removealloptions initialize the Drop-down box
3, Addrows and removeallrows fill the table
4, GetText get the value of the Text property
5, GetValue get form form value
6, GetValues get form multiple values
7, OnReturn
8, Selectrange
9, SetValue
10, Setvalues
11, Todescriptivestring
12, Useloadingmessage
13, Submission Box
***************************************************************************************
//////////////////////////////////////////////////////////////////////////////////////
****************************************************************************************
1, $ () function
IE5.0 does not support
$ = document.getElementById
Get form table values
var name = $ ("name");
***************************************************************************************
//////////////////////////////////////////////////////////////////////////////////////
****************************************************************************************
2. To populate Select dropdown box option
A, if you want to save the original data when you update the Select, add the new option in the original select:
var sel = dwrutil.getvalue (ID);
Dwrutil.removealloptions (ID);
Dwrutil.addoptions (id,...);
Dwrutil.setvalue (Id,sel);
Demo: For example you want to add an option: "--Please Choose--"
Dwrutil.addoptions (id,["-Please select-"]);
The Dwrutil.addoptions () has 5 ways:
@ Simple array Example: plain arrays
For example:
Array array = new array[' Africa ', ' America ', ' Asia ', ' Australasia ', ' Europe '];
Dwrutil.addoptions ("Demo1", array);
@ Simple Object array Example an array with an element of beans
In this case, you need to specify the property to display beans and the corresponding bean value
For example:
public class Person {
private String name;
Private Integer ID;
Pirvate String address;
public void Set () {...}
Public String get () {...}
}
Dwrutil.addoptions ("Demo2", array, ' ID ', ' name ');
Where the ID points to the bean's ID attribute, and in Optiong, the value,name point to the bean's Name property corresponding to the value shown in the Drop-down box.
@ Advanced Object Array Example Basic ditto
Dwrutil.addoptions ("Demo3",
[{name: ' Africa ', id: ' AF '},
{name: ' America ', id: ' AM '},
{name: ' Asia ', ID: ' As '},
{name: ' Australasia ', ID: ' AU '},
{name: ' Europe ', id: ' EU '}
], ' id ', ' name ';
The @ Map Example uses the map to populate options:
If the server returns to Map, then you can do this:
Dwrutil.addoptions ("Demo3", map);
In which the value corresponds to map keys,text corresponding to map values;
@ <ul> and <ol> list editing
Dwrutil.addoptions () function can not only fill out the Select, open can fill out <ul> and <ol> such heml elements
***************************************************************************************
//////////////////////////////////////////////////////////////////////////////////////
****************************************************************************************
3, Addrows and removeallrows fill the table
DWR provides 2 functions to manipulate the table;
----------------------------
Dwrutil.addrows (); Add rows
----------------------------
Dwrutil.removeallrows (ID); Deletes a table with the specified ID
----------------------------
Here's a look at the Addrows () function:
Dwrutil.addrows (ID, array, cellfuncs, [options]);
Where ID corresponds to the ID of table (more suitable for tbodye, recommended to use Tbodye)
Array is the return value of server-side servers, such as List,map and so on
Cellfuncs and return values to spring form
[Options] is used to set the table style, which has 2 internal functions to set cell styles (Rowcreator, cellcreator).
For example, the server returns the list, and the list stores the following bean:
public class Person {
private String name;
Private Integer ID;
Pirvate String address;
public void Set () {...}
Public String get () {...}
}
Below with Dwrutil.addrows ();
/**************************************************************************************/
/****************** Hu Guoqing ***********fzfx88@hotmail.com********************************/
/**************************************************************************************/
function userlist (data) {
var Delbutton = "<input type= ' button '/>";
var Editbutton = "<input type= ' button '/>";
var Cellfuncs = [
function (data) {return data.id;},
function (data) {return data.username;},
function (data) {return data.usertruename;},
function (data) {return data.birthday;},
function (data) {
var IDD = data.id;
var Delbutton = document.createelement ("<input type= ' button ' onclick= ' Delperson" ("+ IDD +") ' > ');
Delbutton.setattribute ("id", "delete");
Delbutton.setattribute ("Value", "delete");
return Delbutton;
},
function (data) {
var IDD = data.id;
var Editbutton = document.createelement ("<input type= ' button ' onclick= ' Editperson" ("+ IDD +") ' > ');
Editbutton.setattribute ("Name", "edit");
Editbutton.setattribute ("Value", "edit");
return Editbutton;
}
];
Dwrutil.removeallrows (' tabid ');
Dwrutil.addrows (' TabID ', data,cellfuncs,{
Rowcreator:function (options) {
var row = document.createelement ("tr");
var index = Options.rowindex * 50;
Row.setattribute ("id", options.rowData.id);
Row.style.collapse = "separate";
Row.style.color = "RGB (" + Index + ", 0,0)";
return row;
},
Cellcreator:function (options) {
var td = Document.createelement ("TD");
var index = 255-(Options.rowindex * 50);
Td.style.backgroundColor = "RGB (" + Index + ", 255,255)";
Td.style.backgroundColor = "Menu";
Td.style.fontWeight = "bold";
td.style.align = "center";
return TD;
}
});
document.getElementById ("BT"). Style.display = "None";
}
Cond................................................
/**************************************************************************************/
/**************************************************************************************/
/**************************************************************************************/
4, GetText get the value of the Text property
Dwrutil.gettext (ID): Used to get text in option
Like what:
<select id= "Select" >
<option value= "1" > Apple </option>
<option value= "2" select> Banana </option>
<option value= "3" > Pear </option>
</select>
Call Dwrutil.gettext ("select"); The Banana field will be returned;
Dwrutil.gettext (ID); Only used to get select text values, others do not apply.
/**************************************************************************************/
/**************************************************************************************/
/**************************************************************************************/
5. Dwrutil.getvalue (ID): Used to get form form values
There are several situations:
Text area (id= "textarea"): Dwrutil.getvalue ("textarea") returns the value of text area;
Selection list (id= "select"): Dwrutil.getvalue ("select") returns the value of Selection list;
Text input (id= "text"): Dwrutil.getvalue ("text") will return the value of text input;
Password input (id= "Password"): Dwrutil.getvalue ("text") will return the value of Password input;
Form button (id= "Formbutton"): Dwrutil.getvalue ("Formbutton") returns the value of the form button;
Fancy button (id= "button"): Dwrutil.getvalue ("Formbutton") returns the value of the Fancy button;
/**************************************************************************************/
/**************************************************************************************/
/**************************************************************************************/
6, GetValues get form multiple values
To obtain the value of the page form in batches, combine the form of the number group, return to Name/value;
For example: Form ():
<input type= "textarea" id= "textarea" value= "1111"/>
<input type= "text" id= "text" value= "2222"/>
<input type= "password" id= "password" value= "3333"/>
<select id= "Select" >
<option value= "1" > Apple </option>
<option value= "4444" select> Banana </option>
<option value= "3" > Pear </option>
</select>
<input type= "button" id= "button" value= "5555"/>
So: Dwrutil.getvalues ({textarea:null,select:null,text:null,password:null,button:null})
^^ ^^ ^^ ^^ ^^ ^^ {textarea:1111,select:4444,text:2222,password:3333,button:5555} ^^
/**************************************************************************************/
/**************************************************************************************/
/**************************************************************************************/
7, Dwrutil.onreturn prevent when entered in the text box, directly press ENTER to submit the form.
<input type= "text" onkeypress= "Dwrutil.onreturn (event, submitfunction)"/>
<input type= "button" onclick= "Submitfunction ()"/>
/**************************************************************************************/
/**************************************************************************************/
/**************************************************************************************/
8, Dwrutil.selectrange (Ele, start, end);
Select a range in an input box
Dwrutil.selectrange ("Sel-test", $ ("Start"). Value, $ ("End"). value);
For example: <input type= "text" id= "Sel-test" value= "012345678901234567890" >
Dwrutil.selectrange ("Sel-test", 2, 15); The value ' 2345678901234 ' in the resulting text box will be selected '
/**************************************************************************************/
/**************************************************************************************/
/**************************************************************************************/
9, Dwrutil.setvalue (Id,value);
Sets a new value for the specified ID element;
/**************************************************************************************/
10, Dwrutil.setvalues ({
Name: "Fzfx88",
Password: "1234567890"
}
); Ditto, bulk update form values.
/**************************************************************************************/
11, Dwrutil.todescriptivestring ()
ToString with debug information, the first is the object that will be debug, and the second is the processing level. Levels are as follows:
0:single Line of debug Single-line debugging
1:multi-line debug that does not dig into the child objects multiple-line debugging without parsing subelements
2:multi-line debug that digs to the 2nd layer of child objects most of the multiple-row debugging to the second-level sub-element
<input type= "text" id= "text" >
Dwrutil. Todescriptivestring ("text", 0);
/**************************************************************************************/
12, Dwrutil.useloadingmessage ();
When an AJAX request is made, the page displays the prompt to wait for information;
function Searchuser () {
var loadinfo = "Loading ..."
try{
Reguser.queryalluser (userlist);
Dwrutil.useloadingmessage (Loadinfo);
}catch (e) {
}
}
/**************************************************************************************/
