2012-03-26 16 views
1

私は、ページ上でさまざまなことを動かすコースの主要な選択リストを持っています。コースが選択されると、別の選択リストにはそのコースの開始日が6ヶ月前に再設定されます。また、ページには学生の名前と電話番号の表があり、コースが選択されると、そのコースに登録されたすべての生徒と一緒にテーブルが再投入されます。私の問題は、PHPからJSON、つまり生徒と開始日までにさまざまなものが得られることです。したがって、どうすれば複数のものをjQueryに渡すことができますか?コース選択リストが2、3、5、10の2つだけではない場合はどうなりますか? PHPとjQueryをどうすれば処理できますか?PHPからjQuery/AJAXに複数のデータを渡すにはどうしたらいいですか?

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

     } 
} 

これは(私はまだjQueryのに複数のデータを渡す方法を把握しようとしているように私はまだ学生テーブルを実装していない)今の... AJAXのための私のハンドラです。基本的に、コースが選択されるたびに、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

を簡単しかし展開する(すでに基本に置くのように思われた)JSON経由でHTMLに

をPHPからのデータの多くを渡すことができますあなたが持っているもの - 簡単な例をご紹介します。

<?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> 

だから、あなたが見ることができるように - http://api.jquery.com/jQuery.get/http://api.jquery.com/jQuery.post/ - - あなたは多分にドキュメントのいくつかを見て

JSON

を使用してデータの多くを渡すことができますあなたのより多くのアイデアを与えるかもしれません。

あなたに幸運のベスト

+0

おかげで:)うん、それはので、私はバックエンドでHTMLを生成することはありませんjQueryのにすべてがPHPのものを移動することです私の計画です。私はちょうどjQueryに大きなデータを渡す方法を見つける必要がありました –

+0

私はちょうどあなたのスニペットを実装して、彼らは素晴らしい仕事をしています。おかげで多くの:) –

+0

甘い、聞いてうれしい:) – DdD

関連する問題