javascript - Show message when Ajax function succeeds - Stack Overflow

admin管理员组

文章数量:1313347

I would like to display a message when an Ajax function has succeeded but being new to Ajax I am struggling

function save_pos_reasons()
  {
    $.ajax({
    type: "POST",
    url: "save_pos_reasons.php",
    data: $('#add_positioning').serialize(),
    success: function() {
       $("#successMessage").show();
        }
    });
 }


<div id="successMessage"> It worked </div>

At the moment this does nothing although the actual function is working

I would like to display a message when an Ajax function has succeeded but being new to Ajax I am struggling

function save_pos_reasons()
  {
    $.ajax({
    type: "POST",
    url: "save_pos_reasons.php",
    data: $('#add_positioning').serialize(),
    success: function() {
       $("#successMessage").show();
        }
    });
 }


<div id="successMessage"> It worked </div>

At the moment this does nothing although the actual function is working

• javascript
• ajax
• jquery

Share Improve this question Follow edited Aug 11, 2013 at 14:31 MrCode 64.5k1010 gold badges9292 silver badges113113 bronze badges asked Aug 11, 2013 at 14:19 tatty27tatty27 1,55455 gold badges3737 silver badges7474 bronze badges 2

• Looks OK to me. Are you hiding #successMessage by default with CSS? When you say the function is working, does that mean that the success function fires or just that the ajax call fires? Maybe your ajax call is failing. – MrCode Commented Aug 11, 2013 at 14:22
• no, there is no css attributed to the message, perhpas thats where I'm going wrong? – tatty27 Commented Aug 11, 2013 at 14:23

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

The message div needs to be hidden by default, otherwise .show() will not do anything if it's already visible.

CSS:

#successMessage {
    display:none;
}

Or inline:

<div id="successMessage" style="display:none;"> It worked </div>

Try this simple code . Only if the ajax is working the message will be displayed

$.ajax({
        type: "POST",
        url: "save_pos_reasons.php",
        data: $('#add_positioning').serialize(),
        success: function() {
           $("#successMessage").html("It worked");
            }
        });

the html

<div id="successMessage"> </div>

Hope this helps. Thank you

本文标签： javascriptShow message when Ajax function succeedsStack Overflow