Блог

Я пытаюсь это сделать:

Попросите пользователя щелкнуть какое-либо действие. Действие проверяет, вошел ли пользователь в систему или нет. Если нет, откройте диалоговое окно входа в систему, и если пользователь входит в систему правильно, обновите исходную страницу.

Я получил почти всю эту работу, кроме части после успешного входа в систему. Проблема в том, что код, похоже, не имеет доступа к item_id, который я пытался обновить. Вместо этого, когда я пытаюсь установить идентификатор элемента (в данном случае problem_id) в форме входа во всплывающее окно, идентификатор — это номер идентификатора, который является последним на странице, а не тот, на который был нажат.

Вот что я пытаюсь сделать в jQuery:

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

    // Called right away after someone clicks on the vote up link
    $('.vote_up').click(function() 
    {        
        var problem_id = $(this).attr("data-problem_id");

        //alert ("In vote up click, problem_id: "   problem_id );
        voteUp(problem_id);

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

    var voteUp = function(problem_id) 
    {
        alert ("In vote up function, problem_id: "   problem_id );

        var dataString = 'problem_id='   problem_id   'amp;vote= ';

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

                },
                error : function(data) 
                {
                    alert ("vote error");
                    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');

                        alert ("after dialog was open");

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

                    //alert(JSON.stringify(data));
                } // Closing error case
            }); // Closing AJAX call.
    };

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

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

        var dataString = 'problem_id='  problem_id   'amp;vote=-';        

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

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

а вот форма входа в систему:

          <div id="login_div">
         <form id="login_form" method="post" action="">
         <p>
             <label for="name"><span>Your Email:</span></label> <input type="text" name="email" id="email" />
         </p>
         <p>
             <label for="name"><span>Your Password:</span></label> <input type="password" name="user_pass" id="user_pass">
         </p>

         <input type="hidden" id="problem_id" name="problem_id" value="<?php echo $problem_id; ?>" />

<span class="no_such_user" style="color: red; display:none">The login and password does not match our records.</span>
<span class="password_error" style="color: red; display:none">The password much be 5 characters or more.</span>
<span class="login_success" style="color: green; display:none">You successfully logged in.</span>
         <p>
            <input type="submit" value="Log In"  />
         </p>
         </form>

         </div>
  

Но problem_id, который устанавливается в этой форме, не является тем, на который нажимается, хотя я пытаюсь сохранить его в своем jQuery.

Кроме того, вот код, который выполняется для входа в систему:

 $(function()
{
    $("#login_div input[type=submit]").click(function()
    {
        var email = $("#email").val();
        var password = $("#user_pass").val();

        //alert("Email: "   email);
        //alert("password: "   password);

        var dataString = 'email='  email   'amp;password='   password;

        if( !email )
        {   
            alert ("1");
            $('.login_success_email_empty').fadeOut(200).hide();
            $('.login_error_email_empty').fadeOut(200).show();
        }       
        else        
        if( !password || password.length < 5)
        {alert ("2");
            $('.password_success').fadeOut(200).hide();
            $('.password_error').fadeOut(200).show();
        }
        else
        {
            $.ajax({
                type: "POST",
                url: "../auth/login_ajax.php",
                dataType: "json",
                data: dataString,
                success: function(json)
                {
                    $('.password_error').fadeOut(200).hide();
                    $('.no_such_user').fadeOut(200).hide(); 
                    $('.login_success_email_empty').fadeOut(200).hide();
                    $('.login_success').fadeIn(200).show();                                 

                    // Closing the dialog bosx
                    $('#loginpopup').dialog('close');

                    // Swapping out the header div
                    $('#header_logged_out').hide();
                    $('#header_logged_in').show();  

                    // Now also need to retrieve the problem_id                 
                    problem_id = $("#problem_id").val();
                    //$problemId = $('#theProblemId', '#loginpopup').val();         


                    var $problemId = $('#theProblemId', '#loginpopup');
                    alert ("After login, problem_id: "   problem_id   " and problemId was: "   $problemId);
                },
                error : function(json)
                {
                    alert ("error");

                    // Output the result.
                    errorMessage = json.responseText;

                    alert ("ErrorMessage: "   errorMessage );

                    if ( errorMessage == 'no_such_user' )
                    {
                        $('.no_such_user').fadeOut(200).hide();
                        $('.no_such_user').fadeOut(200).show();                 
                    }
                }
            });
        }

        return false;
    });
});
  

и я просто не уверен, как заставить этот problem_id, который был установлен в исходном коде jQuery, распознаваться в коде jQuery, который выполняется после входа в систему.

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

И как я узнаю в исходном коде, который обрабатывает голоса, был ли вход в диалоговое окно успешным или нет?

Кстати, я работаю над этой страницей: http://www.problemio.com

Кажется, что вам может быть лучше использовать плагин отправки jquery forms / ajax: http://be.twixt.us/jquery/formSubmission.php

 $('loginDiv > form').submit(function() {
    var options = {
        url = "../auth/login_ajax.php",
        [...]
       };
    $(this).ajaxSubmit(options);
    return false;  //this line is required to make sure that the page doesn't get redirection to /auth/login_ajax.php
});
  

Таким образом, он не будет перезагружать какой-либо javascript, сохраняя все переменные, которые уже были установлены. Поэтому вы можете установить идентификатор проблемы перед входом в систему, а затем выполнить с ним что-то после.