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 2:06am
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
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  

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

  Print Answers RSS
0 Sergey Alexandrovich Kryukov 279
1 OriginalGriff 190
2 DamithSL 185
3 Peter Leow 105
4 Kornfeld Eliyahu Peter 105
0 OriginalGriff 7,355
1 DamithSL 5,254
2 Sergey Alexandrovich Kryukov 4,942
3 Maciej Los 4,906
4 Kornfeld Eliyahu Peter 4,514


Advertise | Privacy | Mobile
Web04 | 2.8.141223.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