Как отслеживать действия, вызываемые диалоговым окном jQuery?

Question

У меня есть небольшая дилемма:)

У меня есть ссылка для пользователей, чтобы голосовать за элемент.Щелчок по ссылке сгенерировал вызов jQuery AJAX, проверяющий, вошел ли человек в систему. Если нет, в диалоговом окне отображается форма для входа в систему.

Но проблема в том, что вызов jQuery для входа и весь бит с всплывающим окном находится в другом месте.

Что мне нужно сделать, это проверить, если пользователь вошел в систему успешнои обновите счетчик голосов.

Я делаю это на этом сайте: http://www.problemio.com

Вот мой код jQuery:

<script type="text/javascript">
$(document).ready(function() 
{
     var $dialog = $('#loginpopup')
       .dialog({
         autoOpen: false,
         title: 'Login Dialog'
       }); 

        $("#newprofile").click(function () {
          $("#login_div").hide();
          $("#newprofileform").show();
        });


    $('.vote_up').click(function() 
    {        
        problem_id = $(this).attr("data-problem_id");

        var dataString = 'problem_id='+ problem_id + '&vote=+';

        $.ajax({
                type: "POST",
                url: "/problems/vote.php",
                dataType: "json",
                data: dataString,
                success: function(data)
                {           
                    // ? :)
                    alert (data);   
                },
                error : function(data) 
                {
                    errorMessage = data.responseText;

                    if ( errorMessage == "not_logged_in" )
                    {
                        // Try to create the popup that asks user to log in.
                        $dialog.dialog('open');

                        // prevent the default action, e.g., following a link
                        return false;
                    }
                    else
                    {
                        alert ("not");
                    }

                    //alert(JSON.stringify(data));
                }
            });


        //Return false to prevent page navigation
        return false;
    });

    $('.vote_down').click(function() 
    {
        alert("down");

        problem_id = $(this).attr("data-problem_id");

        var dataString = 'problem_id='+ problem_id + '&vote=-';        

        //Return false to prevent page navigation
        return false;
    });    
});
</script>

Все это работает, кроме сразу после строки $dialog.dialog('open'); - я не знаю, как

1. Получить сигнал об успешном сбое, и не знаю точно, как
2. Обновите тот самый элемент, за который проголосовали, так как это только один из многих элементов, за которые можно проголосовать на странице.

Как я могу сделать эти две вещи?

Answer 1

Попробуйте этот подход:

1. Иметь скрытый ввод в div, который является вашим диалоговым окном входа в систему.
2. Установите это с помощью problem_id перед тем, как .dialog('open')
3. При успешном обратном вызове нажатия кнопки Login извлеките problem_id из скрытого ввода и выполните голосование или понижение.

Надеюсь, что это поможет

РЕДАКТИРОВАТЬ: (Попытка кодировать работоспособный пример после второго комментария ОП)

<script type="text/javascript">
    $(document).ready(function() {
        var $dialog = $('#loginpopup')
                .dialog({
                    autoOpen: false,
                    title: 'Login Dialog'
                });

        var $problemId = $('#theProblemId', '#loginpopup');

        $("#newprofile").click(function () {
            $("#login_div").hide();
            $("#newprofileform").show();
        });


        $('.vote_up').click(function() {
            var problem_id = $(this).attr("data-problem_id");
            voteUp(problem_id);
            //Return false to prevent page navigation
            return false;
        });

        var voteUp = function(problem_id) {
            var dataString = 'problem_id=' + problem_id + '&vote=+';

            $.ajax({
                type: "POST",
                url: "/problems/vote.php",
                dataType: "json",
                data: dataString,
                success: function(data) {
                    // ? :)
                    alert(data);
                },
                error : function(data) {
                    errorMessage = data.responseText;
                    if (errorMessage == "not_logged_in") {
                        //set the current problem id to the one within the dialog
                        $problemId.val(problem_id);

                        // Try to create the popup that asks user to log in.
                        $dialog.dialog('open');

                        // prevent the default action, e.g., following a link
                        return false;
                    }
                    else {
                        alert("not");
                    }

                    //alert(JSON.stringify(data));
                }
            });
        };

        $('.vote_down').click(function() {
            alert("down");

            problem_id = $(this).attr("data-problem_id");

            var dataString = 'problem_id=' + problem_id + '&vote=-';

            //Return false to prevent page navigation
            return false;
        });

        $('#loginButton', '#loginpopup').click(function() {
            $.ajax({
                url:'url to do the login',
                success:function() {
                    //now call cote up 
                    voteUp($problemId.val());
                }
            });
        });
    });
</script>