var mySlide;//??????
var myAjax;//??Ajax.Request??
var max = 20;//?????
var min = 1;//??????
function init(){
  //??????,???????????1
  mySlider = YAHOO.widget.Slider.getHorizSlider("pageBGDiv","pageHandleDiv",min,max,1);
  //?????????
  mySlider.onChange = function() {
    //??id?pageInfo?????
	var info = document.getElementById("pageInfo");
	//???????????????
	info.innerHTML=mySlider.getValue()+"/"+max;
  }
  //??????????postAjax??,??XMLHTTPRequest??
  mySlider.onSlideEnd = postAjax;
}
function postAjax()
{
   //????????
   var param="page="+mySlider.getValue();
   //??Ajax.Request??,????????showPage??
   myAjax = new Ajax.Request("getpage",{method: 'get',parameters: param ,onComplete: showPage});
}
function setSlider()
{
   var number=1;//???????1
   if ( arguments[0]=="first" )//??????
     number = 1;
   else if ( arguments[0]=="last" )//??????
     number=max;
   else if ( arguments[0]=="previous" )//???????
     number = mySlider.getValue()-1;
   else if ( arguments[0]=="next" )//???????
      number = mySlider.getValue()+1;
   mySlider.setValue(number,true);//????????
   postAjax();//??????
}
function showPage( request )
{
   //?????XML??
   var xmlDoc = request.responseXML;
   //?????<student>???
   var students = xmlDoc.getElementsByTagName("student");
   //???????,????result?
   var result ="<table border=1><tr><td>Student ID</td><td>Student Name</td><td>Student Class</td></tr>";
   for (var i=0;i<students.length;i++)
   {
     result +="<tr>";
     var student = students[i];
     result +="<td>"+student.getElementsByTagName("id")[0].firstChild.nodeValue+"</td>";
     result +="<td>"+student.getElementsByTagName("name")[0].firstChild.nodeValue+"</td>";
     result +="<td>"+student.getElementsByTagName("class")[0].firstChild.nodeValue+"</td>";
     result +="</tr>";
   }
   result +="</table>";
   //??????id?data????
   document.getElementById("data").innerHTML=result;
}