Detailed explanation of usage examples of jquery showModelDialog_jquery

I received a task two days ago: when the user uploads an attachment, it is necessary to verify the ID card information in the attachment uploaded by the user. If there is any error information, all error information needs to be displayed.
The first thing I considered for this requirement was to use jQuery Dialog. But I saw that this project did not use showModelDialog but used showModelDialog, so for the sake of unification, showModelDialog also needs to be used.

The window.showModalDialog() method is used to create a modal dialog box that displays HTML content. Since it is a dialog box, it does not have all the properties of a window generally opened with window.open().
Usage:
varreturnValue = window.showModalDialog(URL [, arguments] [, features])
Parameter description:
URL: required parameter: used to specify the document to be displayed in the dialog box URL.
arguments: Optional parameters. Used to pass parameters to the dialog box. The type of parameters passed is not limited, including arrays, etc. The dialog box obtains the parameters passed in through window.dialogArguments.
features optional parameters. Used to describe the appearance of the dialog box and other information, you can use one or more of the following, separated by semicolons ";".
dialogHeight dialog box height, not less than 100px.
dialogWidth: Dialog width.
dialogLeft: Distance from the left side of the desktop.
dialogTop: distance from the desktop.
center: {yes| no | 1 | 0}: Whether the window is centered, the default is yes, but the height and width can still be specified. Help: {yes | no | 1 | 0}: Whether to display the help button, the default is yes. resizable: {yes | no | 1 | 0} [ie5+]: Whether it can be resized. The default is no. Status: {yes | no | 1 | 0} [IE5]: Whether to display the status bar. Default is yes[Modal] or no[Modal]. scroll:{ yes | no | 1 | 0 | on | off }: Indicates whether the dialog box displays scroll bars. The default is yes.
Example:

Copy code The code is as follows:

var rv = window.showModalDialog("<%= path%>/query/query_showErrorInfo.action","","dialogWidth=600px;dialogHeight=" height "px;dialogLeft=400px;dialogTop=200px;center=no;resizable=no");

Height: It is controlled based on the number of displays.
url: It is an action, and the user of this action obtains all the wrong person information. At the same time, jump to the errorInfo.jsp page

errorInfo.jsp

Copy code The code is as follows:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s" %>


 
   
   
   
     
   
 
     

     

          
             
      

      

          
              
                  
                  
              
              
                  
                  
                  
              
              
                  
                      
                      
                      
                  
              
          

错误人员名单
姓名	身份证	错误信息

      

     

 
 

样式表：queryErrorInfo.css

复制代码 代码如下:

html,body,.errorMain{
    overflow:hidden;
    height: 100%;
    height: 100%;
}

#showErrorInfo{
    width: 100%;
    OVERFLOW-Y: auto;
    OVERFLOW-X:hidden;
}

.errorTable{
    width: 90%;
    margin: 10px 5%;
    font-size: 12px;
    border: 1px solid #8DC8FF;
}

.errorTable td{
    height: 40px;
    border-right: 1px solid #8DC8FF;
    border-bottom:1px solid #8DC8FF;
    text-align: center;
}

.errorTable td:last-child{
    border-right: 0px;
}

td[id="btn"]{
    border-bottom: 0px;
}

.errorTitle{
    font-weight: bold;
    font-size: 14px;
    background-color: #C6E3FF;
    color: #176ED2;
    text-align: center;
}

.errorBtn{
    width: 100%;
    height: 20px;
    text-align: center;
    bottom: 0px;
    position:absolute;
}

结果如下：