2017-02-02 10 views
0

私は剣道UIスケジューラのビューを切り替える必要があります。私のビューは週になりますが、チェックボックスをクリックするとweekとworkWeekの間で週のビュータイプを変更します。これを行う方法?ここで剣道UIスケジューラでweekとworkWeekを切り替える方法

がHTML

<label><input type="checkbox" ng-model="hideWeekend" ng-change="hideWeekends(hideWeekend);" value="true" />Hide Weekend</label> 

<div id="team-schedule"> 
         <div kendo-tooltip k-content="tooltipContent" k-filter="'.k-event'" class="k-group"> 
          <div id="target"></div> 
          <div kendo-scheduler="weeklyScheduler" k-options="weeklySchedulerOptions" id="scheduler"></div> 
         </div> 
        </div> 

JSコード

$scope.schedulerDS = new kendo.data.SchedulerDataSource({ 
     batch: true, 
     filter: { 
      logic: "or", 
      filters: [ 
       { field: "ownerId", operator: "eq", value: 1 }, 
       { field: "ownerId", operator: "eq", value: 2 } 
      ] 
     } 
    }); 

var weekOrWorkWeek = 'workWeek'; 
$scope.loadWeeklySchedule = function (value) { 
     $scope.weeklySchedulerOptions = { 
      autoBind: false, 
      date: new Date(), 
      height: 600, 
      views: [{ type: value, selected: true, majorTick: 15, footer: false, allDaySlot: false }], 
      timezone: "Etc/UTC", 
      dataSource: $scope.schedulerDS, 
      resources: [ 
      { 
       field: "ownerId", 
       title: "Owner", 
       dataSource: [ 
       { text: "Alex", value: 1, color: "#f8a398" }, 
       { text: "Bob", value: 2, color: "#51a0ed" }, 
       { text: "Charlie", value: 3, color: "#56ca85" } 
       ] 
      } 
      ] 
     }; 
    }; 

$scope.hideWeekends = function (value) { 
     if (value == true) { 
      weekOrWorkWeek = 'workWeek'; 
      $scope.loadWeeklySchedule(weekOrWorkWeek); 
      $scope.weeklySchedulerOptions.dataSource.read(); 
     } else { 
      weekOrWorkWeek = 'week'; 
      $scope.loadWeeklySchedule(weekOrWorkWeek); 
      $scope.weeklySchedulerOptions.dataSource.read(); 
     } 
    }; 
    $scope.loadWeeklySchedule(weekOrWorkWeek); 

答えて

2

であるあなたは、スケジューラオプションのビュー列にビュータイプ「週間労働時間」を追加することによって、このビューを有効にすることができますから、オブジェクト行こう。

また、これは、スケジューラのトップツールバーのビューの選択が表示されますが、あなたはCSSルールを追加することによって、それを削除することができます

ビューを切り替える
.k-scheduler-views { 
    display: none; 
} 

は、スケジューラのビューメソッドを使用して行うことができます。

$("#scheduler").data("kendoScheduler").view("ViewName") 

ここにはPlunker with a demoがあります。

+0

これを行うには角度があります。 –

+0

ええ、確かに。どの角度の角度を使用していますか? – Shai

+0

"バージョン": "1.4.12"です。 –

関連する問題