Авторизация&Регистрация в одельном окне

Тема в разделе "PHP", создана пользователем rasandrey, 27 июл 2010.

Статус темы:
Закрыта.
Модераторы: latteo
  1. rasandrey

    rasandrey

    Регистр.:
    2 апр 2009
    Сообщения:
    214
    Симпатии:
    6
    В общем есть простая регистрация и авторизация средствами php. Хочу сделать в отдельном модальном окне, но не соображу как выводить сообщения об ошибках обратно в окно после проверки в php коде (например, логин и пароль).
    Подскажите или покажите как :nezn:
     
  2. horpah

    horpah

    Регистр.:
    21 июн 2010
    Сообщения:
    200
    Симпатии:
    55
    Сделай через AJAX. На JQUERY Например.
    В окне у тебя будет <form id="form">...</form> . ТОлько вместо кнопки "отправить" какой нибудь другой элементик, например <div onclick="go()">...</div>

    Ну и функцию go() в Жаваскрипте:
    PHP:
     var params=$("#form").serialize();         
            $.
    post('{$protocol}://{$HOST}/ajaxresponder.php?m=login&SN={$SN}',params,
                function(
    data){
                   
    //эта функуия - обработчик твоего результата
                   
    if(dara.status){
                     
    если все гуд чегото делаешьнапример редирект.
                   }else{
                     
    alert(data.text);
                      
    или если не хочешь алерт
                    
    $("#ID блока для ошибок").html(data.text);
                   }   
                  
                },
            
    "json"
          
    );
    Для приема этой формы понадобится PHP скриптик, у нас он ajaxresponder.php:
    PHP:
    error_reporting(0); //отключить все сообщения PHP чтобы не нарушить формат JSON Следи за тем чтобы ничего лишнего не выводилось и выводилось тоолько 1 раз.
    $SID=$_GET('SN'); //' это поле передавалось через ГЕТ (см. на УРЛ в ЖСкрипте)
    if($SID
      
    session_start($SID);
    else
      
    session_start();
    $method=$_GET('m'); //' это поле передавалось через ГЕТ тоже
    if(method=='m'){
    Достаешь из $_POST свою форму и делаешь авторизацию/регистрацию
    ....
    if(
    Успешная регистрация
        echo 
    json_encode(array('status'=>1,"text"=>"можно пустой текст"); 
    else 
        echo 
    json_encode(array('status'=>0,"text"=>"Сообщение об ошибке. Если будут траблы с кодировками - используй для этого текста ICONV()"); 
    }
    Индексы "status" и "text" потому что и в JS выбрали data.text и data.status. Для работы необходима сессия, PHP 5.2 и выше. Если трабла с 5.2 (что вряд ли), значит json_encode работать не будет и придется самому писать сериализацию массива в формат json. Там где в ЖС $protocol://$HOST - заменишь на HTTP(S) и название сайта соответствеено.
     
    rasandrey нравится это.
  3. merdoc

    merdoc Создатель

    Регистр.:
    24 авг 2009
    Сообщения:
    11
    Симпатии:
    0
    json отправлять введенные данные пользователя, обрабатывать их скриптом.
     
  4. CrashX

    CrashX В прошлом XSiteCMS

    Регистр.:
    6 июн 2008
    Сообщения:
    682
    Симпатии:
    112
    я только недавно делал такую штуку
    и так
    берем
    1-jQuery JavaScript Library v1.4.2 (jquery.js)
    2-jQuery Tools 1.2.4 Overlay (jquery.overlay.js)
    3-Query Form Plugin 2.47 (04-SEP-2010)(jquery.form.js)

    код который будет обрабатывать формы и модальные окна

    Код:
    /**
       * Создание модального окна
       * загрузка данных хранящихся в ссылке с rel='#overlay'
       */
    $(document).ready(function(){
      $("a[rel]").overlay({
        mask: {
          color: '#fff',
          loadSpeed: 200,
          opacity: 0.5
        },
        effect: 'apple',
        closeOnClick: false,
        onBeforeLoad: function() {
          // grab wrapper element inside content
          var wrap = this.getOverlay().find("#modalbox");
          // load the page specified in the trigger
          wrap.load(this.getTrigger().attr("href"));
        }
      });
    });
    /**
       * Обработка форм с id x-form
       * отправка данных
       */
    function xform() {
      $(document).ready(function(){
        var options = {
          //target: "#modalbox",
          //url: "{action}",
          //beforeSubmit: Request, // функция, вызываемая перед передачей
          success: Response, // функция, вызываемая при получении ответа
          type: "post", // get или post
          dataType: "html", // text, hmtl, xml, script или json
          //clearForm: true,
          resetForm: true,
          timeout: 10000 // ожидание ответа в милисекундах
        };
        $("#x-form").submit(function() {
          $(this).ajaxSubmit(options);
          return false;
        });
      });
      /**
       * Отладочная функция,
       * отображение того что будет передаватся
       */
      function Request(formData, jqForm, options) {
        var queryString = $.param(formData);
        alert("Вот что мы передаем: \n\n" + queryString);
        return true;
      }
      /**
       * Обработка получаемого ответа
       * переменная должна соотвествовать возвращаемому типу, данных (html, xml, json)
       * @param response
       */
      function Response(responseText)  {
        //alert("status: " + statusText + "\n\nresponseText: \n" + responseText + "\n\nThe output div should have already been updated with the responseText.");
        $("#modalbox").html(responseText);
        if ( responseText.length < 1 ) {
          $("a[rel]").each(function() {
            $(this).overlay().close();
          });
        }
      }
    
    }
    // Form-Post
    
    далее нам понадобится
    HTML
    Мобдальное окно
    Код:
      <!-- overlayed modal box -->
      <div class="overlay" id="overlay">
        <div class="modalbox" id="modalbox"></div>
      </div>
    </body>
    </html>
    
    у меня оно к вонце страницы)
    далее
    примерная форма
    ссылки те которые надо котрывать в модальном окне
    в них доп параметр rel='#overlay'
    у форм name='x-form' id='x-form'


    в ПХП в генерации шаблона отключать футеры, боковинки и тп и отдавать только сами данные если пришел вот такой заголовок

    Код:
    if ($_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest')
    {тут выдаем только данные для модальных окон.}
    
    если есть впросы пиши

    Добавлено через 2 минуты
    В ФОРМАХ НЕ ИСПОЛЬЗОВАТЬ enctype
    иначе, если будешь использовать заголовок XMLHttpReques не будет проставлятся

    Добавлено через 4 минуты
    да этот пример будет работать с отлюченой явой)
     
Статус темы:
Закрыта.