Change css in jquery ajax with asp.net

Question

I wolud like to get results: 2222 .but i can not get the results now.Output '3333' always. can anyone help me out ?thank you very much!

<head runat="server">
<title></title>
<script src="/Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
    $(function () {
        $("#Button1").click(function () {
            checkCard('333');
            var arrlist = $("span[class='error']");
            if (arrlist.length > 0) {
                alert('2222')
            }
            else {
                alert('3333');
            }
        });
    })
    function checkCard(card_no) {
        $.ajax({
            type: "GET",
            url: "CheckCard.ashx?card_no=" + card_no,
            success: function (data) {
                if (data == "true") {
                    $("#sw").addClass("error");
                }
                else {
                    $("#sw").removeClass("error");
                }
            }
        });
    }
 </script>
</head>
<body>
 <form id="form1" runat="server">
 <div>
    <span id="sw"></span>
</div>
</form>
    <input id="Button1" type="button" value="button" />
</body>

CheckCard.ashx:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data.SqlClient;

namespace SwipeCard
{
/// <summary>
/// Summary description for CheckCard
/// </summary>
public class CheckCard : IHttpHandler
{

    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "text/html";

        context.Response.Write("true");

        context.Response.End();

    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}
}

I wolud like to get results: 2222 .but i can not get the results now.Output '3333' always. can anyone help me out ?thank you very much!

Tim M. · Accepted Answer · 2012-03-13 08:52:52Z

3

$.ajax is asynchronous. Your style check immediately follows the call, and thus there is no guarantee that the operation has completed. Put the check in the success callback.

function checkCard(card_no) {
    $.ajax({
        type: "GET",
        url: "CheckCard.ashx?card_no=" + card_no,
        success: function (data) {
            if (data == "true") {
                alert("Condition 1 exists");
                $("#sw").addClass("error");
            }
            else {
                alert("Condition 2 exists");
                $("#sw").removeClass("error");
            }
        }
    });
}

answered Mar 13, 2012 at 8:52

Tim M.

54.5k14 gold badges126 silver badges167 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Change css in jquery ajax with asp.net

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related