Update sql No Reload with a click on the Link

1

I would like that in the script below when we clicked the link it did the update in sql without the reload. it was made to perform through a submit in one more I would like it to be through a link even more I did not do. how can I do this?

  <script type="text/javascript"  
  src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><scripttype="text/javascript">
  jQuery(document).ready(function(){
    jQuery('#ajax_form').submit(function(){
        var dados = jQuery( this ).serialize();

        jQuery.ajax({
            type: "POST",
            url: "update.php",
            data: dados,
            success: function( data )
            {
                alert( data );
            }
        });

        return false;
    });
    });
    </script>

Link to do the update

   <a href="#" id="<?php echo $id?>">Mudar</a> // Pagando o id da linha

update.php

  <?php
  include"../../../../../clientes/assets/config.php";
  $sql = "UPDATE notificacoes_geral SET status_lido='1' AND id= $id ";
  $resultado = mysql_query($sql) or die( mysql_error());

? >

    
asked by anonymous 17.10.2015 / 21:32

2 answers

1

If I understand correctly you want to send data via ajax no longer in submit of a form but when an anchor is clicked.

In this case you need to change the selectors in jQuery. Changing this to point to form and the selector to which the event observer should work together.

Test like this:

jQuery('#<?php echo $id?>').on('click', function(){
    var dados = jQuery('#ajax_form').serialize();

    jQuery.ajax({
        type: "POST",
        url: "update.php",
        data: dados,
        success: function( data )
        {
            alert( data );
        }
    });

    return false;
});

Note: I used in the selector the same PHP that generated the anchor ID that you want <a href="#" id="<?php echo $id?>">Mudar</a> . But I do not know what your PHP is, and if that's not easy, use a selector with other references to the DOM to find this a element.

    
17.10.2015 / 21:37
1

Good afternoon Fabio. Well, I took the liberty of making some minor changes that I believe are a bit better.

In the code below, I left the tag <a> out of the form, but you can leave it inside without any problems.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><scripttype="text/javascript">
$(document).ready(function(){
    $("body").delegate(".btnUpdate", "click", function(e){
        e.preventDefault() //Para anular o comportamento padrão do link
        var id = $(this).attr("id");
        var dados = $("#ajax_form").serializeArray();

        $.ajax({
            url: "update.php",
            type: "POST",
            data: dados,
            success: function (data, textStatus, jqXHR) {
                                alert(data)
                                console.log(data);
            },
            error: function (jqXHR, textStatus, errorThrown) {
                                alert(jqXHR)
                                console.log(jqXHR);
            }

        });

    })

});


</script>

<?php $id = 1; ?>

<form id="ajax_form">
    <input type="hidden" id="id" name="id" value="<?=$id?>" />
    <input type="text" id="nome" name="nome" />
    <input type="text" id="email" name="email" />
</form>

<a href="#" id="<?php echo $id?>" class="btnUpdate">Mudar</a>

Note that I created the .btnUpdate class, and when I click the link with that class, I retrieve the id value through the .attr () function. Also note that I added a hidden field in the form to get the id value, so I can serialize the id along with the other form fields.

You just need to define how you will handle the return of the update.php processing. Just replace the alert (data) and console.log () with your business rule.

NOTE: I set the $ id on the hand just for example.

I hope I have helped!

    
25.01.2016 / 20:14