none
como hacer que al presionar un boton la pagina no haga un postback RRS feed

Respuestas

  • Una forma de evitar que un botón haga un postback es conectarle en lado cliente un pedacito de javascript a su evento click (si es un botón de asp.net el atributo correspondiente sería el ClientClick, que es distinto del Click que se dispara en lado servidor en lugar de cliente). Si ese javascript devuelve false, entonces no se hace el postback. Por supuesto en ese caso el botón "no hace nada", así que si quieres que haga algo, ese algo hay que añadirlo dentro del javascript.
    jueves, 28 de julio de 2016 20:03

Todas las respuestas

  • Una forma de evitar que un botón haga un postback es conectarle en lado cliente un pedacito de javascript a su evento click (si es un botón de asp.net el atributo correspondiente sería el ClientClick, que es distinto del Click que se dispara en lado servidor en lugar de cliente). Si ese javascript devuelve false, entonces no se hace el postback. Por supuesto en ese caso el botón "no hace nada", así que si quieres que haga algo, ese algo hay que añadirlo dentro del javascript.
    jueves, 28 de julio de 2016 20:03
  • hola

    podrias ayudarte con el UpdatePanel para que la accion del boton solo actue en una seccion del codigo

    Información general sobre el control UpdatePanel

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    jueves, 28 de julio de 2016 22:37
  • Hola.

    Puedes meter un asp:panel y dentro de él meter toda la funionalidad que desees, y al momento de ejecutar únicamente se refrescará ese panel sin recargar completamente la pagina 

    Te dejo un ejemplo, espero te funcione

    1. Creamos el formulario en HTML

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    
    <div id="contact_form">
    <form>
        <fieldset>
          <label id="name_label" for="name">Name</label>
          <input id="name" class="text-input" name="name" size="30" type="text" />
          <label id="name_error" class="error" for="name">This field is required.</label>
     
          <label id="email_label" for="email">Return Email</label>
          <input id="email" class="text-input" name="email" size="30" type="text" />
          <label id="email_error" class="error" for="email">This field is required.</label>
     
          <label id="phone_label" for="phone">Return Phone</label>
          <input id="phone" class="text-input" name="phone" size="30" type="text" />
          <label id="phone_error" class="error" for="phone">This field is required.</label>
     
          <input id="submit_btn" class="button" name="submit" type="submit" value="Send" />
        </fieldset>
      </form></div>

    2. Agregamos algo de jQuery

    1
    2
    3
    4
    5
    
    $(function() {
        $(".button").click(function() {
          // validate and process form here
        });
      });

    Esta función carga los eventos una vez que el documento HTML esta listo, similar a document.ready. Por supuesto debes descargar la líbreria jQuery 

    3. Se escribe algunas reglas de validación para el formulario en jQuery.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    
     $(function() {
        $('.error').hide();
        $(".button").click(function() {
          // validate and process form here
     
          $('.error').hide();
      	  var name = $("input#name").val();
      		if (name == "") {
            $("label#name_error").show();
            $("input#name").focus();
            return false;
          }
      		var email = $("input#email").val();
      		if (email == "") {
            $("label#email_error").show();
            $("input#email").focus();
            return false;
          }
      		var phone = $("input#phone").val();
      		if (phone == "") {
            $("label#phone_error").show();
            $("input#phone").focus();
            return false;
          }
     
        });
      });

    4. Se procesa el formulario con la función AJAX de jQuery y se retorna un mensaje de usuario.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    
    var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone;
      //alert (dataString);return false;
      $.ajax({
        type: "POST",
        url: "bin/process.php",
        data: dataString,
        success: function() {
          $('#contact_form').html("<div id='message'></div>");
          $('#message').html("<h2>Contact Form Submitted!</h2>")
          .append("<p>We will be in touch soon.</p>")
          .hide()
          .fadeIn(1500, function() {
            $('#message').append("<img id='checkmark' src='images/check.png' />");
          });
        }
      });
      return false;

    viernes, 29 de julio de 2016 5:50