Grails - 使用复选框刷新对象列表?

时间:2012-02-01 21:57:18

标签: grails checkbox

所以我第一次潜入Grails并且正在努力完成我认为这将是一件容易的事情,所以我希望这是微不足道的。花在它上面的时间让我感到不同:)

因此,我在数据库中有一个与名为isActive的布尔值绑定的联系人列表。我希望在我的列表gsp中有一个复选框,用于确定是否显示非活动成员。

我尝试过使用Javascript函数(我可以成功调用,但不知道如何在调用后处理传递)。我还尝试添加一个g:if来检查框的checked属性是否已启用,但这会导致一个null对象(我怀疑会发生这种情况)。

我还尝试在复选框的onclick上附加一个remoteFunction调用,但遗憾的是我从来没有得到过回复。

有什么建议吗?谢谢,我很感激。第一次自学网络语言的挑战:)

<html>
    <head>
            <meta name="layout" content="main">
        <g:set var="entityName" value="${message(code: 'contact.label', default: 'Contact')}" />
        <title><g:message code="default.list.label" args="[entityName]" /></title>

    <g:javascript>
        function updateThisPage()
        {

        }
    </g:javascript>

</head>
<body>
    <a href="#list-contact" class="skip" tabindex="-1"><g:message code="default.link.skip.label" default="Skip to content&hellip;"/></a>
    <div class="nav" role="navigation">
        <ul>
            <li><a class="home" href="${createLink(uri: '/')}"><g:message code="default.home.label"/></a></li>
            <li><g:link class="create" action="create"><g:message code="default.new.label" args="[entityName]" /></g:link></li>
            <li><g:checkBox name="showInactives" value="${false}" onclick="....." /></li>
        </ul>
    </div>
    <div id="list-contact" class="content scaffold-list" role="main">
        <h1><g:message code="default.list.label" args="[entityName]" /></h1>
        <g:if test="${flash.message}">
        <div class="message" role="status">${flash.message}</div>
        </g:if>
        <table>
            <thead>
                <tr>
                <g:if test="${isActive?.checked}">
                    <g:sortableColumn property="firstName" title="${message(code: 'contact.firstName.label', default: 'First Name')}" />

                    <g:sortableColumn property="lastName" title="${message(code: 'contact.lastName.label', default: 'Last Name')}" />

                    <g:sortableColumn property="phone" title="${message(code: 'contact.phone.label', default: 'Phone')}" />

                    <g:sortableColumn property="email" title="${message(code: 'contact.email.label', default: 'Email')}" />

                    <g:sortableColumn property="title" title="${message(code: 'contact.title.label', default: 'Title')}" />

                    <g:sortableColumn property="jobFunc" title="${message(code: 'contact.jobFunc.label', default: 'Job Func')}" />
                </g:if>
                </tr>
            </thead>
            <tbody>
            <g:each in="${contactInstanceList}" status="i" var="contactInstance">
                            <g:if test="${contactInstance.isActive}">
                                <tr class="${(i % 2) == 0 ? 'even' : 'odd'}">

                                    <td><g:link action="show" id="${contactInstance.id}">${fieldValue(bean: contactInstance, field: "firstName")}</g:link></td>

                                    <td>${fieldValue(bean: contactInstance, field: "lastName")}</td>

                                    <td>${fieldValue(bean: contactInstance, field: "phone")}</td>

                                    <td>${fieldValue(bean: contactInstance, field: "email")}</td>

                                    <td>${fieldValue(bean: contactInstance, field: "title")}</td>

                                    <td>${fieldValue(bean: contactInstance, field: "jobFunc")}</td>

                                </tr>
                            </g:if>
            </g:each>
            </tbody>
        </table>
        <div class="pagination">
            <g:paginate total="${contactInstanceTotal}" />
        </div>
    </div>
</body>

1 个答案:

答案 0 :(得分:1)

你为什么不试试JQuery&amp; CSS组合?例如,对于您拥有的每个字段,根据其在数据库中的记录添加“活动”或“非活动”类。然后,当您单击该按钮时,只需为具有“非活动”类的所有元素添加“隐藏”类。

jQuery("#hideInactiveContact").click(function(){
   jQuery(".Inactive").addClass("Hidden");
});

jQuery("#showInactiveContact").click(function(){
   jQuery(".Inactive").removeClass("Hidden");
});

在CSS中,您可以执行以下操作,并隐藏“隐藏”类的所有元素:

.Hidden {
display: none;
}