如何检索数据库弹出模式后点击jquery

How to retrieve database to popup modal jquery after click?

本文关键字:模式 jquery 数据库 何检索 检索      更新时间:2023-09-26

我是新的jquery,我正在寻找从数据库检索,并在点击按钮后显示在一个弹出式模式。我正在寻找的主要场景是显示特定用户发送给另一个用户的所有消息。每个按钮都有消息标题。我点击一个按钮后,一个模态弹出将显示和消息内容将在其中。我现在得到的是:按钮显示与消息标题,内容是隐藏的。

. aspx:

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
<script type="text/javascript">
    function openMessageContent(obj) {
        var contentMessage = obj.innerHTML;
        $("#showContent").dialog("option", "title", contentMessage);
        initializeMap(contentMessage);
        $("#showContent").dialog("open");
    }
    $(function () {
        $("#showContent").dialog({
            height: 480,
            width: 450,
            modal: true,
            autoOpen: false,
            show: {
                effect: "fade",
                duration: 500
            },
            hide: {
                effect: "fade",
                duration: 500
            }
        });
    });
</script>
<div class="IncomeMessages">
    <div class="IncomeMessages_Header">Income Messages</div>
    <div id="IncomeMessagesPH" class="IncomeMessagesPH" runat="server"></div>
</div>
<div class="SentMessages">
    <div class="SentMessages_Header">Sent Messages</div>
    <div id="SentMessagesPH" class="SentMessagesPH" runat="server"></div>
</div>
<div id="showContent" runat="server">
</div>
</asp:Content>

.aspx.cs

public partial class Private_User_Social_MessageList : System.Web.UI.Page
{
    DBservices DBS = new DBservices();
    protected void Page_Load(object sender, EventArgs e)
    {
        List<TblMessage> ListSMessages = DBS.getSentMessages(User.Identity.Name.ToString());
        int countMessages = 0;
        foreach (TblMessage MESIndex in ListSMessages)
        {
            string _SentMessage = MES_output(MESIndex);
            AjaxControlToolkit.HoverExtender TempHover = new AjaxControlToolkit.HoverExtender();
            TempHover.TargetControlID = MESIndex.SendEmail;
            TempHover.ID = MESIndex.Mnum.ToString();
            Label MessContent = new Label();
            MessContent.Text = MESIndex.Content;
            Button tempApprove = new Button();
            tempApprove.Text = MESIndex.Subject;
            tempApprove.CssClass = "ApproveBTN";
            SentMessagesPH.Controls.Add(new LiteralControl("<div style='height:32px'>"));
            SentMessagesPH.Controls.Add(new LiteralControl("<div id='Message" + countMessages + "' style='height:32px;visibility:hidden;display:none'>"));
            SentMessagesPH.Controls.Add(MessContent);
            SentMessagesPH.Controls.Add(new LiteralControl("</div>"));
            SentMessagesPH.Controls.Add(tempApprove);
            SentMessagesPH.Controls.Add(new LiteralControl("</div>"));
            string PresentContentDIV = "<div id='MESIContent'>";
            LiteralControl PresentContent = new LiteralControl(PresentContentDIV);
            PresentContentDIV = "<a 'href='#' onclick='openMessageContent(MessContent); return false;'>";
            PresentContentDIV += "</a>";
            PresentContentDIV += "<p> " + MessContent.Text + " </p>";
            PresentContentDIV += "</div>";
            PresentContent = new LiteralControl(PresentContentDIV);
            showContent.Controls.Add(PresentContent);
            countMessages++;
        }
    }
    protected string MES_output(TblMessage _tempMES)
    {
        string ans = _tempMES.SendEmail;
        return ans;
    }

页面重新加载时需要显示消息吗?我认为最好的方法来做你的主要情况是工作与ajax调用一些web方法检索json。这样你就不会重载整个页面了。

https://api.jquery.com/jQuery.ajax/

看这个例子

http://www.aspsnippets.com/Articles/Retrieve-data-from-Database-and-display-on-page-using-jQuery-AJAX-in-ASPNet.aspx