Trigger/Prevent page event by using asynchronous webmethod return value in JavaScript

Question

I use a webmethod to identify whether the user can "Delete a record".

Here is the JavaScript code before adding this access control.

$(".apply-delete-msg").live('click', function() {
   return confirm("Are you sure you want to delete this item(s)?);    
});

Now it will call the webMethod to validate the access

<WebMethod(EnableSession:=True)> _
Public Function CanAccess() As Boolean
    Return ServerCode.IsAccessable
End Function

The new JavaScript then:

$(".delete-msg").live('click', function() {    

    MPWebService.CanAccess(
        //B
        function(boolRes) {    

          if (boolRes == true){
                 return  confirm("Are you sure you want to delete this item(s)?");}             
          else{
                 alter("can't access");
                 return false;
          }           

    });

    // **Here is Comment A**: Return true/false

});

I want the ".Live" method to return a true/false if the user can access and confirm delete/cannot access or cancel the delete.

But if i'm right the method will call CanAccess first, and then Comment A:, finally Comment B, i.e. function(boolRes).

Because the value of boolRes is inside function(boolRes) and it is processed at last, it's tricky for me to get a return value from this method at Comment A position.

Any suggestions?

score 1 · Answer 1 · answered Feb 29 '12 at 11:54

1

The Web Service call is asynchronous and will return a result after you have returned from the click message. Therefore you always need to return false from the click method and re-design your page, so that the action that would have normally taken place after client side click (and true returned) to be performed after web service method returns. It would also be good to have a "Please wait..." message, while waiting for the call to complete.

answered Feb 29 '12 at 11:54

kgiannakakis

103,016
27
158
194

make sense. but if the click event always return false, how does it fire the delete function in service. Call the server side event in JS? – Dan An Feb 29 '12 at 12:38
Could u give me a simple example for this? – Dan An Feb 29 '12 at 12:47
Do you have a post-back action associated with the .delete-msg click? You probably have and this is the action that you want to initiate after the web method call. Return false will guarantee that the post-back won't be called from the click event handler. You can make the post-back using doPostBack (See this question for example: http://stackoverflow.com/questions/2738327/how-to-call-postback-using-javascript-on-asp-net-form) – kgiannakakis Feb 29 '12 at 13:24
It seems doesn't work. I put e.preventDefault() in the outer function and e.trigger in inner, it doesn't the server-side-action. Then I put return true in outer, e.preventDefault() in inner, it still call the server-side-action, mb is not a good place to use webmethod, can it be non-asynchronous? – Dan An Feb 29 '12 at 13:45

score 0 · Answer 2 · answered Feb 29 '12 at 11:58

0

There is two ways to do it :

do the comment A code into the boolRes==true block
create a callback which contains the code of comment A and call this callback in the boolRes==true block

answered Feb 29 '12 at 11:58

Jerome Cance

8,103
12
53
106

Trigger/Prevent page event by using asynchronous webmethod return value in JavaScript

2 Answers2

Linked