Почему этот вызов JQuery для asp.net pagemethod загружает всю страницу? - PullRequest
1 голос
/ 10 июня 2009

Вот фрагмент моего HTML:

<input id="btnGetDate" type="submit" value="Get Date" />
    <div id="Result"></div>

<script type="text/javascript">

    $(document).ready(function() {

        $("#btnGetDate").click(function() {
            $.ajax({
                type: "POST",
                url: "Date.aspx/GetDate",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(msg) {
                    $("#Result").text(msg.d);
                }
            });
        });
    });

</script>

Идентификатор метода моей страницы определен следующим образом:

    [System.Web.Services.WebMethod]
    public static string GetDate()
    {
        return DateTime.Now.ToString();
    }

Когда я нажимаю кнопку «Получить дату», на секунду на экране мигает дата, но поскольку вся страница загружается, она исчезает, и когда я ее просматриваю в firebug, я вижу, что она выполняет процедуру POST, быстро исчезает. Есть идеи, как решить эту проблему?

Ответы [ 2 ]

3 голосов
/ 10 июня 2009

Попробуйте вернуть false из обработчика событий $("#btnGetDate").click():

    $("#btnGetDate").click(function() {
        $.ajax({
            type: "POST",
            url: "Date.aspx/GetDate",
            data: "{}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg) {
                $("#Result").text(msg.d);
            }
        });
        return false;
    });
1 голос
/ 10 июня 2009

Решение karim79 выполнит эту работу в Internet Explorer, но чтобы убедиться, что оно работает и в Firefox, и в других браузерах, вы, вероятно, захотите добавить входной аргумент в обработчик кликов, который будет принимать событие click, и остановить событие.

$("#btnGetDate").click(function(ev) {
    ev.stopPropagation();
    $.ajax({
        type: "POST",
        url: "Date.aspx/GetDate",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            $("#Result").text(msg.d);
        }
    });
    return false;
});
...