zoukankan      html  css  js  c++  java
  • WebApp匯入資料之對話框實現

    WebApp匯入資料之對話框實現——showModalDialog
    1、應用場景
    我常用的場景,列表的內容過多,dropdownlist顯示不便。例如:

    1 <HTML>
    2  <BODY>
    3   <INPUT TYPE="text" NAME="name"><INPUT TYPE="button" VALUE="..." ONCLICK="">
    4  </BODY>
    5 </HTML>

    2、預備知識要點
    window.showModalDialog
    Syntax
         vReturnValue = window.showModalDialog(sURL [, vArguments] [, sFeatures])
    Parameters
         sURL         Required. String that specifies the URL of the document to load and display.
         vArguments   Optional.
         sFeatures    Optional. String
        dialogHeight:sHeight;dialogLeft:sXPos;dialogTop:sYPos;dialogWidth:sWidth;
        center:{ yes | no | 1 | 0 | on | off };dialogHide:{ yes | no | 1 | 0 | on | off };
        edge:{ sunken | raised };help:{ yes | no | 1 | 0 | on | off };
        resizable:{ yes | no | 1 | 0 | on | off };scroll:{ yes | no | 1 | 0 | on | off };
        status:{ yes | no | 1 | 0 | on | off };unadorned:{ yes | no | 1 | 0 | on | off }
        e.g.: window.showModalDialog("SMD_target.htm","Dialog Arguments Value","dialogHeight: 73px; dialogWidth: 705px;
              dialogTop: 578px; dialogLeft: 531px; edge: Raised; center: Yes; help: Yes; resizable: Yes; status: Yes;");
    Return Value
         Variant. Returns the value of the returnValue property as set by the window of the document specified in sURL .
      a.Syntax
          window.returnValue [ = vValue ]
    3、實現要點
    a,打開靜態頁面
    打開Dialog
    HTML Code

        function Button2_onclick() {
                
    var ret=window.showModalDialog("DialogUrl.htm","","");
    }

    返回值
    HTML Code

    function Button1_onclick() {
        window.returnValue
    ="returnvalue-test";
    }

    b,打開動態頁面
    HTML Code

    function btnWithPostback_onclick() {
        
    var ret=window.showModalDialog("DialogUrl.aspx","","");
    }

    返回值
    VB Code

        Protected Sub btnPostback_Click(ByVal sender As ObjectByVal e As System.EventArgs) Handles btnPostback.Click        Dim s As String = _        "window.returnValue=""returnvalue-test"";"

            Page.ClientScript.RegisterStartupScript(
    Me.GetType(), "WinRet", s, True)
        
    End Sub

    上b,會有一個問題,點擊按鈕Postback時,會打開以個新的窗口顯示DialogUrl.aspx。
    c,解決Postback問題
    關鍵是借住frame,通過中間頁面。
    (1)getInfoFrame2.aspx

    <head runat="server">
        
    <title>
            
    <%=Request("Title")%>
        
    </title>
    </head>
    <frameset rows="*" border="1" framespacing="4" frameborder="0">
        
    <frame id="setUser" src='<%=Request("OpenUrl")%>?<%=Request("OpenParam")%>' scrolling="auto">
    </frameset>

    (2)Dialogs.js

    function SearchUser2(dialogUrl, ctl_User,ctl_UserName,ctl_key,ctl_DeptNo,ctl_DeptName,SearchType)
    {   
        flagEvent 
    = false;
        
    var OpenUrl = escape(dialogUrl);
     
    var OpenParam = '';   
     
    //key value
     var skey = document.all(ctl_key).value;   
                
     OpenParam 
    = escape('message=' + escape('Search processing !...'+ '&formname=' + document.forms[0].name +
                               
    '&SearchKey=' + escape(skey) + '&SearchType=' + SearchType);
     
     
    var url = 'Dialogs/getInfoFrame2.aspx?Title=User Dialog&OpenUrl=' + OpenUrl + '&OpenParam=' + OpenParam;
     
      OpenUrl 
    = escape('SearchUserDialog2.aspx');
      url 
    = 'Dialogs/getInfoFrame2.aspx?Title=User Dialog&OpenUrl=' + OpenUrl + '&OpenParam=' + OpenParam;

      
    // 獲取返回值,例如:"0901,0902,0903,0904" center=yes;
      ret = window.showModalDialog(url, window, "dialogWidth:402px;dialogHeight:406px;left=800;top=60;help=no;status=no;scroll=no");
         
    if (ret != '')  // 有值,則賦值
         {
          
    if (ctl_User!="")
          {
        
    var arry=ret.split("$");           
              document.all(ctl_User).value 
    = arry[0];
              document.all(ctl_UserName).value 
    = arry[1]; 
              document.all(ctl_DeptNo).value 
    = arry[2];
              document.all(ctl_DeptName).value 
    = arry[3];
          }   
      }
      
    else  // 沒有值,則置空
      {
              document.all(ctl_User).value 
    = ""
              document.all(ctl_UserName).value
    ='';
              document.all(ctl_DeptNo).value 
    = '';
              document.all(ctl_DeptName).value 
    = '';        
      }
      flagEvent 
    = true;
    }

    (3)SearchUserDialog2.aspx

    HTML部分

      1 <head runat="server">    <title>Search User</title>    <style>    body    {        font-size:12px;    }    </style>
      2 
      3     <script language="javascript">  
      4       var PreBackgroundColor = "";
      5       var PreColor = "";
      6       function sMove(st)
      7       {
      8           if (PreBackgroundColor == "")
      9           {
     10               if (st != selid)
     11               {
     12                   PreBackgroundColor = st.style.backgroundColor;
     13                   PreColor = st.style.color;
     14                   st.style.backgroundColor='#3399ff';
     15                   st.style.color='#ffffff';
     16               }
     17           }
     18       }
     19 
     20       function cMove(st)
     21       {
     22           if (st != selid)
     23           {
     24               st.style.backgroundColor = PreBackgroundColor;
     25               st.style.color = PreColor;
     26               PreBackgroundColor = "";
     27           }
     28       }
     29       function CloseWindow()
     30       {
     31           self.close();
     32       }
     33  
     34       var selid;
     35       function doChoose(st, value1)
     36       {
     37           if (selid != null)
     38           {
     39               selid.style.backgroundColor='#f4ffff';
     40               selid.style.color='Black';
     41           }
     42           selid = st;
     43           document.all('hidVendorNameAndId').value = value1;
     44       }
     45  
     46       window.returnValue = '';
     47       function doReturnValue()
     48       {
     49           window.returnValue = document.all('hidVendorNameAndId').value;
     50           window.close();
     51       }
     52      
     53     </script>
     54 
     55 </head>
     56 <body style="margin-bottom: 0;">
     57     <form id="form1" runat="server">
     58         <div>
     59             <table cellpadding="0" cellspacing="0" width="100%">
     60                 <tr>
     61                     <td>
     62                         Key Value:<asp:TextBox ID="txtKeyword" runat="server"></asp:TextBox>
     63                         <asp:Button ID="btnSearch" runat="server" Text="Search" /></td>
     64                 </tr>
     65                 <tr>
     66                     <td>
     67                         <asp:GridView ID="gvData" runat="server" AutoGenerateColumns="False" CellPadding="4"
     68                             ForeColor="#333333" GridLines="None" AllowPaging="True" Width="100%">
     69                             <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
     70                             <Columns>
     71                                 <asp:TemplateField HeaderText="Employee No.">
     72                                     <HeaderStyle HorizontalAlign="Left" />
     73                                     <ItemTemplate>
     74                                         <asp:Label ID="lblId" runat="server" Text='<%# Bind("EMPNO") %>'></asp:Label>
     75                                     </ItemTemplate>
     76                                     <ItemStyle Width="80px" />
     77                                 </asp:TemplateField>
     78                                 <asp:TemplateField HeaderText="Employee Name">
     79                                     <ItemTemplate>
     80                                         <asp:Label ID="lblName" runat="server" Text='<%# Bind("USERNAME") %>'></asp:Label>
     81                                     </ItemTemplate>
     82                                 </asp:TemplateField>
     83                                 <asp:TemplateField HeaderText="DEPTNO" Visible="false">
     84                                     <ItemTemplate>
     85                                         <asp:Label ID="lblDeptNo" runat="server" Text='<%# Bind("DEPTNO") %>'></asp:Label>
     86                                     </ItemTemplate>
     87                                 </asp:TemplateField>
     88                                 <asp:TemplateField HeaderText="Dept Name" Visible="true">
     89                                     <ItemTemplate>
     90                                         <asp:Label ID="lblDeptName" runat="server" Text='<%# Bind("cdeptname") %>'></asp:Label>
     91                                     </ItemTemplate>
     92                                 </asp:TemplateField>
     93                             </Columns>
     94                             <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
     95                             <EditRowStyle BackColor="#999999" />
     96                             <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" BorderStyle="Solid" />
     97                             <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
     98                             <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
     99                             <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
    100                         </asp:GridView>
    101                     </td>
    102                 </tr>
    103                 <tr>
    104                     <td align="center">
    105                         <asp:Button ID="btnOk" runat="server" Text="OK" Width="58px" />
    106                         <asp:Button ID="btnCancel" runat="server" Text="Cancel" Width="58px" /></td>
    107                 </tr>
    108             </table>
    109         </div>
    110         <asp:Label ID="lblMsg" runat="server" Text=""></asp:Label>
    111         <input id="hidVendorNameAndId" type="hidden" />
    112     </form>
    113 </body>

    Code部分   

      1 Protected Sub Page_Load(ByVal sender As ObjectByVal e As System.EventArgs) Handles Me.Load
      2         btnOk.Attributes.Add("onclick""doReturnValue();")
      3         btnCancel.Attributes.Add("onclick""CloseWindow()")
      4 
      5         If Not Page.IsPostBack Then
      6             If Request.QueryString("SearchKey"<> "" And txtKeyword.Text.Trim = "" Then
      7                 Me.txtKeyword.Text = Server.UrlDecode(Request.QueryString("SearchKey"))
      8             End If
      9 
     10             If Request.QueryString("SearchKey"<> "" Then
     11                 BindData()
     12             End If
     13         End If
     14     End Sub
     15 
     16     Public Function GetList() As System.Data.DataSet
     17         Dim connstr As String = System.Configuration.ConfigurationManager.ConnectionStrings("dbconnstr").ConnectionString
     18         Dim dbHelper As New DBUtility.DatabaseHelper(connstr, DBUtility.Providers.SqlServer)
     19         Dim sb As New StringBuilder
     20 
     21         sb.Append(" select   u.empno,u.username,d.DEPTNO,d.cdeptname ")
     22         sb.Append(" from  [user] u,DEPTUSER du,dept d ")
     23         sb.Append(" where u.userid=du.userid ")
     24         sb.Append(" and d.deptid=du.deptid ")
     25         sb.Append(" and u.enable='Y' ")
     26         If Me.txtKeyword.Text <> "" Then
     27             sb.AppendFormat(" and ( username like N'%{0}%'"Me.txtKeyword.Text)
     28             sb.AppendFormat(" or empno like '%{0}%' "Me.txtKeyword.Text)
     29             sb.Append(")")
     30         End If
     31 
     32         Return dbHelper.ExecuteDataSet(sb.ToString())
     33     End Function
     34 
     35     Public Function GetCountList() As Integer
     36         Dim connstr As String = System.Configuration.ConfigurationManager.ConnectionStrings("dbconnstr").ConnectionString
     37         Dim dbHelper As New DBUtility.DatabaseHelper(connstr, DBUtility.Providers.SqlServer)
     38         Dim sb As New StringBuilder
     39 
     40         sb.Append(" select count(*) from (")
     41         sb.Append(" select   u.empno,u.username,d.DEPTNO,d.cdeptname ")
     42         sb.Append(" from  [user] u,DEPTUSER du,dept d ")
     43         sb.Append(" where u.userid=du.userid ")
     44         sb.Append(" and d.deptid=du.deptid ")
     45         sb.Append(" and u.enable='Y' ")
     46         If Me.txtKeyword.Text <> "" Then
     47             sb.AppendFormat(" and ( username like '%{0}%'"Me.txtKeyword.Text)
     48             sb.AppendFormat(" or empno like '%{0}%' "Me.txtKeyword.Text)
     49             sb.Append(")")
     50         End If
     51         sb.Append(" ) b")
     52 
     53         Return CInt(dbHelper.ExecuteScalar(sb.ToString()))
     54     End Function
     55 
     56     Protected Sub btnSearch_Click(ByVal sender As ObjectByVal e As System.EventArgs) Handles btnSearch.Click
     57         BindData()
     58     End Sub
     59 
     60     Protected Sub gvData_PageIndexChanging(ByVal sender As ObjectByVal e As System.Web.UI.WebControls.GridViewPageEventArgs) Handles gvData.PageIndexChanging
     61         Me.gvData.PageIndex = e.NewPageIndex
     62         BindData()
     63     End Sub
     64 
     65     Private Sub BindData()
     66         Dim dsVendorName As New System.Data.DataSet
     67         dsVendorName = GetList()
     68 
     69         Me.gvData.DataSource = dsVendorName
     70         Me.gvData.DataBind()
     71     End Sub
     72 
     73     Private Sub ReturnValue(ByVal value As String)
     74         Dim js As String = ""
     75         js += "<script>"
     76         js += "window.returnValue='" & value & "';window.close();"
     77         js += "</script>"
     78         Me.ClientScript.RegisterStartupScript(Me.GetType(), "ShowDialogBox", js)
     79     End Sub
     80 
     81     Protected Sub gvData_RowDataBound(ByVal sender As ObjectByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles gvData.RowDataBound
     82         If e.Row.RowType = DataControlRowType.DataRow Then
     83             e.Row.Attributes("onmouseover"= "sMove(this);"
     84             e.Row.Attributes("onmouseout"= "cMove(this);"
     85             e.Row.Attributes("onclick"= "doChoose(this);"
     86             'e.Row.Style.Add("color", "Black")
     87             'e.Row.Style.Add("background-color", "#F4FFFF")
     88             e.Row.Style.Add("CURSOR""hand")
     89 
     90             Dim lblId As Label = CType(e.Row.FindControl("lblId"), Label)
     91             Dim lblName As Label = CType(e.Row.FindControl("lblName"), Label)
     92             Dim lblDeptNo As Label = CType(e.Row.FindControl("lblDeptNo"), Label)
     93             Dim lblDeptName As Label = CType(e.Row.FindControl("lblDeptName"), Label)
     94             Dim returnValue1 As String = lblId.Text.Trim() & "$" & lblName.Text.Trim & _
     95             "$" & lblDeptNo.Text.Trim() & "$" & lblDeptName.Text.Trim()
     96 
     97             e.Row.Attributes.Add("onclick""doChoose(this,'" & returnValue1 & "');")
     98             e.Row.Attributes.Add("onDblClick""doReturnValue();")
     99         End If
    100     End Sub
    101 
    102     Protected Sub btnOk_Click(ByVal sender As ObjectByVal e As System.EventArgs) Handles btnOk.Click
    103         'Dim ret As String = String.Empty
    104         'For Each gvRow As GridViewRow In Me.gvData.Rows
    105         '    If CType(gvRow.FindControl("chkSelect"), CheckBox).Checked Then
    106 
    107         '        If gvRow.FindControl("lblId") IsNot Nothing Then
    108         '            ret &= CType(gvRow.FindControl("lblId"), Label).Text.Trim() + ","
    109         '        End If
    110         '    End If
    111         'Next
    112         'If ret.Length > 0 Then
    113         '    ret = ret.Substring(0, ret.LastIndexOf(","))
    114         'End If
    115         'ReturnValue(ret)
    116     End Sub

    (4)調用

     1 <head runat="server">
     2     <script src="Dialogs/Dialogs.js" type="text/javascript"></script>
     3 </head>
     4 <body>
     5     <form id="form1" runat="server">
     6         <div>
     7             <asp:TextBox ID="txtPicName" runat="server" MaxLength="20" Width="200px"></asp:TextBox><input
     8                 id="Button1" type="button" value="..." onclick="SearchUser2('ProgressStatus.aspx','hidPicId','txtPicName','txtPicName','txtPicDeptNo','txtPicDeptName','USER2')" />
     9             <div>
    10                 <asp:TextBox ID="txtPicDeptName" runat="server" CssClass="text_system" Width="100px"></asp:TextBox>
    11                 <asp:TextBox ID="txtPicDeptNo" runat="server" CssClass="text_system" Width="100px"></asp:TextBox>
    12             </div>
    13         </div>
    14         <div style="display: none;">
    15             PicId<asp:TextBox ID="hidPicId" runat="server" Width="1px"></asp:TextBox>
    16         </div>
    17     </form>
    18 </body>



  • 相关阅读:
    初学c课程笔记整理7-->>二维数组、字符串、指针
    初学c课程笔记整理6-->>数组
    ipad上自定义view的旋转适配
    苹果mac电脑中brew的安装使用及卸载详细教程
    Apple、Google、Microsoft的用户体验设计原则
    iOS图片拉伸技巧
    子网掩码解析【转载】
    Ios8,Xcode6下 设置Launch Image 启动图片
    ios8 设置单元格分割线无效
    简述UIScrollView的属性和用法
  • 原文地址:https://www.cnblogs.com/htht66/p/1862697.html
Copyright © 2011-2022 走看看