How dsiplay alert message after saving data using Jquery

Question

Actually i got alert message display before saving data so please help me out

below my code is there

      for (var i = 0; i < rows_count; i++) {
                var count = 0;
                $.ajax({
                    type: "POST", url: "Default.aspx/update_extraHoursWorked", cache: false, data: "{'empID':'" + $("#emp_id" + i).text() + "','emp_code': '" + $("#emp_code" + i).text() + "','emp_category':'" + $("#emp_category" + i).text() + "','g1': '" + $("#txtgen_Three" + i).val() + "','f1': '" + $("#txtfirst_Three" + i).val() + "','s1': '" + $("#txtsecond_Three" + i).val() + "','t1': '" + $("#txtthrid_Three" + i).val() + "','g2': '" + $("#txtgen_Four" + i).val() + "','f2': '" + $("#txtfirst_Four" + i).val() + "','s2': '" + $("#txtsecond_Four" + i).val() + "','t2': '" + $("#txtthrid_Four" + i).val() + "','g3': '" + $("#txtgen_Five" + i).val() + "','f3': '" + $("#txtfirst_Five" + i).val() + "','s3': '" + $("#txtsecond_Five" + i).val() + "','t3': '" + $("#txtthrid_Five" + i).val() + "','contracortName': '" + $('#ddlContractorNames>option:selected').text() + "'}", contentType: "application/json; charset=utf-8", dataType: "json",
                    success: function (data) {  }, error: function (e) { alert('Error, Update att.'); }

                });
            } enableLastTwoDays(true);

                alert('Saved Successfully');


        }

What else you want to do inside success block other than alert? — Norlihazmey Ghazali, Oct 16 '15 at 01:50
hi, Actually i need alert message will display after completion of rowcount if we put inside success block every time alert message will come.Thank u. — durga, Oct 16 '15 at 05:55

lordvcs · Answer 1 · 2015-10-15T06:51:20.697

Try this, the alert should be within the success function, which is called if the ajax request was successful. You can also get the response data from server within this the success function. Try console.log(data) to display data in the browser console if data is returned from the server.

      for (var i = 0; i < rows_count; i++) {
                var count = 0;
                $.ajax({
                    type: "POST", url: "Default.aspx/update_extraHoursWorked", cache: false, data: "{'empID':'" + $("#emp_id" + i).text() + "','emp_code': '" + $("#emp_code" + i).text() + "','emp_category':'" + $("#emp_category" + i).text() + "','g1': '" + $("#txtgen_Three" + i).val() + "','f1': '" + $("#txtfirst_Three" + i).val() + "','s1': '" + $("#txtsecond_Three" + i).val() + "','t1': '" + $("#txtthrid_Three" + i).val() + "','g2': '" + $("#txtgen_Four" + i).val() + "','f2': '" + $("#txtfirst_Four" + i).val() + "','s2': '" + $("#txtsecond_Four" + i).val() + "','t2': '" + $("#txtthrid_Four" + i).val() + "','g3': '" + $("#txtgen_Five" + i).val() + "','f3': '" + $("#txtfirst_Five" + i).val() + "','s3': '" + $("#txtsecond_Five" + i).val() + "','t3': '" + $("#txtthrid_Five" + i).val() + "','contracortName': '" + $('#ddlContractorNames>option:selected').text() + "'}", contentType: "application/json; charset=utf-8", dataType: "json",
                    success: function (data) { alert('Saved Successfully'); }, error: function (e) { alert('Error, Update att.'); }

                });
            } enableLastTwoDays(true);




        }

The modified code is below, the below code is to give u an idea, ideally this code should not be used in your production site as such. Here for every row that is successfully saved the save function is called which inturn increases the count of the count_successful. After the loop is completed the count of count_successful is checked if its equal to the row count

var count_successful = 0;
      for (var i = 0; i < rows_count; i++) {
                var count = 0;
                $.ajax({
                    type: "POST", url: "Default.aspx/update_extraHoursWorked", cache: false, data: "{'empID':'" + $("#emp_id" + i).text() + "','emp_code': '" + $("#emp_code" + i).text() + "','emp_category':'" + $("#emp_category" + i).text() + "','g1': '" + $("#txtgen_Three" + i).val() + "','f1': '" + $("#txtfirst_Three" + i).val() + "','s1': '" + $("#txtsecond_Three" + i).val() + "','t1': '" + $("#txtthrid_Three" + i).val() + "','g2': '" + $("#txtgen_Four" + i).val() + "','f2': '" + $("#txtfirst_Four" + i).val() + "','s2': '" + $("#txtsecond_Four" + i).val() + "','t2': '" + $("#txtthrid_Four" + i).val() + "','g3': '" + $("#txtgen_Five" + i).val() + "','f3': '" + $("#txtfirst_Five" + i).val() + "','s3': '" + $("#txtsecond_Five" + i).val() + "','t3': '" + $("#txtthrid_Five" + i).val() + "','contracortName': '" + $('#ddlContractorNames>option:selected').text() + "'}", contentType: "application/json; charset=utf-8", dataType: "json",
                    success: function (data) { count_successful = count_successful+1; }, error: function (e) { alert('Error, Update att.'); }

                });
            } enableLastTwoDays(true);

        }

if(count_successful == rows_count){
   alert('Saved all rows successfully');
 }

Thank You, but it display alert message for every row but i need alert message after completion of all rows — durga, Oct 15 '15 at 06:13
@durga every ajax request that is successful will fire the success function and ghence the alert, if u want the alert to display after all the rows, call the alert after checking and making sure all the ajax requests were successsfull. I will modify my above code to give u the concept — lordvcs, Oct 15 '15 at 06:40
You cant. As ajax is an asynchronous function, then you will get undefined for successCount outside success block. Consider read this http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call — Norlihazmey Ghazali, Oct 15 '15 at 08:04
Hi,Thank u for sharing your ans but count_successful is not increased please help me — durga, Oct 15 '15 at 10:30
Hi, What ever we given in sucess function its not working so count is not increased — durga, Oct 15 '15 at 11:43

score 0 · Answer 2 · answered Oct 15 '15 at 06:13

You can count every success and finally alert ..

count_success= 0;
for (var i = 0; i < rows_count; i++) {
                    //---
                    //--
                        success: function (data) { count_success++; },
                        error: function (e) { alert('Error, Update att.'); }

                    });
                } enableLastTwoDays(true);

                    alert(count_success +'Record Saved Successfully');


            }

Hi,Thank u for sharing your ans but count_success is not increased please help me — durga, Oct 15 '15 at 10:31

shiva kumar · Answer 3 · 2015-10-16T06:23:20.653

0

Have a hidden field respective to this function and increment/change the value of it on each success. Finally if the successCount value equals the total rows count, then the alert is shown.

function someFunction() {

        for (var i = 0; i < rows_count; i++) {
            var count = 0;
            $.ajax({
                type : "POST",
                url : "Default.aspx/update_extraHoursWorked",
                cache : false,
                data : "{}",
                contentType : "application/json; charset=utf-8",
                dataType : "json",
                success : function(data) {
                $('#successCountID').val(i); // changed i+1 to i
                },
                error : function(e) {
                    alert("Error, Update att.");
                }

            });
        }
        enableLastTwoDays(true);
    $(document).ajaxStop(function() {
        // place code to be executed on completion of last outstanding ajax call here
        var count = $('#successCountID').val();
        if (count == rows_count) {
            alert("Saved Successfully");
            $('#successCountID').val(0);
        }
    });
    }

Add a hidden field in the form

<input type="hidden" name="successCount" id="successCountID" value="0">

edited Oct 16 '15 at 06:23

answered Oct 15 '15 at 06:54

shiva kumar

121
5

1

You cant. As ajax is an asynchronous function, then you will get undefined for successCount outside success block. Consider read this http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call – Norlihazmey Ghazali Oct 15 '15 at 08:02
See my edit post. Thanks for the valuable info @Ghazali. – shiva kumar Oct 15 '15 at 09:51
Welcome mate, are you ever try using this solution in your environment? – Norlihazmey Ghazali Oct 15 '15 at 10:16
Not really, Actually I didn't face this kind of scenario. – shiva kumar Oct 15 '15 at 10:17
Someday you will facing with this kind of problems. Like said, asynchronous code $.ajax returns immediately and the next statement is executed before the request even completed. You should test this on your environment and see what happens and after that come again to read this link http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call. As me also having a hard time to figure it out for the first time. – Norlihazmey Ghazali Oct 15 '15 at 10:29
Hi,Thank u for sharing your ans but alert message is not displayed please help me – durga Oct 15 '15 at 10:33
Hi,Success count is not increased. – durga Oct 15 '15 at 11:37
Hi, What ever we given in success function its not working so its not increased please help me – durga Oct 15 '15 at 11:44
Made changes and updated. I tried it and working fine. Please check once – shiva kumar Oct 16 '15 at 06:24
Hi Shivakumar,Thank you Very Much,Its Working Fine – durga Oct 16 '15 at 08:52
Welcome bro, Good to hear that. – shiva kumar Oct 16 '15 at 09:37

How dsiplay alert message after saving data using Jquery

3 Answers3