Как я могу передать несколько данных из PHP в JQuery / AJAX? - PullRequest
1 голос
/ 26 марта 2012

У меня есть основной список выбранных курсов, который управляет различными вещами на странице. Когда курс выбран, другой список выбора будет заполнен с датой начала этого курса до 6 месяцев. Кроме того, у меня есть таблица на странице с именами и номерами студентов. Когда будет выбран курс, таблица будет заполнена всеми учащимися, зачисленными на этот курс. Моя проблема в том, что я буду получать различные вещи из PHP через JSON, то есть студентов и дату начала. Как я могу поэтому передать более чем одну вещь в JQuery? Что если список выбора курса затрагивает не только 2 вещи, но 3, 5 или даже 10? Как бы мы справились с этим с помощью PHP и jQuery?

foreach($m as $meta)
{
        $metaCourse = $this->getCourseInfo($meta['parent_course']);

        //populate the select list with the name of each course
        $metaSelectList .= '<option id="select'.$count.'" value="'.$metaCourse['id'].'">'.$metaCourse['fullname'].'</option>';
        $count++;

        //get only the first course's dates
        if($count3 == 1)
        {
                $startDate =  intval( $course->getStartDate(50) );
                $endDate =  strtotime('+6 month', $startDate);

                //populates the select list with the starting date of the course up to the next six months
                for($date = $startDate; $date <= $endDate ; $date = strtotime('+1 day', $date))
                {
                        $dateSelectList .= '<option id="select'.$count2.'" value="'.$date.'">'.date('D d F Y', $date).'</option>';
                        $count2++;
                }
                $count3++;
                $students = $s->getStudents($metaCourse['id']);
                $content = $this->createStudentTable($students);

        }
}

Это мой обработчик для AJAX ... ДЛЯ ТЕПЕРЬ (я еще не реализовал таблицу студентов, так как все еще пытаюсь выяснить, как передать несколько фрагментов данных в jQuery). По сути, каждый раз, когда выбирается курс, PHP создает новый список выбора с соответствующими датами, а затем передает его в jQuery. Я не уверен, должен ли я сделать это в JavaScript или в PHP.

if (isset($_GET['pid']) && (isset($_GET['ajax']) && $_GET['ajax'] == "true"))//this is for lesson select list
{
        $pid = intval( $_GET['pid'] );
        $c = new CourseCreator();
        $startDate =  intval( $c->getStartDate($pid) );
        $endDate =  strtotime('+6 month', $startDate);
        $dateSelectList = '<select name="dateSelect" id="dateSelect">';

        //populates the select list with the starting date of the course up to the next six months
        for($date = $startDate; $date <= $endDate ; $date = strtotime('+1 day', $date))
        {
                $dateSelectList .= '<option id="select'.$count2.'" value="'.$date.'">'.date('D d F Y', $date).'</option>';
                $count2++;
        }

        $dateSelectList .= '</select>';

        echo json_encode($dateSelectList);
        exit;
}

Мой обработчик jQuery:

$('#metaSelect').live('change', function()
{
    $.getJSON('?ajax=true&pid='+$('#metaSelect').val(), function(data)
    {           
        alert(data);
        $('#dateSelectDiv').html(data);
    }); 

});  

1 Ответ

1 голос
/ 26 марта 2012

Вы можете легко передать МНОГО данных из PHP в ваш HTML через JSON (который, как вам кажется, уже заложен в базовый)

Однако, чтобы расширить то, что у вас есть - вот быстрый пример

<?php
   $arrayOfStuff = array("theKey" => "theEntry", 123 => "Bob Dow", 56 => "Charlie Bronw", 20 => 'Monkey!', "theMyID" => $_POST['myID']);
   echo json_encode($arrayOfStuff);
?>

На вашей стороне HTML.

<script> 
   $.post("/theurl/", {type: "fetchArrayOfStuff", myID: 24}, function(success) {
       //your success object will look like this
       /*
          {
             theKey: 'theEntry',
             123: 'Bob Dow',
             56:  'Charlie Bronw',
             20:  'Monkey!',
             theMyID: 24
          }
       so you can easily access any of the data.
                  alert(success.theKey);
                  alert(success[123]);
                  alert(success[56]);
                  alert(success[20]);
                  alert(success.theMyID);

       */

       //we can iterate through the success JSON!           
       for(var x in success) { 
           alert(x + "::" + success[x]);
       };
   }, "json");
</script>

В долгосрочной перспективе - НАМНОГО лучше позволить бэкенду делать бэкэнд, а переднему - делать интерфейс.

Что это значит, попробуйте сохранить генерацию HTML как можно дальше от бэкэнда, чтобы вместо постоянной передачи

    for($date = $startDate; $date <= $endDate ; $date = strtotime('+1 day', $date))
    {
            $dateSelectList .= '<option id="select'.$count2.'" value="'.$date.'">'.date('D d F Y', $date).'</option>';
            $count2++;
    }

Возможно, вы могли бы

    $date = $startDate;
    $myJson = array()
    while($date <= $endDate) {
        $myJson[] = array("date" => $date, "formattedDate" => date('D d F Y', $date));
        $date += 86400; //86400 is the value of 1 day.
    }
    echo json_encode($myJson);

И вы можете просто выполнить итерацию своего HTML-кода.

<script> 
   $.get("/", {ajax: true, pid: $('#metaSelect').val()}, function(success) {


       //we can iterate through the success JSON!           
       var _dom = $('#dateSelectDiv').html(''); //just to clear it out.

       for(var x in success) { 
          _dom.append("<option value='"+success[x].date+"'>"+success[x].formattedDate+"</option>");
       };
   }, "json");
 </script>

Итак, как вы можете видеть - вы можете передавать много данных, используя JSON

Может быть, посмотрите на некоторую документацию для- http://api.jquery.com/jQuery.get/, http://api.jquery.com/jQuery.post/ - может дать вам больше идей.

Удачи вам

...