Multiple ways to change the SELECT options in an HTML drop-down box

Multiple ways to change the SELECT options in an HTML drop-down box
After the form is submitted, the returned HTML page is re-rendered, and neither the value nor the selectedIndex attribute of the SELECT control can make the drop-down box retain the state before the form is submitted.

Copy code
The code is as follows:

<SELECT id="idState" style="width:150" name="state" selectedIndex="$!{state}">
<OPTION value="">All</OPTION>
<OPTION value="1">Pass</OPTION>
<OPTION value="2">Not passed</OPTION>
<OPTION value="3">Pending</OPTION>
</SELECT>

A temporary solution is to add a script at the end of the vm file to assign a value to the drop-down box :

Copy code
The code is as follows:

<script>
$('#idState').val('$!{state}');
</script>

Another solution is to set a default selection :

Copy code
The code is as follows:

<SELECT id="idState" style="width:150" name="state" value="$!{state}">
<OPTION value="">All</OPTION>
<OPTION value="1">Pass</OPTION>
<OPTION value="2" SELECTED>Not passed</OPTION>
<OPTION value="3">Pending</OPTION>
</SELECT>

The VTL way of writing is :

Copy code
The code is as follows:

<SELECT id="idState" style="width:150" name="state" value="$!{state}">
<OPTION value="">All</OPTION>
<OPTION #if($!{state} == 1) SELECTED #end value="1">Pass</OPTION>
<OPTION #if($!{state} == 2) SELECTED #end value="2">Not passed</OPTION>
<OPTION #if($!{state} == 3) SELECTED #end value="3">To be processed</OPTION>
</SELECT>

It should be noted here that when performing == comparison, Velocity distinguishes between types. If you compare with the strings "1", "2", and "3", you will always get false.
Comparison issues in velocity <br />For velocity, comparisons, especially those involving inequality comparisons (greater than or less than), are difficult to implement. Now I want to display the file size on the page in categories (Bytes, MB, GB), which involves the problem of comparing filesize sizes. Is there a better way to achieve this?
For example, the following code:

Copy code
The code is as follows:

#if ($filesize > 1024 && $filesize < 1048567)
#set($ksize = $filesize%1024)
<div class="mlt">File Size: $ksize KB
#elseif ($filesize > 1048567 && $filesize < 1073731824)
#set($msize=$filesize%1048567)
<div class="mlt">File Size: $msize MB
#elseif ($filesize > 1073731824)
#($gsize=$filesize%1073731824)
<div class="mlt">File Size: $gsize GB
#else
<div class="mlt">File Size: $filesize Bytes
#end


Copy code
The code is as follows:

<PRE class=html name="code"><SPAN style="FONT-FAMILY: Arial, Helvetica, sans-serif"><SPAN style="WHITE-SPACE: normal">
</SPAN></SPAN></PRE>
<PRE></PRE>
<PRE></PRE>
<PRE></PRE>

<<:  Pagination Examples and Good Practices

>>:  How to successfully retrieve VMware Esxi root password after forgetting it

Recommend

The difference between Input's size and maxlength attributes

I recently used the input size and maxlength attri...

In-depth understanding of CSS @font-face performance optimization

This article mainly introduces common strategies ...

Explanation of the problem that JavaScript strict mode does not support octal

Regarding the issue that JavaScript strict mode d...

How to run top command in batch mode

top command is the best command that everyone is ...

Install Centos7 using Hyper-v virtual machine

Table of contents introduce Prepare Download syst...

How to deploy Redis 6.x cluster through Docker

System environment: Redis version: 6.0.8 Docker v...

Nginx 502 Bad Gateway Error Causes and Solutions

I have encountered the Nginx 502 Bad Gateway erro...

Detailed explanation of zabbix executing scripts or instructions on remote hosts

Scenario Requirements 1. We can use the script fu...

Intellij IDEA quick implementation of Docker image deployment method steps

Table of contents 1. Docker enables remote access...

Specific use of Linux gcc command

01. Command Overview The gcc command uses the C/C...

Examples of some usage tips for META tags in HTML

HTML meta tag HTML meta tags can be used to provi...

Linux checkup, understand your Linux status (network IO, disk, CPU, memory)

Table of contents 1. Core commands 2. Common comm...

Velocity.js implements page scrolling switching effect

Today I will introduce a small Javascript animati...

Detailed explanation of CSS float property

1. What is floating? Floating, as the name sugges...

How to use the Linux basename command

01. Command Overview basename - strip directories...