مشکل درفصل 5

با سلام  خسته نباشید

من به یک مشکل عجیب در فصل 5 قسمت 5 (یعنی پاراگراف) افتادم که وقتی میخوام از javascript استفاده کنم و یک قسمتی از صفحه را نمایش بدم اون صفحه نمایش پیدا میکنه اما وقتی روی دکمه کلیک میکنم به صفحه مورد نظر نمیره   در صورتی که dump میکنم مقدار ارایه بهم نشون میدهد

<div id="header-wrapper">
  <div id="header-top-right">
      <img class="profile-image" src="<?=baseUrl()?>/image/empty-profile-24.png">
      <span style="margin-right: 5px"><?=$_SESSION['email']?> <?=_header_welcome?></span>
      <a style="margin-right: 5px" class="btn-blue" href="<?=fullBaseUrl()?>/user/logout"><?=_btn_logout?></a>
     </div>
</div>

<?=paginition('/notes-v2/note/catalog',2,'btn btn-blue','btn',$pageIndex,$pageCount);?>
<br>
<br>
<br>
<hr>
<br>
<br>
<span class="btn btn-blue" onclick="getPage(1)">1</span>
<span>..</span>
<? for ($i = $pageIndex - 3; $i <= $pageIndex + 3; $i++) { ?>
  <? if ($i <= 1) {
    continue;
  } ?>
  <? if ($i >= $pageCount) {
    continue;
  } ?>
  <? if ($i == $pageIndex) { ?>
    <span class="btn"><?=$i?></span>
  <? } else { ?>
    <span class="btn btn-blue"onclick="getPage(<?=$i?>)"><?=$i?></span>
  <? } ?>
<? } ?>
<span>..</span>
<span class="btn btn-blue" onclick="getPage(<?=$pageCount?>)"><?=$pageCount?></span>
<br>
<br>
<br>
<br>
<br>

<div id="notes">
     <ul class="todo-entry">
      <li>انجام</li>
      <li>حذف</li>
      <li>عنوان</li>
      <li>توضیحات</li>
      <li>زمان وقوع</li>
    </ul>

    <? if ($records == null){ $records = array(); } ?>
    <? foreach ($records as $record){
      if ($record['isDone']){
        $doneClass = "done";
      } else {
        $doneClass = "pending";
      }
      ?>
      <ul class="todo-entry <?=$doneClass?>">
        <li><span onclick="noteToggle(this, <?=$record['note_id']?>)" class="btn">*</span></li>
        <li><span onclick="noteRemove(this, <?=$record['note_id']?>)" class="btn">-</span></li>
        <li><?=$record['title']?></li>
        <li><?=$record['des']?></li>
        <li><?=jDate($record['eventTime'],'d M Y ')?></li>
      </ul>
    <? } ?>

    <br>
    <br>
    <div class="tal">
      <a href="/notes-v2/note/submit" class="btn-blue">درج یادآور</a>
    </div>
</div>

<script>
  function getPage(pageIndex) {
    $.ajax('/notes-v2/note/ajaxCatalog/' + pageIndex, {
      type: 'post',
      dataType: 'json',
      success: function (data) {
        $("#notes").html(data.html);
      }
    });
  }
  function noteToggle(sender, noteId){
    sender = $(sender);
    var parent = sender.parentsUntil('.todo-entry').parent();

    $.ajax('/notes-v2/note/toggle/' + noteId, {
      type: 'post',
      dataType: 'json',
      success: function(data) {
        if (parent.hasClass('done')){
          parent.removeClass('done');
          parent.addClass('pending');
        } else {
          parent.removeClass('pending');
          parent.addClass('done');
        }
      }
    });
  }

  function noteRemove(sender, noteId){
    sender = $(sender);
    var parent = sender.parentsUntil('.todo-entry').parent();

    $.ajax('/notes-v2/note/remove/' + noteId, {
      type: 'post',
      dataType: 'json',
      success: function(data) {
        parent.remove();
      }
    });
  }
</script>

 public function ajaxCatalog($pageIndex){

    if (!isset($_SESSION['user_id'])){
      exit;
    }

    $userId = $_SESSION['user_id'];

    $count=10;
    $startIndex=($pageIndex-1) * $count;
    $data['records']=NoteModel::catalogByPage($userId , $startIndex , $count);
    $recordsCount=NoteModel::countNotes($userId);
    $data['pageCount']=ceil($recordsCount/10);//ceil yani rond kardan
    $data['pageIndex']=$pageIndex;
    ob_start();
    View::render("/page/ajaxCatalog.php", $data);
    $output = ob_get_clean();


    echo json_encode(array(
      'status' => true,
      'html' =>$output,
    ));
  }
}