0

linq を使用して過去 2 日間のデータを取得している 1 つのページに一連のデータがあります。さらに 5 日間のデータを取得するボタン クリックを作成したいと考えています。2 日間のデータを取得するためのコードを見つけてください。さらにロードするには、これをコードプレスに追加する必要があります

https://demos.telerik.com/kendo-ui/m/index#mobile-listview/press-to-load-more

<div data-role="view" id="divData">
  <ul data-role="listview" data-bind="ListofEmployeeData">
    <li>
      <span data-bind="text:EmpID"></span>
      <span data-bind="text:EmpName"></span>
      <span data-bind="text:Empemail"></span>
    </li>
  </ul>
</div>

function EmployeeDetails() {
  self.ListofEmployeeData = ko.observableArray([]);
  self.getTotalStarRating = function () {
    ///Mobile DeviceUUId
    var Model = {deviceUUID: deviceId};
    $.ajax({
      type: "POST",
      dataType: "json",
      data: Model,
      url: serverUrl + 'xx/xx/xx',
      success: function (data) {
        self.ListofEmployeeData($.map(data, function (item) {
          return new EmployeeModel(item);
        }));
      }
    });
  }
}

function EmployeeModel(item)
{
  self.EmpID=ko.observable(item.empId);
  self.EmpName=ko.observable(item.EmpName);
  self.Empemail=ko.observable(item.Empemail);
}
4

1 に答える 1

0

サーバーへのデータ要求には、ロードする日または何日かを示すプロパティが必要であり、サーバー側では、そのプロパティに基づいてデータのみを返す必要がありますDayNumber。

Load more を 1 回だけ押す必要がある場合は、ajax の成功でボタンを非表示にすることができます。しかし、データをロードし続けたいが、どれだけのデータが残っているかわからない場合は、バックエンドで何らかの方法でロジックを変更して、戻りデータを送信する必要があります。

次に、データを取得するたびに新しい要素を配列にプッシュする必要があります。

thisモデルとサブモデルごとに分けておくことを忘れないでください。また、あなたの見解では、バインドしているの<ul data-role="listview" data-bind="ListofEmployeeData">がわかりますが、次のようなバインディング名を付けるのを忘れていましたforeach :ListofEmployeeData

function EmployeeDetails() {
  var self = this;
  self.DayNumber = ko.observable(2);
  self.ListofEmployeeData = ko.observableArray([]);

  self.getTotalStarRating   = function () {
  var Model = {deviceUUID: deviceId,DayNumber: self.DayNumber()};
    $.ajax({
      type: "POST",
      dataType: "json",
      data: Model,
      url: serverUrl + 'xx/xx/xx',
      success: function (data) {
       // here based on your logic you need to hide your button load more if there is no more data for example if you know that once you have loaded DayNumber 5 then hide it 
       // if(self.DayNumber() == 5) hide your button
       $.map(data, function (item) {
            self.ListofEmployeeData.push(new EmployeeModel(item));
        });
    }})
  }
   // On your view bind a click event to loadMore as button
    self.LoadMore = function(){
        // here you update DayNumber based on your logic
        self.DayNumber(5);
        self.getTotalStarRating();
      }
   }
    function EmployeeModel(item)
    { var self = this;
      self.EmpID=ko.observable(item.empId);
      self.EmpName=ko.observable(item.EmpName);
      self.Empemail=ko.observable(item.Empemail);
    }
于 2016-12-27T15:37:38.113 に答える