Time Control precise to seconds in JSP pages

Technology: Struts1 + jsp + MSql

Requirement: The ncmgt network monitoring system displays the user's operation logs and queries the user's detailed operation records based on the operation time. The time is accurate to seconds.

The general effect is as follows ,!

You can clearly see that the red line is queried by time, and the time is accurate to seconds. It should not be manually input by the user, otherwise it will greatly reduce the user experience performance, this is just the time control. It's just like a small clock, but it's just a picture. We need to know what is hidden behind it. Let's show you the effect first, when we click a small clock, the following pop-up is displayed:

In such a calendar image, you can see that the bottom line is added with the hour, minute, and second. The default is none.

The following describes how to achieve this effect.

Step 1:

Introduce js files

The header of the JSP page

 
 

  
  
<script language="javascript" src="http://localhost:8080/ncmgt//js/calendar.js"></script> 
 
 

Step 2:

Prepare a small image.

 
 

  
  
<! -- The text box is used to receive the time selected by the user and pass it to the oplog object class attribute in the form -->
  
  
 
  
  
<Input type = "text" name = "oplogSearch. dateBegin" size = "16" value = "" readonly = "readonly" class = "textarea1">
  
  
<A href = "javascript: buildCal (oplogListForm. elements ['oplogsearch. datebegin'], true)">
  
  
 </a>
 
 

When you select a time, the following function puts the time in the text box and submits the form.

 
 

  
  
Function closewin (){
  
  
// Obtain the login name and time
  
  
Parent.doc ument. forms ["0"]. elements ["oplogSearch. opname"]. value
  
  
= Document. forms ["0"]. elements ["oplogSearch. opname"]. value;
  
  
Parent.doc ument. forms ["0"]. elements ["oplogSearch. dateBegin"]. value
  
  
= Document. forms ["0"]. elements ["oplogSearch. dateBegin"]. value;
  
  
Parent.doc ument. forms ["0"]. elements ["oplogSearch. dateEnd"]. value
  
  
= Document. forms ["0"]. elements ["oplogSearch. dateEnd"]. value;
  
  
Parent.doc ument. forms ["0"]. submit ();
  
  
Parent.doc ument. getElementById ('divwindow'). style. display = "none ";
 
 

;

• Return false;
• }

It is not a matter of submitting a form. It is very important to have a process. If the user chooses a time from 5.3 to 5.1. That is, what we often say is greater than, smaller than, small.

This is not logical. It is like a number greater than 3 and less than 1. Where is this? To prevent such a value from being transferred to the background Action, we should process it after the user selects the time.

 
 

  
  
Function comparePair (){
  
  
Var begin, end;
  
  
Begin = document. forms ["0"]. elements ["oplogSearch. dateBegin"]. value;
  
  
End = document. forms ["0"]. elements ["oplogSearch. dateEnd"]. value;
  
  
If (begin> end & end! = ""){
  
  
Alert ("the time you selected is incorrect! ');
  
  
Return false;
  
  
}
  
  
Return true;
  
  
}
 
 

In this way, it will be processed in the background. Another point is that the MySql database I use cannot use to_date () for the processing time in mySQL. It is the time and date function in Oracle, we can use Date. format ();

For example:

 
 

  
  
select count(*) from nc_op_log where 1=1    and date <= DATE_FORMAT('2012-05-03 1
  
  
7:28:39','YYYY-MM-DD HH24:MI:SS')  and date >= DATE_FORMAT('2012-05-01 17:28:43','YYYY-MM-DD HH24:MI:SS')  
 
 

However, if your field is of the Date type and does not need any function, you can directly query the result by string processing.

For example:

 
 

  
  
select count(*) from nc_op_log where 1=1  and date >= '2012-05-01 17:28:43'   and date <= '2012-05-03 17:28:39'