編集履歴

質問編集履歴

解決しました！

2016/05/17 00:19

投稿

azxsedcvfr

スコア12

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -1,280 +1,34 @@
-###前提・実現したいこと
+解決しました！
-MVCを勉強するため、MVCを意識して
-簡易なタスクリストをJavaScriptで作っています。
-タスクはすでに登録してあり（jsonで取ってきたイメージ）
+###前提・実現したいこと
-ボタンをクリックすることで、クリックされたユーザーに合った
+ここに質問したいことを詳細に書いてください
-タスクをタスクリストに表示する機能を作りたいです。
+(例)PHP(CakePHP)で●●なシステムを作っています。
-別のユーザーをクリックすると、前のユーザのタスクは消え
+  ■■な機能を実装中に以下のエラーメッセージが発生しました。
-クリックしたユーザーのタスクに切り替わる。
 ###発生している問題・エラーメッセージ
-クリックされたユーザーに合ったタスクをDOMに書き出したいのだけど
-コードのどの位置にどのように書けばいいのか分からない。
+```
-MVC的にはどこに書くべきなのか？
+エラーメッセージ
+```
 ###該当のソースコード
-```JavaScript
+```ここに言語を入力
-window.addEventListener('load', function () {
-    new TaskListController();
+ここにご自身が実行したソースコードを書いてください
-    new UserListController();
-});
-/*ユーザーリスト関連*/
-function UserListController() {
-    var self = this;
-    this.view  = new UserListView();
-    this.model = new UserListModel();
-    EventDispatcher.on('userChange', function (id) {
-        var user = self.model.get(id);
-    });
-}
-function UserListModel() {
-    this.list = {
-        1: 'たかし',
-        2: 'まこと',
-        3: 'せいや'
-    };
-    this.get = function get(id) {
-        return this.list[id];
-    };
-    this.getAll = function getAll() {
-        return this.list;
-    };
-}
-function UserListView() {
-    this.model     = new UserListModel();
-    this.container = document.getElementById('userList');
-    this.create = function create(id, name) {
-        var btn = document.createElement('button');
-        btn.innerHTML = name;
-        btn.addEventListener('click', function (){
-            EventDispatcher.trigger('userChange', id);
-        });
-        return btn;
-    };
-    this.add = function add(user) {
-        this.container.appendChild(user);
-    };
-    var data = this.model.getAll();
-    for (var id in data){
-        var name = data[id];
-        var user = this.create(id, name);
-        this.add(user);
-    }
-}
-/*タスクリスト関連*/
-function TaskListController() {
-    this.view  = new TaskListView();
-    this.model = new TaskListModel();
-}
-function TaskListModel() {
-    this.list = {
-        1: ['食べる', '寝る', '遊ぶ'],
-        2: ['買い物', '散歩', '歌う'],
-        3: ['踊る', '寝る', '座る']
-    };
-    this.get = function get(id) {
-        return this.list[id];
-    };
-}
-function TaskListView() {
-    this.model     = new TaskListModel();
-    this.container = document.getElementById('taskList');
-    this.create = function create(text) {
-        var item = document.createElement('li');
-        item.innerHTML = text;
-        return item;
-    };
-    this.add = function add(task) {
-        this.container.appendChild(task);
-    };
-    var data = this.model.get();
-    for (var id in data){
-        var name = data[id];
-        var task = this.create(id, name);
-        this.add(task);
-    }
-}
-function EventDispatcher() {}
-EventDispatcher.callbacks = {};
-// イベント発火時に実行する関数を登録
-EventDispatcher.on = function on(type, callback) {
-    if ( typeof EventDispatcher.callbacks[type] === 'undefined' ){
-        EventDispatcher.callbacks[type] = [];
-    }
-    EventDispatcher.callbacks[type].push(callback);
-};
-// イベントを発火（指定されたイベントに登録されてる関数を実行）
-EventDispatcher.trigger = function trigger(type, data) {
-    var callbacks = EventDispatcher.callbacks[type];
-    for (var i = 0; i < callbacks.length; i++){
-        var callback = callbacks[i];
-        callback(data);
-    }
-};
 ```
@@ -282,9 +36,7 @@
 ###試したこと
-appendchild でタスクを追加するのだと考え、
+課題に対してアプローチしたことを記載してください
-試行錯誤してみたがうまく動かず、訳が分からなくなってしまった。

説明の補足をしました

2016/05/17 00:19

投稿

azxsedcvfr

スコア12

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -8,12 +8,18 @@
 タスクはすでに登録してあり（jsonで取ってきたイメージ）
-ボタンをクリックすることで、クリックされたユーザー名毎の
+ボタンをクリックすることで、クリックされたユーザーに合った
 タスクをタスクリストに表示する機能を作りたいです。
+別のユーザーをクリックすると、前のユーザのタスクは消え
+クリックしたユーザーのタスクに切り替わる。
 ###発生している問題・エラーメッセージ
 クリックされたユーザーに合ったタスクをDOMに書き出したいのだけど