ajax calling error when certain event fire on client side.

Question

function manageVoting() 
{
    $('div.votemaincontainer').each(function() {

        // variable declaration and intialization

        var parameter = $(this).find('#[id$= hfUrl]').val();
        var myVoting = parseInt($(this).find('#[id$=hfMyVote]').val());

        // Object Intialization.

        var divVoting = $(this).find('[id$=divVoting]');
        var divVotes = $(this).find('[id$=divVotes]');

        //image initialization.
        var aftervoteUp = $(this).find('[id$=afterVoteUp]');


        // On Mouse-click do Ajax call and update current value.
        $('img.voteupImage').live('click', function() 
        {
            var value = 1;
            $('img.voteupImage').attr('src', aftervoteUp );

            var parameterData = parameter + value + "'}";

            // ajax calling.

            $.ajax(
            {
                type:'POST',
                url: 'UserControls/Vote/VoteAction.aspx/Voting',
                data: parameterData,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(data)
                {
                   var result = eval(data.d);

                   if (result)
                        {
                            if (result.length > 1)
                            {
                                $(divVotes).html(result[0]);

                            }
                             else
                        {
                            $(divVotes).html(result[0]-1);
                            alertDialog("Rating any knowledge item is only available for Registered User.<br>Do you want to <a class='signUpPopUp' href='signup.aspx'> signup</a> Now?");
                        }

                        }
                },
                error: function() {

                }
        });
    });

});

}



$(function() {

   manageVoting();

});

view.aspx

 <script src="UserControls/Vote/JS/UserVoting.js" type="text/javascript"></script>

but when i click on image then ajax calling doesnot work...what i do...

Answer 1

Try this:

function manageVoting() {
    $('img.voteupImage').live('click', function() {

        var parameter;
        var myVoting;
        var divVoting;
        var divVotes;
        var aftervoteUp;

        $('div.votemaincontainer').each(function() {
            parameter = $(this).find('#[id$= hfUrl]').val();
            myVoting = parseInt($(this).find('#[id$=hfMyVote]').val());
            divVoting = $(this).find('[id$=divVoting]');
            divVotes = $(this).find('[id$=divVotes]');
            aftervoteUp = $(this).find('[id$=afterVoteUp]');
        });


        var value = 1;
        $('img.voteupImage').attr('src', aftervoteUp);

        var parameterData = parameter + value + "'}";

        $.ajax({
            type: 'POST',
            url: 'UserControls/Vote/VoteAction.aspx/Voting',
            data: parameterData,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(data) {
                var result = eval(data.d);

                if (result) {
                    if (result.length > 1) {
                        $(divVotes).html(result[0]);

                    }
                    else {
                        $(divVotes).html(result[0] - 1);
                        alertDialog("Rating any knowledge item is only available for Registered User.<br>Do you want to <a class='signUpPopUp' href='signup.aspx'> signup</a> Now?");
                    }

                }
            },
            error: function() {

            }
        });
    });
}

$(function() {
    manageVoting();
});