ok, así que sé que esto de ajax funciona, pero me parece que no puede entender por qué es que no se han presentado aquí.

<script type="text/javascript">
$(function(){
    $('input[type=submit]').click(function(){
        $.ajax({
            type: "POST",
            url: "postitem.php",
            data: $("#myform").serialize(),
            beforeSend: function(){
                $('#result').html('<img src="loading.gif" />');
            },
            success: function(data){
                $('#result').html(data);
            }
        });
    });
});

presentar el formulario

<form action="" method="post" onsubmit="return false;" id="myform">

botón enviar

<input type="hidden" value="Post" name="submit" /> 
<button type="submit" title="Done" style="height:33px; width:50px">
    <img src="../../css/images/plus_25.png" />
</button>

estoy bastante algo está mal con el botón, pero quiero mantener la forma en que el botón es porque un montón de mis otras formas de uso de este mismo botón, gracias si me puede explicar por qué haga clic en este botón de enviar no hace nada.

  • Usted no tiene un input[type=submit] en su forma. usted tiene un button[type=submit] y un input[type=hidden]
  • así que cambie input[type=enviar] botón[type=submit] ?
  • <button type="submit"> no tiene sentido. type sólo existe en <input>.
  • El type atributo es válido para <button>: developer.mozilla.org/en-US/docs/Web/HTML/Element/…
InformationsquelleAutor Sickest | 2013-12-04

3 Comentarios

  1. 2

    No todos los navegadores interpretan una click conectado a un botón de enviar como de enviar el formulario para que efectivamente son simplemente negar el clic del botón.

    Prevenir el envío de un formulario preferiblemente debe ser capturado por el que adjunta la submit controlador de la <form> cuando usted tiene un <input type="submit"> o <button type="submit> así que esta es la mejor manera de asegurar el éxito:

    jQuery

    $(function(){
        $('#myform').on('submit', function(e){
    
            //prevent native form submission here
            e.preventDefault();
    
            //now do whatever you want here
            $.ajax({
                type: $(this).attr('method'), //<-- get method of form
                url: $(this).attr('action'), //<-- get action of form
                data: $(this).serialize(), //<-- serialize all fields into a string that is ready to be posted to your PHP file
                beforeSend: function(){
                    $('#result').html('<img src="loading.gif" />');
                },
                success: function(data){
                    $('#result').html(data);
                }
            });
        });
    });

    HTML

    <form action="postitem.php" method="POST" id="myform">
        <input type="hidden" value="Post" name="submit" /> 
        <button type="submit" title="Done" style="height:33px; width:50px">
            <img src="../../css/images/plus_25.png" />
        </button>
    </form>
    • Usted se olvidó de paréntesis. e.preventDefault()
    • De acuerdo, esto es una mejor práctica. Pero que no responde a la OPs específico de la pregunta de por qué el código original de la falla.
    • ¿me puede mostrar cómo el código debería ser igual que con el correo.preventdefault();
    • Claro que puede, está en el código que me dio anteriormente, ¿usted tiene preguntas específicas acerca de él?
    • obtengo error de sintaxis @ $(‘#myform’).en(‘enviar’. function(e){
    • Mi mal he utilizado un período en lugar de una coma, la nueva actualización refleja: $('#myform').on('submit', function(e){

  2. -1

    intente esto :

    <script type="text/javascript">
    $(function(){
        $('input[type=submit]').click(function(e){
    e.preventDefault(); //prevent the browser's default action of submitting 
            $.ajax({
                type: "POST",
                url: "postitem.php",
                data: $("#myform").serialize(),
                beforeSend: function(){
                    $('#result').html('<img src="loading.gif" />');
                },
                success: function(data){
                    $('#result').html(data);
                }
            });
        });
    });
    • espera, ¿por qué hacer esto exactamente? soy nuevo en el ajax
    • esto evitará que el navegador predeterminado de acción de la presentación y se va a utilizar ajax para enviar en su lugar

Dejar respuesta

Please enter your comment!
Please enter your name here