在Grails应用中动态显示用户



所以我有能力从一个视图中的数据库中列出所有用户,但我想按字母顺序和标签列出它们。例如,我会有"所有"、"a"、"B"、"C"等选项卡。我希望发生的是,当用户单击"A"选项卡时,它只显示姓氏以"A"开头的用户。

我的想法是这样的:

<ul class="tabs">
  <li><a href="#A">A</a></li>
  <li><a href="#B">B</a></li>
  <li><a href="#C">C</a></li>
  ...
</ul>
<div class="tabcontents">
  <div id="All">
    <nav>
      <ul>
        <g:each var="user" in="${users}" ID="">
          <li><g:link controller="user" action="profile" id="${user.employeeNumber}">${user.lastName}, ${user.firstName}</g:link></li>
        </g:each>
      </ul>
    </nav>
  </div>
  <div id="A">
    <nav>
      <ul>
        <g:each var="user" in="${users}" ID="A">
          <li><g:link controller="user" action="profile" id="${user.employeeNumber}">${user.lastName}, ${user.firstName}</g:link></li>
        </g:each>
      </ul>
    </nav>
  </div>
  ...
</div>

与后端UserController包含类似

的内容
class UserController {
  def index() {
    def users = UserFeed.createCriteria().list {
      eq('lastName[0]', '${ID}')
    }
    render(view: 'index', model: [users: users])
  }
  def search() {
  }
  def results(String lastName) {
    def users = UserFeed.where { 
      lastName =~ "%${lastName}%" 
    }.list()
    return [ users: users,
         term: params.lastName,
         totalUsers: UserFeed.count() ]
  }
    def profile(String id) {
    def user = UserFeed.findByEmployeeNumber(id)
    render(view: 'profile', model: [user: user])
    }
}

所以这个想法是,当用户单击选项卡时,选项卡的字母被发送到控制器,在控制器中比较数据库中姓氏的第一个字母,如果匹配则添加到列表中。这可能吗?有什么巧妙的方法吗?

提前感谢!

编辑:我可以使用蛮力,我只是想避免每个字母都有26组用户。

编辑2:我试过这样做,但是没有用
<div id="A">
  <nav>
    <ul>
      <g:each var="user" in="${users}">
        <g:if test="${user.lastName.charAt(0)} == 'A'">
          <li style="padding-left:5px;"><g:link controller="user" action="profile" id="${user.employeeNumber}">${user.lastName}, ${user.firstName}</g:link></li>
        </g:if>
      </g:each>
    </ul>
  </nav>
</div>

我已经验证了user.lastName.charAt(0)打印出正确的字母,但是出于某种原因,g:if语句没有将列表限制为只有A。知道为什么吗?

我认为一个很容易渲染成选项卡的模型是一个很好的开始。例如,控制器方法可以返回一个模型,该模型包含一个Map,其中包含用于键的字母和用于值的每个字母下的用户。

从用户列表和所选字母开始,下面是一个如何在Groovy中创建这样一个Map的示例:

def selectedLetter = 'A'
def tabs = users
     .groupBy { it.lastName[0].toUpperCase() }
     .collectEntries { k, v -> [k, v.sort() {a, b -> a.lastName <=> b.lastName}] }   
     .collectEntries { k, v -> k == selectedLetter ? [k, v] : [k, null] }

返回一个稀疏映射;通过将所有其他字母设置为空,只包括所选字母的用户。接下来,返回一个包含制表符的模型:

render(view: 'index', model: [tabs: tabs])
有了这样一个模型,选项卡就可以动态地呈现如下:
<ul class="tabs">
    <g:each var="letter" in="${tabs.keySet().sort()}">
        <li class="${tabs.letter != null ? 'active' : ''">
            <a href="#${letter}">${letter}</a>
        </li>
    </g:each>
</ul>

选项卡的内容可以这样呈现:

<div class="tabcontents">
    <g:each var="letter" in="${tabs.keySet().sort()}">
        <div id="${letter}">
            <nav>
              <ul>
                <g:each var="user" in="${tabs.letter}">
                  <li><g:link controller="user" action="profile" id="${user.employeeNumber}">${user.lastName}, ${user.firstName}</g:link></li>
                </g:each>
              </ul>
            </nav>
        </div>        
    </g:each>  
</div>

相关内容

  • 没有找到相关文章

最新更新