-2

これはかなり奇妙で、かなり複雑です。私はできる限りそれを説明しようとしています。手作業でカレンダーを作成したり、オープンソーシングを計画したりします。現在、Googleカレンダーのルックアンドフィールは最高のようですが、1つアップしてオープンソースにする予定です。前月をクリックして前月を表示する場合を除いて、すべてが問題なく実行されています。その後、ajaxクエリが実行され、phpは新しいカレンダーを返しますが、レンダリングすると、それ以外の要素がない状態でレンダリングされます <table>アイデア?ここにいくつかのコード/画像があります:

html:

//function to use xml
function xml(){
 //need to set up xml to run php for query
   if (window.XMLHttpRequest)
   {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
   }
   else
   {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
   xmlhttp.onreadystatechange = function()
   {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
    {
     document.getElementById("calendar").innerHTML= xmlhttp.responseText;
    }
  };
}

//function to select the previous month
function previousMonth(str){
//since this is the previous month we need to take month -1
var month = str - 1;
 //if it is already 1.. then it needs to be 12!
  if(str == 1)
  {
   month = 12;
  }
   //call xml
   xml()
   //send dat query
   xmlhttp.open("GET","redraw.php?month="+encodeURIComponent(month),true);
   xmlhttp.send();
}

redraw.php:

// draws the calendar 
function draw_calendar($month,$year){
  // table headings 
  $headings = array('Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday');
  $calendar= '<tr class="calendar-row"><td class="calendar-day-head" id = "cell" style = "min-width:150px;">'.implode('</td><td class="calendar-day-head">',$headings).'</td></tr>';

  // days and weeks vars now 
  $days_last_month = date('t',mktime(0,0,0,$month-1,1,$year));
  $running_day = date('w',mktime(0,0,0,$month,1,$year));
  $days_in_month = date('t',mktime(0,0,0,$month,1,$year));
  $days_in_this_week = 1;
  $day_counter = 0;
  $dates_array = array();
  $today = date("d");

  // row for week one 
  $calendar.= '<tr class="calendar-row">';

  // print "blank" days until the first of the current week 
  for($x = 0; $x < $running_day; $x++)
  {
    $calendar.= '<td class = "calendar-day-prev" id = "cell" style = "min-width:150px;"><div class = "day-prev-    number" style = "color:#929D9D">'.(($days_last_month -($running_day - 1)) + $x).'</div>';
    $calendar.= str_repeat('<p>&nbsp;</p>',2);
    $calendar.= '</td>';
    $days_in_this_week++;
  }

  // keep going with days....
  for($list_day = 1; $list_day <= $days_in_month; $list_day++)
  {
   $calendar.= '<td class = "calendar-day" id = "cell" style = "  min-width:150px;"';
  //if the day is today we obviously need to have a differnet style for it... 
    if($list_day == $today)
    {
     $calendar.= ' style = "background-color:#9494B8;font-weight:bol;">';
    }
    else
    {
     $calendar.= '>';
    }

      // add in the day number 
      $calendar.= '<div class = "day-number">'.$list_day.'</div>';

      // THIS IS WHERE I NEED TO QUERY ENTRIES PER DAY
      $calendar.= str_repeat('<p>&nbsp;</p>',2);

    $calendar.= '</td>';
    if($running_day == 6)
    {
      $calendar.= '</tr>';
      if(($day_counter+1) != $days_in_month)
      {
        $calendar.= '<tr class="calendar-row">';
      }
      $running_day = -1;
      $days_in_this_week = 0;
    }
    $days_in_this_week++; $running_day++; $day_counter++;
  }

  // finish the rest of the days in the week 
  if($days_in_this_week < 8 && $days_in_this_week != 1)
  {
    for($x = 1; $x <= (8 - $days_in_this_week); $x++)
    {
      $calendar.= '<td class = "calendar-day-after" id = "cell" style = "  min-width:150px;"><div class = "day-post-number" style = "color:#929D9D;">'.$x.'</div>';
      $calendar.= str_repeat('<p>&nbsp;</p>',2); 
      $calendar.= '</td>';
    }
  };

  // final row 
  $calendar.= '</tr>';

  // all done, return result 
  return $calendar;

}

//draw the calendar
$year = date ('Y');
$month_title = date ('F');

//Sent variables
if(!empty($_REQUEST['month']))
{
  $month_display = $_REQUEST['month'];
}
else
{
  $month_display = date ('n');
}
echo draw_calendar($month_display,$year);

ここに何が起こっているのかについての良い描写があります:

それがどのように見えるべきか: 始める

最初のクリックで: onclick

jsによって挿入されるもの<div id = "calendar"> ちょっと動作します

phpによって返されるもの(この部分は一見正しいようです): 悪い


どこ<table>にもタグを追加していません。

PHPで、次の行を置き換えます。

$calendar= '<tr class="calendar-row"><td class="calendar-day-head" id = "cell" style = "min-width:150px;">'.implode('</td><td class="calendar-day-head">',$headings).'</td></tr>';

と:

$calendar= '<table><tr class="calendar-row"><td class="calendar-day-head" id = "cell" style = "min-width:150px;">'.implode('</td><td class="calendar-day-head">',$headings).'</td></tr>';

そしてこの行:

return $calendar;

と:

return $calendar . '</table>';
4

2 に答える 2

1
document.getElementById("calendar").innerHTML= xmlhttp.responseText;

divテーブルの行をではなく、に挿入していtableます。不足しているテーブルタグを追加するか、データをテーブルに追加します。

NITPICKS-「ヘッダーセル」がありますが、要素を使用していません。あなたはtheadとtbodyを使用していません。

于 2013-02-15T15:46:52.290 に答える
1

どこ<table>にもタグを追加していません。

PHP で、次の行を置き換えます。

$calendar= '<tr class="calendar-row"><td class="calendar-day-head" id = "cell" style = "min-width:150px;">'.implode('</td><td class="calendar-day-head">',$headings).'</td></tr>';

と:

$calendar= '<table><tr class="calendar-row"><td class="calendar-day-head" id = "cell" style = "min-width:150px;">'.implode('</td><td class="calendar-day-head">',$headings).'</td></tr>';

そして、この行:

return $calendar;

と:

return $calendar . '</table>';
于 2013-02-15T15:45:53.497 に答える