2016-04-25 5 views
0

誰でもここに少しの経験がありますAt.jsAt.jsを持つ2人のリスナー

私は今、奇妙なバグを持っています。私はすべてを100回チェックして再点検しました。

フォームに2つのリスナーを割り当てます。 1は「@」のシンボルを取り込み、もう1つは「イベント:」というテキストでイベントを取得します。

"tagUsersConfig"オプションはうまく動作しますが、 "tagEventsConfig"は奇妙な動作をします。それは最初の5つのイベントをフェッチし、最初の文字の入力を開始するとすぐに、リストに表示されている各JSONオブジェクトを返すという事実を(コンソールで)知っていてもリストが消えます。 API(すべてが型付き文字に応じて正確です)。

tagEventsConfig(イベント)にユーザーのAPIクエリを貼り付けると、「イベント:」が機能するようになりました。最も奇妙な部分は(そしてあなたはそれを私の言葉を取らなければならないでしょう)、イベントAPIコールとその変数はすべて完全に正確で有効です。

理論:私は、ユーザーの名前とイベント名が同じ、予想される構造(スペース、そして時には特殊文字を持っているので、それはすべてのマッチャーコールバックに関係していますが、私はなぜ表示されないと思っています)。

var userList; 
var eventList; 

var tagUsersConfig = { 
    at: "@", 
    displayTpl: "<li class='replyToAtWho-list-item clearfix'><div class='feed-replyTo-img' style='${imageId}'></div><div class='left'><div class='feed-replyTo-name'>${name}</div><div class='feed-replyTo-realName'>${realName}</div></div></li>", 
    insertTpl: '<span class="feed-reply-to-name-link" data-userNameReplyTo="${name}" data-userIdReplyTo="${userId}">${name}</span>&nbsp;', 
    callbacks: { 
    remoteFilter: function(query, render_users) { 

     $.getJSON(DOMAIN + '/Skeddy/rest/gem/v1/user?institutionid='+CAMPUS_ID+'&apitoken='+USER_TOKEN+'&limit=10&fullname=' + encodeURIComponent(query), function(data) { 

     userList = $.map(data.listT, function(value, i) { 
      var imageId = (parse_OBJ(value.i, "ImageId")) ? DOMAIN + '/Skeddy/rest/gem/v1/image/' + parse_OBJ(value.i, "ImageId") + '?sname=CampusSchema&apitoken=' + USER_TOKEN : '/' + ROOT + '/img/avatar-default.png'; 
      return { 
      'userId': value.id, 
      'realName': value.name, 
      'name': parse_OBJ(value.i, "firstName") + " " + parse_OBJ(value.i, "lastName"), 
      'imageId' : 'background-image : url("' + imageId + '")' 
      }; 
     }); 

     render_users(userList); 

     }); 
    }, 
    matcher: function(flag, subtext, should_start_with_space) { 
     var match, regexp; 
     flag = flag.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&"); 
     if (should_start_with_space) { 
     flag = '(?:^|\\s)' + flag; 
     } 
     regexp = new RegExp(flag + '([A-Za-z0-9_\\s\+\-\]*)$|' + flag + '([^\\x00-\\xff]*)$', 'gi'); 
     match = regexp.exec(subtext.replace(/\s/g, " ")); 
     if (match) { 
     return match[2] || match[1]; 
     } else { 
     return null; 
     } 
    } 
    }, 
    delay: 20 
}; 

var tagEventsConfig = { 
    at: "event:", 
    displayTpl: "<li class='itemAtWho-list-item clearfix'><div class='feed-item-img' style='${imageId}'></div><div class='left'><div class='feed-item-name'>${eventName}</div><div class='feed-replyTo-realName'>10-10</div></div></li>", 
    insertTpl: '<a href="' + DOMAIN + '/website/event-details/' + CAMPUS_ID + '/${eventId}" class="fp-ext-link" target="_blank">${eventName}</span>&nbsp;', 
    callbacks: { 
    remoteFilter: function(query, render_events) { 

     $.getJSON(DOMAIN + '/Skeddy/rest/gem/v1/event?institutionid='+CAMPUS_ID+'&apitoken='+USER_TOKEN+'&limit=10&state=published_expired&name=' + encodeURIComponent(query), function(data) { 

     eventList = $.map(data.listT, function(value, i) { 
      var imageId = (value.imageId) ? DOMAIN + '/Skeddy/rest/gem/v1/image/' + value.imageId + '?sname=CampusSchema&apitoken=' + USER_TOKEN : '/' + ROOT + '/img/avatar-default.png'; 
      return { 
      'eventId': value.eventId, 
      'eventName': value.name, 
      'imageId' : 'background-image : url("' + imageId + '")' 
      }; 
     }); 

     render_events(eventList); 

     }); 
    }, 
    matcher: function(flag, subtext, should_start_with_space) { 
     var match, regexp; 
     flag = flag.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&"); 
     if (should_start_with_space) { 
     flag = '(?:^|\\s)' + flag; 
     } 
     regexp = new RegExp(flag + '([A-Za-z0-9_\\s\+\-\]*)$|' + flag + '([^\\x00-\\xff]*)$', 'gi'); 
     match = regexp.exec(subtext.replace(/\s/g, " ")); 
     if (match) { 
     return match[2] || match[1]; 
     } else { 
     return null; 
     } 
    } 
    }, 
    delay: 20 
}; 

$POST_FORM_MASTER.find(".feed-form.mention").atwho(tagEventsConfig).atwho(tagUsersConfig); 

ありがとうございます。

答えて

0

ああ。ワオ。私はそれを考え出した。

前に:私はその変数(例: '$ {名前}')を実現しませんでした

eventList = $.map(data.listT, function(value, i) { 
     var imageId = ... 
     return { 
     'eventId': value.eventId, 
     'name': value.name, // ********** Here is the fix ********** 
     'imageId' : 'background-image : url("' + imageId + '")' 
     }; 
    }); 

eventList = $.map(data.listT, function(value, i) { 
     var imageId = ... 
     return { 
     'eventId': value.eventId, 
     'eventName': value.name, // ********** Here was my mistake ********** 
     'imageId' : 'background-image : url("' + imageId + '")' 
     }; 
    }); 

後 'displayTpl' /中 'をinsertTpl' していました実際のオブジェクトのキーであり、私がeventList配列( 'eventName')に与えていたキー名ではありません。

しかし、私はtagUsersConfigオプションで自分のキーに名前を付ける/ラベル付けして、それらを 'displayTpl'/'insertTpl'に挿入するので、これは100%の意味を成しません。とても混乱します。

関連する問題