4 Day Learning noahweb form-day fourth

Web Everyone good! See You again! Today we're going to learn another very, very important form control--Multilevel association type control. It's my article today. TutorialsThe last day, first of all thank you for your support in a few days ... Thank you!

I do not know if you have encountered this situation, sometimes, the page provides two drop-down to select the user, it is quite simple things, however, the second Drop-down list of optional values are based on the user in the first Drop-down list of choices generated. Do such things need to write a lot of JavaScript code, huge trouble! A few days ago looked at Noahweb, found that it provides such a control, called "Multilevel Association type Control" to think about the discovery is very good, today to listen to everyone!

Plainly, this control is the second dropdown that is dynamically generated according to the options in the first Drop-down list. Or the old rules, first look at the code, or not to say clearly! Oh!

<inputline text= "Selectlevel" desc= "" >
<input id= "SLA" type= "select" >
<Label> Select:</label>
<LabelClass>label</LabelClass>
<NullErrorString> Please select 1</nullerrorstring>
　　　　　　 <selectlevel sla= "[Select1]" slb= "[Select2]" >
<leveloption text= "Please select" value= ">
<leveloption text= "Please select" value= ">
</LevelOption>
</LevelOption>
<leveloption text= "Germany" value= "010" >
<leveloption text= "Berlin" value= "0101" >
</LevelOption>
<leveloption text= "Munich" value= "0102" >
</LevelOption>
</LevelOption>
<leveloption text= "Australia" value= "021" >
<leveloption text= "Melbourne" value= "0211" >
</LevelOption>
<leveloption text= "Canberra" value= "0212" >
</LevelOption>
</LevelOption>
　　　　　　 </SelectLevel>
</Input>
<input id= "SLB" type= "select" >
<Label> Select:</label>
<LabelClass>label</LabelClass>
<NullErrorString> Please select 2</nullerrorstring>
</Input>
</InputLine>

The first step: First look at a general ... There are two input in one inputline in the code, one called SLA and the other is SLB. are of type Select. This is the two Drop-down list that appears in the form in a moment.

The second step: that is, "multi-level association", as the name implies is to connect these two or more select, to achieve the required function! Let's take a look at the code that I've been bold, which is

<selectlevel sla= "[Select1]" slb= "[Select2]" >

And then find the end tag of it, which is

</SelectLevel>

It is their content that associates the two select. The Selectlevel label is used to describe the selection-level association of multiple controls. SLA is the name of the first select, which is based on the value of the SELECT1 variable as a value that has been selected, then SLB naturally is the second select name, SLB based on the value of the Select1 variable as the selected value! This is done in order to use this form to echo.

Step three: Let's take a look at the following code:

<leveloption text= "Please select" value= ">
<leveloption text= "Please select" value= ">
</LevelOption>
</LevelOption>

We see the leveloption tag, which is used to describe the optional value associated with the level. There is also a inclusion relationship, as in the code, the Leveloption that describes the first level Select is the outer layer, and the second select is the inner leveloption. These two codes give the initial value of two Select, that is, "please choose", a little bit of humanity!

Fourth step: Now to achieve the "cascade" Function! Look at the code,

<leveloption text= "Germany" value= "010" >
<leveloption text= "Berlin" value= "0101" >
</LevelOption>
<leveloption text= "Munich" value= "0102" >
</LevelOption>
</LevelOption>

The code is also a containment relationship, and as above, the outer leveloption is used to control the first select, the inner control of the second select. First look at the outer layer, in its parameter text I write a person "Germany", and the parameter value is its value. There are two leveloption in the inner layer, one is "Berlin" and the other is "Munich". In fact, it's quite simple to think, "Germany" is the optional value that appears in the first select, and when "Germany" is selected, the two optional values for "Berlin" and "Munich" should appear automatically in the second select.

Fifth step: We then write some code:

<leveloption text= "Australia" value= "021" >
<leveloption text= "Melbourne" value= "0211" >
</LevelOption>
<leveloption text= "Canberra" value= "0212" >
</LevelOption>
</LevelOption>

In fact, I have no need to explain anything here! The code is exactly the same as above. The effect is to add an additional optional value to the two select. When you select Australia, the two optional values for "Melbourne" and "Canberra" should appear in the second select.

Done! Try! ^_^

Two select came out ... Try the function again.

No problem! If you choose "Australia" ...

Everything's fine! If you want to add an optional value in the Cascade, follow steps fourth or fifth to write a leveloption. You can try it on your own! In addition, there is another mode of generating "cascading", using the database fetch method, the optional values in the two select are returned by Chaku, and the query criteria for the database operation set in the second select is to use the value selected in the first select, if you want to generate cascading. The implementation method is also very simple! Because of the length of the question, I will not say more here. When you need to use them, go to the Noahweb official help document .

I would also like to talk about some of the use of the form of skills, but there is no time! Well, here are a few links, some of the tips I've seen in Noahweb's official help document, and everyone who's interested will go and see ...

Magical uses of label type controls

Use the newline tag and use the empty Inputline label

about using HTML tags in a form

All right! The simple knowledge of the form here it is! A few days down I also learned a lot of things, the tutorial is not well written, everyone forgive! I'll try to write a better tutorial! Thank you! Good luck!