jQuery Ajax回调不获取上下文 [英] jQuery Ajax Callback does not get Context

查看:73
本文介绍了jQuery Ajax回调不获取上下文的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个HTML页面,如 http://jsfiddle.net/Lijo/zPAfF/6/.单击"searchReportButton"按钮时,将调用javascript函数"checkSession".在"checkSession"函数内部,有一个jquery.ajax调用,下面列出了一个web method.网络方法运行良好,我能够在javascript成功回调中将结果提醒为有效".

I have a HTML page as shown in http://jsfiddle.net/Lijo/zPAfF/6/ . When "searchReportButton" button is clicked a javascript function "checkSession" is invoked. Inside the "checkSession" function there is a jquery.ajax call to a web method listed below. The web method is working fine and I am able to alert the result as "ACTIVE" in javascript success callback.

我已将上下文设置为此.

I have set the context as this.

 context: this,  //CONTEXT 

我希望以下代码能提醒正在加载..."文本.假设this将在success callback中工作,因为已设置context.但是它没有显示文字.

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

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

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

}

问题

要在回调中获取上下文,需要纠正什么?

What need to be corrected in order to get the context in the callback?

Web方法

    [WebMethod(CacheDuration = 0)]
    public static string CheckSessionExpiry(string empID)
    {

        return "ACTIVE";
    }

jQuery

$(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());
    }
}​

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1">
<title>Report List </title>

</head>
<body>
<form>

<div id="wrapper">
    <div id="container">
        <div id="centralContainer">
            <div id="mainContainer">
                <div id="contentHolderDiv" class="contentHolderDiv">
                    <div id="searchContainer" class="searchContainer">
                        <div id="entryValues" class="repeaterContainer">
                            <div class="repeaterTableBorder">
                                <div class="repeaterRecord">
                                    <div class="repeaterIdentifier">
                                        <div class="reportTitle">
                                            Daily Financial Transaction:
                                        </div>
                                    </div>

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

推荐答案

this作为参数传递给checkSession函数:

Pass this as argument to the checkSession function:

checkSession(this);

然后:

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

        }
    });
}

还要注意我如何解决您的$.ajax调用以使用JSON.stringify方法的问题,以确保请求的格式正确为JSON. 从不,并且我重复一遍,绝对从不使用字符串串联(+运算符)来构建JSON. JSON.stringify方法是本机内置于所有现代浏览器中的.而且,如果您需要支持来自中生代的浏览器,例如IE6,则可以将 json2.js 脚本引用到您的页面.

Also notice how I have fixed your $.ajax call to use the JSON.stringify method in order to ensure that the request is properly JSON formatted. Never, and I repeat, absolutely never use string concatenations (+ operator) to build JSON. The JSON.stringify method is natively built into all modern browsers. And if you have to support some browser that comes from the Mesozoic era such as IE6 or something you could reference the json2.js script to your page.

这篇关于jQuery Ajax回调不获取上下文的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆