Show succes message from ajax

Question

I have a question, So I create a sistem that update in database a row when onChange a select box. All goes well, but I want to drop a succes message if update was with succes.

My view :

<form action="" id="updateStatus" method="post">
    <select id="statusSelect"
            name="{{ gift.id_instant_gagnant }}"
            class="form-control"
            onChange="updateCadeauStatus({{ gift.id_instant_gagnant }})">
            {% for key,statut in form_logistique.statut.choices %}
                <option value="{{ key }}"
                    {% if gift.etat == key %}selected="selected"{% endif %}>
                    {{ statut }}
                 </option>
            {% endfor %}
   </select>
</form>
 <script>
    function updateCadeauStatus(id) {
        var id = id;
        var selectedName = $("#statusSelect option:selected").val();
        var url_deploy = 'http:localhost/updateStatus'
        console.log(id);
        console.log(selectedName);
        $.ajax({
            url: url_deploy,
            type: "POST",
            async: true,
            data: { id_cadeau:id, id_status:selectedName}
        });
    }
</script>

The controller :

public function updateStatus(){
    $iGiftId    = $_POST['id_cadeau'];
    $iNewStatus = $_POST['id_status'];
    $bUpdate = $this->updateStatusByGiftId($iGiftId, $iNewStatus);
    return $this->render('logistique.twig');

}

The model :

public static function updateStatusByGiftId($iGiftId, $iStatusId){
    $request = sprintf( ' UPDATE `%s` set etat = %d WHERE id = %d ', $table, $iStatusId, $iGiftId);

    return Mysqli::query($request, $database);
}

So everything goes well but I want to drop a message after every update, too be displayed in the view. Please help me!!! Thx in advance, sorry for my english.

possible duplicate of [How to return the response from an asynchronous call?](http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call) — Aaron D, May 15 '15 at 13:22

score 3 · Answer 1 · answered May 15 '15 at 13:10

3

$.ajax({
            url: url_deploy,
            type: "POST",
            async: true,
            data: { id_cadeau:id, id_status:selectedName},
            success : function(data){
                console.log('success');
            },
            error: function(){
                console.log('error');
            }
        });

answered May 15 '15 at 13:10

Mohamed-Yousef

23,946
3
19
28

But it's not possible to show the messageg in the view? – TanGio May 15 '15 at 13:11
@Gigel after echo out data from url_deploy .. you can console.log(data); it will output your data echoed – Mohamed-Yousef May 15 '15 at 13:13
1

So, I want to show in my logistique.twig view the message for example : "Update succes" – TanGio May 15 '15 at 13:14
@Gigel yes .. by that way your data will be "Update succes" in javascript – Mohamed-Yousef May 15 '15 at 13:17

score 3 · Answer 2 · answered May 15 '15 at 13:17

You can drop the response of the check file on ajax.

$.ajax({
    url: url,
    type: "POST",
    ...
    success: function(response){
        window.alert(response);
    }
})

To be more specific, if you want to give a message only when you successfully changed the row. Modify the validation file (url:) and print a messagge only when you had success..

There are other ways to do that..

You can print a "message id" and get it with the script and drop a message:

$.ajax({
    url: url,
    type: "POST",
    ...
    success: function(response){
        if(response == '1'){
            window.alert('Successfully changed!!');
        }else if(response == '0'){
            $("#foo").html("Error, not changed :(");
        }else{
            ------ something else ------
        }
    }
})

Hope I could help !

score 3 · Answer 3 · 2015-05-15T13:32:11.130

Im not sure if you have your response in another file. Cuz your response now is in the var data in the line with the code:
}).done(function(data){

$.ajax({
  url: url_deploy,
  type: "POST",
  async: true,
  data: { id_cadeau:id, id_status:selectedName}
}).done(function(data){
  $("[SuccesDiv]").append("[Succes MSG]");
});

The text between the [ - ] is ment to put there your own element or data.

[EDIT]

I did'nt look good...

You are not looking when it is changed.
To do that, do this:

$("select").on("change", function(){
  $.ajax({
    url: url_deploy,
    type: "POST",
    async: true,
    data: { id_cadeau:id, id_status:selectedName}
  }).done(function(data){
    $("[SuccesDiv]").append("[Succes MSG]");
  });
});

Show succes message from ajax

3 Answers3