Prevent an asynchronous postback from gridview with javascript

Question

I have a gridview inside an update panel with a checkbox in the first column of the gridview. When I first created it, it worked fine. The checkbox is set to AutoPostBack and causes an asynchronous postback where I can process the data and refresh the gridview without the rest of the page being affected.

But, I need to test for a certain condition on the page, client side, and display a confirm box to users that says 'This person is not set up for this. Are you sure you want to continue?'

I did this, initially, by putting a bit of code like this in the RowDataBound event of the gridview;

CheckBox cb = (CheckBox)e.Row.FindControl("myCheckBox");
cb.Attributes.Add("onclick", "return check('" + ContactName + "');");

And had a javascript function along the lines of:

function check(ContactName)
{
  if (document.getElementById('Listed') == false)
  {
  if (confirm('This person is not listed, are you sure you want to continue?'))
    {
    return true;
    }
    return false;
  }
}

Please ignore typos in the code above, just typed if from memory. The thing is, it works. If my local variable Listed is false, it throws up the confirm box okay.

The problem is, if you select 'Okay' in the confirm box - the Postback (which should be asynchronous as it is inside an Update Panel with ChildrenAsTriggers = true) generated by the Checkbox is cancelled. I am having to call __doPostback after the javascript confirm to get the Postback to occur. But, then, I am getting a full postback, not the asynchronous postback I want.

So, my question is, how do you prevent the asynchronous postback from a checkbox with a javascript confirm so that, if you select Okay in the javascript confirm, the asynchronous postback takes place.

As I say, at the moment, the only way I can get it to work is do a full postback after the user clicks Okay.

Answer 1

The link at this location discusses how to cancel an async postback via JavaScript:

http://www.ajaxtutorials.com/ajax-tutorials/cancel-asynchronous-postback-in-c/

The important part is here:

<script type="text/javascript">
var instance = Sys.WebForms.PageRequestManager.getInstance();
instance.add_initializeRequest(instance_initializeRequest);

function instance_initializeRequest(sender, args) {
    if (args.get_postBackElement().id == 'btn_Cancel') {
        instance.abortPostBack();
        alert('Postback has been cancelled. Time will not be updated.');
    }
}
</script>

Answer 2

The way Garrison Neely provided should be work for you.

The difference between postback and async postback is async just modify some value of form before submit, and set them back after that. the values are indicating which control initiate the request with what kinda information, also some target information used for which iframe should the response html be rendered into. i just bring some of my thought here, the implementation vary in different situations.