jQuery Ajax Callback does not get Context
<p>I have a HTML page as shown in  <a href="http://jsfiddle.net/Lijo/zPAfF/6/" rel="nofollow">http://jsfiddle.net/Lijo/zPAfF/6/</a> .  When “searchReportButton” button is clicked a javascript function “checkSession” is invoked. Inside the “checkSession” function there is a <code>jquery.ajax</code> call to a <code>web method</code> listed below. The web method is working fine and I am able to alert the result as “ACTIVE” in javascript success callback.</p>

<p>I have set the context as this.</p>

<pre><code> context: this,  //CONTEXT 
</code></pre>

<p>I am expecting the following code to alert the “Loading…” text. The assumption is <code>this</code> will work in the <code>success callback</code> since the <code>context</code> is set. But it not showing the text.</p>

<pre><code>if (result == "ACTIVE") 
{       
    var selectedTable = $(this).closest('.dateFilter').siblings('.sentDatesSection').find('.reportSentDatesDiv');

    alert($(selectedTable).text());

}
</code></pre>

<p><strong>QUESTION</strong></p>

<p>What need to be corrected in order to get the context in the callback?</p>

<p><em>Web Method</em> </p>

<pre><code>    [WebMethod(CacheDuration = 0)]
    public static string CheckSessionExpiry(string empID)
    {

        return "ACTIVE";
    }
</code></pre>

<p><img src="http://i.stack.imgur.com/As7nf.jpg" alt="enter image description here"></p>

<p><strong>jQuery</strong></p>

<pre><code>$(document).ready(function() {
    var searchReportButton = $('.searchReportButton');
    searchReportButton.click(function() {
        var selectedTable = $(this).closest('.dateFilter').siblings('.sentDatesSection').find('.reportSentDatesDiv');
        alert($(selectedTable).text());
        checkSession();
        return false;
    });
});

function checkSession() {
    var empID = 101;
    alert('Function Reached');
    $.ajax({
        type: "POST",
        url: "Error.aspx/CheckSessionExpiry",
        data: '{"empID": "' + empID + '"}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        context: this,
        //CONTEXT
        success: handleSessionResult
    });
}

function handleSessionResult(result) {
    if (result.hasOwnProperty("d")) {
        result = result.d
    }
    if (result == "ACTIVE") {
        var selectedTable = $(this).closest('.dateFilter').siblings('.sentDatesSection').find('.reportSentDatesDiv');
        alert($(selectedTable).text());
    }
}​
</code></pre>

<p><strong>HTML</strong></p>

<pre><code>&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
&lt;head id="Head1"&gt;
&lt;title&gt;Report List &lt;/title&gt;

&lt;/head&gt;
&lt;body&gt;
&lt;form&gt;

&lt;div id="wrapper"&gt;
    &lt;div id="container"&gt;
        &lt;div id="centralContainer"&gt;
            &lt;div id="mainContainer"&gt;
                &lt;div id="contentHolderDiv" class="contentHolderDiv"&gt;
                    &lt;div id="searchContainer" class="searchContainer"&gt;
                        &lt;div id="entryValues" class="repeaterContainer"&gt;
                            &lt;div class="repeaterTableBorder"&gt;
                                &lt;div class="repeaterRecord"&gt;
                                    &lt;div class="repeaterIdentifier"&gt;
                                        &lt;div class="reportTitle"&gt;
                                            Daily Financial Transaction:
                                        &lt;/div&gt;
                                    &lt;/div&gt;

                                    &lt;div class="viewLogTitle"&gt;
                                        &lt;div class="viewLogText"&gt;
                                            View Report Log
                                        &lt;/div&gt;
                                    &lt;/div&gt;
                                    &lt;div id="reportLog" class="reportLog"&gt;
                                        &lt;div class="dateFilter"&gt;
                                            &lt;div class="filterElements"&gt;
                                                &lt;div class="filterContents"&gt;
                                                    &lt;input type="submit" name="ctl00$detailContentPlaceholder$repReports$ctl00$btnSubmit"
                                                        value="Get Reports" id="detailContentPlaceholder_repReports_btnSubmit_0" class="searchReportButton" /&gt;
                                                &lt;/div&gt;
                                            &lt;/div&gt;
                                        &lt;/div&gt;
                                        &lt;div class="sentDatesSection"&gt;
                                            &lt;div class="reportSentDatesDiv"&gt;
                                                &lt;p&gt;
                                                    Loading...&lt;/p&gt;
                                            &lt;/div&gt;
                                        &lt;/div&gt;
                                    &lt;/div&gt;
                                &lt;/div&gt;
                            &lt;/div&gt;
                        &lt;/div&gt;
                    &lt;/div&gt;
                    &lt;div class="clear"&gt;
                    &lt;/div&gt;
                &lt;/div&gt;
            &lt;/div&gt;
            &lt;div class="clear"&gt;
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
&lt;/form&gt;
&lt;script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.1.js"&gt;&lt;/script&gt;
</code></pre>

<p>
   </p>
