Bootstrap alerte dans les événements de bouton sur asp.net

Comment pourrais-je faire un code qui, lorsque je clique sur un bouton sur asp.net, un message d'alerte de bootstrap ou boîte de message s'affiche?

protected void ButtonLogin_Click(object sender, EventArgs e)
    {
        //TextBoxEmail.Text = DateTime.Now.ToString();
        string UserName = TextBoxEmail.Text.Trim();
        string password = TextBoxPassword.Text.Trim();
        OracleConnection conn = new OracleConnection(strConnString);
        conn.Open();

        sql = "select password from userlogin where USERNAME = '" + UserName + "' and password ='" + password + "' ";
    cmd = new OracleCommand(sql, conn);


    //orada=new OracleDataAdapter(com.CommandText,conn);
    //cmd.CommandType = CommandType.Text;
    dr = cmd.ExecuteReader();
    //dr.Read();

    if (dr.HasRows)
    {
        Label1.Text = "";
        Response.Redirect("Details.aspx");
    }
    else
    {
        Label1.Text = "No data found...";
        conn.Close();
    }

   }

}

Ci-dessus, dans la partie else:

 else
         {
             Label1.Text = "No data found...";
             conn.Close();
         }

Lorsque le nom d'utilisateur et le mot de passe ne correspondent pas, je veux un bootstrap de l'alerte ou de la boîte de message apparaîtra sur le site: "le mot de passe n'est pas correct". Comment pourrais-je le faire?

InformationsquelleAutor AL AMIN | 2016-03-06

Pour cela, vous avez besoin de faire référence à l'amorçage des liens et jquery

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

Ensuite l'Ajouter à votre Chef de Section dans la Page Aspx:

 <style type="text/css">
        .messagealert {
            width: 100%;
            position: fixed;
             top:0px;
            z-index: 100000;
            padding: 0;
            font-size: 15px;
        }
    </style>
    <script type="text/javascript">
        function ShowMessage(message, messagetype) {
            var cssclass;
            switch (messagetype) {
                case 'Success':
                    cssclass = 'alert-success'
                    break;
                case 'Error':
                    cssclass = 'alert-danger'
                    break;
                case 'Warning':
                    cssclass = 'alert-warning'
                    break;
                default:
                    cssclass = 'alert-info'
            }
            $('#<%=ButtonLogin.ClientID %>').append('<div id="alert_div" style="margin: 0 0.5%; -webkit-box-shadow: 3px 4px 6px #999;" class="alert fade in ' + cssclass + '"><a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a><strong>' + messagetype + '!</strong> <span>' + message + '</span></div>');
        }
    </script>

Dans Cs Code

  protected void ShowMessage(string Message, MessageType type)
    {
        ScriptManager.RegisterStartupScript(this, this.GetType(), System.Guid.NewGuid().ToString(), "ShowMessage('" + Message + "','" + type + "');", true);
    }

Maintenant dans d'autre Partie l'appel de la fonction d'Erreur, dans le succès, aussi vous pouvez utiliser cette fonction en modifiant le type de Message

ShowMessage("Aww, password is wrong", MessageType.Error);

Chers Webruster, merci pour votre réponse. Pourriez-vous svp m'aider à comprendre ce que fait cette ligne signifie en jquery ' $('#<%=ButtonLogin.ClientID %>'
dans asp.net nous ne devrais pas donner le idname directement , lorsque les contrôles serveur sont convertis au format html qu'ils ont autre identifiant que vous avez reçu afin de afin de postuler que l'id, la mention ci-dessus va obtenir l'id après avoir converti le formulaire html
Merci beaucoup pour votre réponse. Comme je suis novice, je voudrais apprendre ce genre de conversion de la procédure, étape par étape, veuillez s'il vous plaît suggéré un lien ou d'une ressource.

InformationsquelleAutor Webruster

HTML (MasterPage):

<div class="MessagePanelDiv">
    <asp:Panel ID="Message" runat="server" Visible="False">
        <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
        <asp:Label ID="labelMessage" runat="server" />
    </asp:Panel>
</div>

ENUM:

public enum WarningType
{
    Success,
    Info,
    Warning,
    Danger
}

Le code-behind:

///<summary>
///Shows a message based of type and message
///</summary>
///<param name="message">Message to display</param>
///<param name="type">ENUM type of the message</param>

public void ShowMessage(string Message, WarningType type)
{
    //gets the controls from the page
    Panel PanelMessage = Master.FindControl("Message") as Panel;
    Label labelMessage = PanelMessage.FindControl("labelMessage") as Label;

    //sets the message and the type of alert, than displays the message
    labelMessage.Text = Message;
    PanelMessage.CssClass = string.Format("alert alert-{0} alert-dismissable", type.ToString().ToLower());
    PanelMessage.Attributes.Add("role", "alert");
    PanelMessage.Visible = true;
}

Utilisation:

ShowMessage("<strong> Error! </strong> Error message to show", WarningType.Danger);

Modifier

Classe CSS:

.MessagePanelDiv 
{
    position:fixed;
    left: 35%;
    top:15%;
    width:35%;
}

Javascript minuterie automatique de la suppression de l'alerte:

$(document).ready(function () {
    window.setTimeout(function () {
        $(".alert").fadeTo(1500, 0).slideUp(500, function () {
            $(this).remove();
        });
    }, 3000);
});

Sans MasterPage

 <div class="MessagePanelDiv">
   <asp:Panel ID="Message" runat="server" CssClass="hidepanel">
    <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
    <asp:Label ID="labelMessage" runat="server" />
   </asp:Panel>
 </div>

CSS:

.hidepanel {
   display: none;
 }

Le code-behind:

 labelMessage.Text = "Successfully updated."
 Message.CssClass = String.Format("alert alert-{0} alert-dismissable", Constants.WarningType.Success.ToString().ToLower())
 Message.Attributes.Add("role", "alert")

et le MessagePanelDiv classe?
.MessagePanelDiv { position:fixed; à gauche: 35%; top:15%; largeur:35%; }

InformationsquelleAutor hunteroooox

Une vieille question, mais pour ceux qui veulent juste une solution simple.

Vous devez avoir une page principale avec un ContentPlaceHolder avec l'id de 'main'

Créer cette classe:

public class BootstrapPage : Page
{
    public enum WarningType
    {
        Success,
        Info,
        Warning,
        Danger
    }

    public void ShowNotification(string message, WarningType type)
    {
        var mainContentHolder = Master.FindControl("main") as ContentPlaceHolder;
        Panel notificationPanel = new Panel();
        {
            LiteralControl closeButton = new LiteralControl();
            closeButton.Text = "<a href=\"#\" class=\"close\" data-dismiss=\"alert\" aria-label=\"close\">&times;</a>";

            Label notificationMessage = new Label() { Text = message };

            notificationPanel.Controls.Add(closeButton);
            notificationPanel.Controls.Add(notificationMessage);
        }
        notificationPanel.CssClass = string.Format("alert alert-{0} alert-dismissable", type.ToString().ToLower());
        notificationPanel.Attributes.Add("role", "alert");

        mainContentHolder.Controls.AddAt(0, notificationPanel);
    }
}

Ensuite faire votre WebForm inheirt de BootstrapPage au lieu de Système.Web.L'INTERFACE utilisateur.Page

Appel chaque fois que nécessaire:

 ShowNotification("Error: You can't do that!", WarningType.Error);

J'apprécie vraiment votre morceau de code et il fonctionne tout à fait. mais j'ai quelques questions si cela ne vous dérange pas. Elle affecte notre application en Héritant Webform de BoostrapPage ? et comment Auto Remove la Alert après quelques secondes. Merci de m'aider ici

InformationsquelleAutor Damon Earl

Vous devez vous connecter pour publier un commentaire.