0

データのコンテナーとして div タグを使用しています。ユーザーがリンクをクリックするとページにリンクのリストが表示されます。その div のデータベースから関連データを表示したい場合、その div はリンクをクリックすると表示されます。ページ。私はasp.net C#を使用しています。現在、リンククリック時のdiff-2 divタグとすべてを使用してデータを表示しています。

    divid.InnerHtml="";

コードビハインドですが、リンクをクリックすると表示される単一の単一のdivを使用したいので、データベースからコンテンツをロードして、クリックされたリンクに対応するそのdivにロードしたいと考えています。

        <div id="popUpDiv"  runat="server"
        style="
            display:none;
            position:fixed;
            top:20%;
            left:20%;
            right:20%;
            min-width:60%;
            min-height:60%;
            background-color:Gray;
    z-index: 10002;">
         My popup box
         </div>

これは現在divを表示しているボタンです

<asp:Button ID="btnPopUp" OnClientClick="togglePopUp('popUpDiv'); return false;"
             text="Pop Up a div box" runat="server" />

これはC#コードです

while (dr.Read())
            {
                sr = sr + "<table border=\"0px\" ><tr valign=\"top\"><td align=\"left\" valign=\"top\"><a href=\"About.aspx\">" + dr.GetString(2) + "</a></td></tr><tr><td align=\"left\">"+"<img alt=\"\" src=\"Container/Images/aus.jpg\" />"+"</td></tr><tr valign=\"top\" ><td style=\"text-align:Justify;\" valign=\"top\">" + dr.GetString(3) + "</td></tr></table>";
            }
            con.Close();
            dr.Close();
            popUpDiv.InnerHtml = sr;

これは、divを表示するための私のjavascriptです

    <script type="text/javascript" language="javascript">
    function togglePopUp(div_id) {
        var el = document.getElementById(div_id);
        if (el.style.display == 'block') { el.style.display = 'none'; }
        else { el.style.display = 'block'; }
    }
    </script>
4

1 に答える 1

0

このソリューションでは、ajax と終了要求ハンドラーを使用して div を表示し、これを aspx ページに追加します。

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<script type="text/javascript" language="javascript"> 
 Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequestHandle);
 function endRequestHandle(sender, Args) {
        if (pbControl.name.toString() == "btnPopUp") {
        var el = document.getElementById(div_id);
        if (el.style.display == 'block') { el.style.display = 'none'; }
        else { el.style.display = 'block'; }                  
        }
</script>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
 <ContentTemplate>
  <asp:Button ID="btnPopUp" text="Pop Up a div box" runat="server" />
 </ContentTemplate>
</asp:UpdatePanel>

コードビハインド:

while (dr.Read())
 {
   sr = sr + "<table border=\"0px\" ><tr valign=\"top\"><td align=\"left\" valign=\"top\"><a href=\"About.aspx\">" + dr.GetString(2) + "</a></td></tr><tr><td align=\"left\">"+"<img alt=\"\" src=\"Container/Images/aus.jpg\" />"+"</td></tr><tr valign=\"top\" ><td style=\"text-align:Justify;\" valign=\"top\">" + dr.GetString(3) + "</td></tr></table>";
 }
con.Close();
dr.Close();
popUpDiv.InnerHtml = sr;
于 2012-06-29T16:59:14.053 に答える