Shulou(Shulou.com)06/02 Report--

This article introduces the relevant knowledge of "how to use JS cascades". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

Universal JS cascades for Java

[abstract] in development, cascading select drop-down boxes such as provinces, cities, large categories and small classes are often encountered. Often, the content of these categories or regions is stored in the database. It is suggested that through IO, the categories will be generated into the js file, and then the js file will be introduced into the page, so as to improve the application speed of the program and reduce the amount of code written.

[keyword] Java JS

In development, we often encounter cascading select drop-down boxes such as provinces, cities, large categories and small classes. Often, the content of these categories or regions is stored in the database. Because users want everything to be controllable. So, when it comes to this cascading, people read from the library every time, and you have to write a lot of code in JSP to read the table. In addition, when this cascading modifies the data, the selected item should be set to be contained in the library, which also requires some code to be written.

Here I suggest that through IO, the category will be generated js file, and then introduce the js file in the page, so as to improve the application speed of the program, but also reduce the amount of code writing.

The structure of the table is as follows:

Create table news_class200

(

Id int primary key

Parent_id int

Class_name varchar (20)

Orderby int default 0

)

Id is growing automatically.

The id used by parent_id to identify the parent class

Class_name category name

Orderby sorting, which is used to control the order of elements in select

Second, the java code of Chengsheng js:

Public static void news_class (String str,String tab) throws IOException

{

/ / large category name

String big= "big_class"

String small= "small_class"

String big_array= ""

String [] small_array

Jdata data = new Jdata (); / / dao object

List list = data.jlist ("select * from" + tab+ "where parent_id=0")

FileWriter fw = new FileWriter (str)

PrintWriter out = new PrintWriter (fw)

List ll = new ArrayList ()

Small_array=new String [list.size ()]

For (int iTuno; I < list.size (); iTunes +)

{

/ / read large categories of information

Map map= (Map) list.get (I)

Big_array+= "'" + map.get ("class_name") + ","

Ll=data.jlist ("select * from" + tab+ "where parent_id=" + map.get ("id"))

Small_ Array [I] = ""

For (int jacks 0; j < ll.size (); jacks +)

{

Map m = (Map) ll.get (j)

Small_ Array [I] + = "'" + m.get ("class_name") + ","

}

Small_ Array [I] = noEnd (small_ Array [I])

/ / System.out.println (big_array)

}

Big_array=noEnd (big_array)

/ / out.println ("< script language=javascript >")

Out.println ("[xss_clean] ln ('< select name=" + big+ "onchange=" + small+ "MM (this.selectedIndex)" >'); ")

Out.println ("[xss_clean] ln ('< option value="> Please select < / option >);")

Out.println ("[xss_clean] ln ('< / select >');")

Out.println ("[xss_clean] ln ('< select name=" + small+ ">');")

Out.println ("[xss_clean] ln ('< option value="> Please select < / option >);")

Out.println ("[xss_clean] ln ('< / select >');")

Out.println ("var" + big+ "Name = [" + big_array+ "];")

Out.println ("var" + big+ "Value= [" + big_array+ "];")

For (int masking 0; m < small_array.length; masking +)

Out.println ("var" + small+ (MSD1) + "= [" + small_ array [m] + "];")

Out.println ("function" + big+ "() {")

Out.println ("var e = document.getElementById ('" + big+ ");"); / / 000

Out.println ("for (var iTuno; I <" + big+ "Name.length; iTunes +)")

Out.println ("e.options.add (new Option (" + big+ "Name [I]," + big+ "value [I]);")

Out.println ("}")

Out.println ("function" + small+ "MM (n) {")

Out.println ("var e = document.getElementById ('" + small+ ");")

Out.println ("e.options.length = 1;")

Out.println ("if (n = 0) return;")

Out.println ("var a = eval ('" + small+ "'+ n);")

Out.println ("for (var iTuno; I < a.stories; iTunes +) e.options.add (new Option (a [I], a [I]));")

Out.println ("}")

Out.println (big+ ");")

/ / out.println ("window.attachEvent ('onload'," + big+ ");")

/ / out.println ("< / script >")

Out.flush ()

Out.close ()

Fw.close ()

}

3. The generated js is as follows:

[xss_clean] ln ('< select name=big_class onchange=small_classMM (this.selectedIndex) ">')

[xss_clean] ln ('< option value= "" > Please select < / option >')

[xss_clean] ln ('< / select >')

[xss_clean] ln ('< select name=small_class >')

[xss_clean] ln ('< option value= "" > Please select < / option >')

[xss_clean] ln ('< / select >')

Var big_className = ['county dynamic', 'provincial news', 'foreign news']

Var big_classValue= ['county dynamics', 'provincial news', 'foreign news']

Var small_class1 = ['Class A',''Class B,' Class C']

Var small_class2 = ['No subclass']

Var small_class3 = ['none']

Function big_class () {

Var e = document.getElementById ('big_class')

For (var iTuno; I < big_className.length; iTunes +)

E.options.add (new Option (big_className [I], big_ classValue [I]))

}

Function small_classMM (n) {

Var e = document.getElementById ('small_class')

E.options.length = 1

If (n = = 0) return

Var a = eval ('small_class'+ n)

For (var iTuno; I < a.resume; iDepression +) e.options.add (new Option (a [I], a [I]))

}

Big_class ()

This is the end of the content of "how to use JS cascades". Thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.