2009-09-01 5 views
0

받은 편지함 등을 표시하는 asp.net mvc로 메시지보기를 설정하려고합니다.이 구현에 활용할 수있는 좋은 도구는 무엇입니까?메시지보기에 가장 적합한 도구는 무엇입니까?

+0

jqGrid를 사용하여받은 편지함을 표시하지만 사용자가 묻는 것이 분명하지 않습니다. > 2 문장에서 당신의 필요를 규정하는주의? –

+0

그건 정확히 내가 의미했던 것입니다. 내가 너무 구체적이지 않다면 사과드립니다. 도구를 통해 나는 플러그인을 의미했습니다. 실제로 jqGrid를 사용했지만 더 많은 옵션이 있다면 관심이있었습니다. –

답변

1

OK, 여기 jqGrid와 함께하는 방법에 대해 알아 봅니다. 여기에 아이디어는 굵게 읽지 않은 메시지를 표시하고, Outlook과 같은 신체의 미리보기와 :

있는 jqGrid 사용자 정의 포맷터 (이 구문이있는 jqGrid 3.5이며, 이전 버전이 다른 :

importanceFormatter: function(cellval, opts, action) { 
    switch (cellval) { 
     case -1: 
      { 
       return '<img class="notificationImportanceIcon" alt="Low importance" title="Low importance" src="/Content/Images/lowimportance.png" />'; 
      } 
     case 1: 
      { 
       return '<img class="notificationImportanceIcon" alt="High importance" title="High importance" src="/Content/Images/highimportance.png" />'; 
      } 
    } 
    return cellval; 
}, 

recipientFormatter: function(cellval, opts, action) { 
    if (cellval) { 
     var html; 
     var i = 1; 
     for (i in cellval) { 
      if (i == 0) { 
       html = cellval[i]; 
      } 
      else { 
       html = html + '; ' + cellval[i]; 
      } 
     } 
     return html; 
    } 
    return cellval; 
}, 

messageFormatter: function(cellval, opts, action) { 
    if (cellval) { 
     var subject = '<span class="notificationSubject">' 
      + (cellval.Subject || "") + '</span>'; 
     var body = cellval.Body || ""; 
     var read = cellval.IsRead; 
     var html; 
     if ((body !== "") && (!read)) { 
      var maxLength = 200; 
      var excerpt = body.length > maxLength ? 
       body.substring(0, maxLength - 1) + "...." : body; 
      html = subject + '<br /><span class="notificationBody" title="' 
       + body + '" >' + excerpt + '</span>' 
     } 
     else { 
      html = subject; 
     } 
     if (!read) { 
      html = '<span class="unread">' + html + '</span>'; 
     } 
     return html; 
    } 
}, 

CSS :

td.unread span.notificationSubject 
{ 
    font-weight: bold; 
} 

td span.notificationBody 
{ 
    color: Blue; 
    font-size: smaller; 
} 

#listTable tbody td 
{ 
    cursor: pointer; 
    vertical-align: text-top; 
} 

.notificationHighImportance 
{ 
    color: Red; 
    font-weight: bolder; 
} 

.notificationLowImportance 
{ 
    color:Blue; 
} 

img.notificationImportanceIcon 
{ 
    vertical-align: text-bottom; 
} 

td > img.notificationImportanceIcon 
{ 
    display: block; 

    /* not sure why, but the following centers the image - taken from a W3C example */ 
    margin-left: auto; 
    margin-right: auto; 
} 

그리드 구성 : 엔티티에

setupGrid: function(grid, pager, search) { 
    grid.jqGrid({ 
     colNames: ['AltId', '', 'From', 'Subject', 'To', 'Received', 'Actions'], 

     colModel: [ 
      { name: 'AltId', index: 'AltId', hidden: true }, 
      { name: 'Importance', index: 'Importance', width: 10, formatter: Vertex.Notification.List.importanceFormatter }, 
      { name: 'From', index: 'From', width: 50 }, 
      { name: 'NotificationMessage', index: 'Subject', width: 200, formatter: Vertex.Notification.List.messageFormatter, sortable: false }, 
      { name: 'Recipients', index: 'To', width: 50, formatter: Vertex.Notification.List.recipientFormatter, sortable: false }, 
      { name: 'Created', index: 'Created', width: 60, align: 'right', formatter: Vertex.UI.Grid.dateTimeFormatter }, 
      { name: 'ActionsAltId', index: 'ActionsAltId', width: 38, formatter: Vertex.UI.Grid.rowEditButtons, formatoptions: { buttons: { HideEdit: false} }, sortable: false } 
     ], 
     pager: pager, 
     sortname: 'Created', 
     sortorder: "desc" 
    }).navGrid(pager, { edit: false, add: false, del: false, search: false }); 
    search.filterGrid(grid.attr("id"), { 
     gridModel: false, 
     filterModel: [{ 
      label: 'Search', 
      name: 'search', 
      stype: 'text' 
      }] 
     }); 
    } 
}; 

LINQ :

[AcceptVerbs(HttpVerbs.Get), CacheControl(HttpCacheability.NoCache)] 
    public ActionResult ListGridData(JqGridRequest gridRequest) 
    { 
     var q = (from n in Repository.SelectAll() 
       from nr in n.NotificationRecipients 
       where nr.Recipient.UserName.Equals(
        LoggedInUserName, StringComparison.InvariantCultureIgnoreCase) 
       orderby n.Created descending 
       select new PresentationModel 
       { 
        Id = n.Id, 
        AltId = n.AltId, 
        ActionsAltId = n.AltId, 
        Importance = n.Importance, 
        From = n.Creator.Person.DisplayName, 
        Created = n.Created,   
        Subject = n.Subject, //used for search 
        Recipients = from r in n.NotificationRecipients 
            select r.Recipient.Person.DisplayName, 
        NotificationMessage = new NotificationMessage 
        { 
         Body = n.Body, 
         Subject = n.Subject, 
         IsRead = nr.MarkedAsRead /*IsRead for current user*/ 
        } 
       }).ToList().AsQueryable(); 
     return Json(q.ToJqGridData(
      gridRequest.ToGridPageDescriptor(new [] {"From", "Subject"}))); 
    } 

my series of articles on using jqGrid with ASP.NET MVC on my blog을 찾을 수 있습니다.

관련 문제