How to Post a method by clicking a button type=button

Asked

Viewed 1,280 times

1

I’m making an application where when I click a button I have to send an email. I got my page one input type=Text and a button type="button" that with css got like this ->.
I need that when I press this arrow, an email be sent as it is in the code, and in the body of email also be sent what is in the input text. If the input text is empty, it must error and do nothing.

I click the button but do nothing. What may be going wrong?

Code I have for now:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Cegos Analytics | Lockscreen</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <!-- Bootstrap 3.3.5 -->
  <link rel="stylesheet" href="../../bootstrap/css/bootstrap.min.css">
  <!-- Font Awesome -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
  <!-- Ionicons -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css">

  <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
</head>
<body class="hold-transition lockscreen">
<!-- Automatic element centering -->
<div class="lockscreen-wrapper">
  <div class="lockscreen-logo">
   <img src="/Images/^082594892CD6A1E2D2CF4B7361463D84FEF2B4C6FEBD2707B5^pimgpsh_fullsize_distr.png" alt="Cegos Logo">
  </div>
    <br />
  <!-- User name -->
  <div class="lockscreen-name"></div>

  <!-- START LOCK SCREEN ITEM -->
  <div class="lockscreen-item">
    <!-- lockscreen image -->
    <div class="lockscreen-image">
      <img src="/Images/locked.jpg" alt="Locked Screen">
    </div>
    <!-- /.lockscreen-image -->

    <!-- START LOCK SCREEN ITEM -->
  <div class="lockscreen-item">
    <!-- lockscreen image -->
    <div class="lockscreen-image">
      <img src="/Images/locked.jpg" alt="Locked Screen">
    </div>
    <!-- /.lockscreen-image -->
</div>

    <!-- lockscreen credentials (contains the form) -->
    <form class="lockscreen-credentials">
      <div class="input-group">
        <input type="Text" class="form-control" placeholder="Username">


    <%@ Import Namespace="System.Net.Mail" %> 
    <%@ Import Namespace="System.Net" %>
    <%@ Import Namespace="System.Net" %>
    <%@ Import Namespace="System.IO" %>
    <%@ Import Namespace="System.Text" %>

  <script runat="server">

      public void SendEmail()
      {


          try
          {

              SmtpClient cliente = new SmtpClient();
              cliente.Host = "smtp.sapo.pt";
              cliente.EnableSsl = true;
              cliente.Credentials = new NetworkCredential("[email protected]", "cegoc123456");

              MailMessage mensagem = new MailMessage();
              mensagem.Sender = new MailAddress("[email protected]");
              mensagem.From = new MailAddress("[email protected]");
              mensagem.To.Add(new MailAddress("[email protected]"));
              mensagem.Subject = "Pedido de suporte Plataforma Cegos Analytics";
              mensagem.Body = "Recebeu um pedido de suporte da  Plataforma Cegos Analytics para recuperação de password referente ao utilizador:";
              mensagem.IsBodyHtml = false;
              mensagem.Priority = MailPriority.High;

              cliente.Send(mensagem);
          }
          catch (Exception ex)
          {
              Response.Write("******EMAIL FAILED. PLEASE CONTACT YOUR ADMINISTRATOR**** See log file in C:\\Logs");
              CreateLogFiles(ex.Message);
              ErrorLog("C:\\Logs\\log.txt", ex.Message);
              Response.Write(ex.Message);

          }


      }

</script>  


        <div class="input-group-btn">
          <button type="button" class="btn" onclick="SendEmail()" runat="server"><i class="fa fa-arrow-right text-muted"></i></button>
         </div>
      </div>
    </form>
    <!-- /.lockscreen credentials -->

  </div>
  <!-- /.lockscreen-item -->
  <div class="help-block text-center">
    Enter your username to retrieve your session
  </div>
  <div class="text-center">
    <a href="../Default.aspx">Or sign in as a different user</a>

What I have essentially is a pa gina recoverpassword.aspx where I have this:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Cegos Analytics | Lockscreen</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <!-- Bootstrap 3.3.5 -->
  <link rel="stylesheet" href="../../bootstrap/css/bootstrap.min.css">
  <!-- Font Awesome -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
  <!-- Ionicons -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="../../dist/css/AdminLTE.min.css">

  <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
</head>
<body class="hold-transition lockscreen">
<!-- Automatic element centering -->
<div class="lockscreen-wrapper">
  <div class="lockscreen-logo">
   <img src="/Images/^082594892CD6A1E2D2CF4B7361463D84FEF2B4C6FEBD2707B5^pimgpsh_fullsize_distr.png" alt="Cegos Logo">
  </div>
    <br />
  <!-- User name -->
  <div class="lockscreen-name"></div>

  <!-- START LOCK SCREEN ITEM -->
  <div class="lockscreen-item">
    <!-- lockscreen image -->
    <div class="lockscreen-image">
      <img src="/Images/locked.jpg" alt="Locked Screen">
    </div>
    <!-- /.lockscreen-image -->

    <!-- START LOCK SCREEN ITEM -->
  <div class="lockscreen-item">
    <!-- lockscreen image -->
    <div class="lockscreen-image">
      <img src="/Images/locked.jpg" alt="Locked Screen">
    </div>
    <!-- /.lockscreen-image -->
</div>

    <!-- lockscreen credentials (contains the form) -->
    <form class="lockscreen-credentials" action="RecoverPassword.aspx" method="post">
      <div class="input-group">
         <input id='user' type="Text" class="form-control" placeholder="Username">    
    <div class="input-group-btn">
              <button id='enviar' type="submit" class="btn"><i class="fa fa-arrow-right text-muted"></i></button>
         </div>

     </div>
      </div>
    </form>
    <!-- /.lockscreen credentials -->

  </div>
  <!-- /.lockscreen-item -->
  <div class="help-block text-center">
    Enter your username to retrieve your session
  </div>
  <div class="text-center">
    <a href="../Default.aspx">Or sign in as a different user</a>
  </div>
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
  <%--  <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />--%>
    <br />
  <div class="lockscreen-footer text-center">
        <p style="height: 42px" align="center">&copy; <%: DateTime.Now.ToShortDateString() %> - <strong>Cegos Elearning Reports</strong>
  </div>
</div>
<!-- /.center -->

<!-- jQuery 2.2.0 -->
<script src="../../plugins/jQuery/jQuery-2.2.0.min.js"></script>
<!-- Bootstrap 3.3.5 -->
<script src="../../bootstrap/js/bootstrap.min.js"></script>    

<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script>

<script type="text/javascript">

    $("#enviar").click(function () {
               @SendEmail();//Insira aqui o código para chamar o sender email.
    });
</script>



            </form>

            </body>

</html>

and I have on my own page a class recoverpasssword and it defines the method sendemail() that has the code to send email. When I click the button on the email page it does not post or send the mail. Can you please help me? Sorry for my mistakes

  • Your images are broken. Try uploading again.

1 answer

1

The problem is that you are trying to call an ASP function in the event OnClick() Javascript. One does not see the other because ASP runs on the server and Javascript runs on the user’s browser.

Suggestion

Modify the type of the button element <button type="button"..., defining with the type Submit <button type="submit"...

This topic can be interesting to know more: Button element submitting form. How to disable?

Also set the attribute action of the element <form>

<form class="lockscreen-credentials" action="pagina.aspx" method="post">

The.Asp page file is where you should have the script you posted

 public void SendEmail()
  {


      try
      {

          SmtpClient cliente = new SmtpClient();
          cliente...

Runat=server

If you want to use with attribute runat="server":

<button type="button" class="btn" onclick="SendEmail()" runat="server">

Exchange for:

<asp:Button id="SendEmail" runat="server" UseSubmitBehavior="false" EnableViewState="false" class="btn" onclick="SendEmail">
  • Already modei but still does not execute the code or send the email.

  • guy does post but is not sending email no.

  • That’s another problem. The main question was to do Ubmit, already solved. So there’s nothing more to comment on. Avoid asking several things in a single topic. Ask one question and solve it. When you have another question / problem, open a new topic. Read the rules of the site: http://answall.com/tour.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.