Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
See more: WCF jQuery Services
Friends,
 
I using the below code for deleting the list from three tables(Deleting Perfectly!). It will take hardly 10 seconds for deleting.
 
Here, I want to show please wait image for these waiting time..
It will show when starting the process and hide on delete process completed
 
$(document).ready(function () {
               $.ajax({
                        cache: false,
                        async: true,
                        type: "GET",
                        dataType: "json",   
                        url: "../Services/MasterServices.svc/DeleteList",
                        data: { name: vatid },
                        contentType: "application/json;charset=utf-8",
                        success: function (r) {
                            if (r != null) {
                                alert("Removed Successfully");
                            }
                        },
                        error: function (e) { alert(e.statusText); }
 
                    });
                });
Any help!!!
 
Thanks,
Karthik.J
Posted 22-Nov-12 1:06am
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

You need to add ajaxStart() method to your code. Within this method, you can have any type of loading indicator, or changing the screens transparency etc...
  $("yourDivOrAnyControl").ajaxStart(function(){
    $(this).html("<img src="loadingImage.gif" />");
  });
So, final code would look something like,
$(document).ready(function () {
       $("yourDivOrAnyControl").ajaxStart(function(){
            $(this).html("<img src="loadingImage.gif" />");
       });
 
       $.ajax({
                cache: false,
                async: true,
                type: "GET",
                dataType: "json",   
                url: "../Services/MasterServices.svc/DeleteList",
                data: { name: vatid },
                contentType: "application/json;charset=utf-8",
                success: function (r) {
                    if (r != null) {
                        alert("Removed Successfully");
                    }
                },
                error: function (e) { alert(e.statusText); }
 
              });
});
 
For more information please see this link
http://api.jquery.com/ajaxStart/[^]
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 2

<span id="ajax_loading_div" style="display: inline-block;<br mode=" hold=" />    width: 150px;"></span>
 
<script type="text/javascript" language="javascript">
$(document).ready(function () {
                    $("#ajax_loading_div").addClass("loading");
                    $.ajax({
                        cache: false,
                        async: true,
                        type: "GET",
                        dataType: "json",
                        url: "../Services/FinMasterServices.svc/DeleteListCompany",
                        data: { name: vatid },
 
                        contentType: "application/json;charset=utf-8",
                        success: function (r) {
                            $("#ajax_loading_div").removeClass("loading");
                            if (r != null) {
                                alert("Removed Successfully");
                            }
                        },
                        error: function (e) { alert(e.statusText); }
 
                    });
                });
</script>
  Permalink  
v2

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 OriginalGriff 260
1 Sergey Alexandrovich Kryukov 150
2 ChauhanAjay 120
3 BotCar 105
4 Richard MacCutchan 100
0 Sergey Alexandrovich Kryukov 9,056
1 OriginalGriff 7,981
2 CPallini 2,613
3 Richard MacCutchan 2,121
4 Abhinav S 1,928


Advertise | Privacy | Mobile
Web02 | 2.8.140827.1 | Last Updated 23 Nov 2012
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100