Grails GSP通过索引循环并选择行做什么

Question

在Index-gsp中，我希望能够选择任意数量的行，然后通过单击链接将所有这些行发送到控制器进行处理，例如，创造另一种新的物体。

我不知道如何做选择或如何在GSP中收集这些选定的行。也许我应该在每一行上使用复选框，如果可能的话？

这是使用修改后的index.gsp显示的产品清单。 每个产品线都有一个前面的复选框。 我想要的是制作检查产品的清单，然后将此清单发送给控制器。

这index.gsp中的一部分：

 <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:link class="create" action="createOffer"><g:message code="default.new.label" args="[entityName]" params="toOffer" /></g:link></li> 
    </ul> 
</div> 
<div id="list-prodBuffer" 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> 
       <td> Välj</td> 
       <td> ID</td> 
      </tr> 
     </thead> 
    <tbody>    
     <g:each in="${prodBufferList}" status="i" var="prodBuffer"> 
      <tr class="${ (i % 2) == 0 ? 'even': 'odd'}"> 
             <td><g:checkBox name="toOffer" value="${prodBuffer.id}" checked="false" /></td> 
             <td>${prodBuffer.id}</td> 

所以这不是一个普通的形式，只是一个列表，我想用一个链接发送到控制器。

我是初学者，不知道该怎么做。

Answer 1

您可以使用JavaScript从页面收集所有必要的数据，然后将所有数据发送到您的控制器进行处理。 有很多方法可以做到这一点。 例如通过JQuery派：

<script> 

//some code 

var items = [1,2,3]; 

//some code 

    $('#add-location').click(function() { 
    $.ajax({ 
     type: "POST", 
     url: "${g.createLink(controller:'myController', action: 'myControllerMethod')}", 
     data: {items: items}, 
     success: function (data) { 
     console.log(data) 
     } 
    }); 
    }); 
</script> 

Answer 2

我会回答这个问题，但有放缓，因为那感觉就像我开始写你的项目：

在GSP你需要有一个隐藏字段，之后通过您尝试捕获的数据中的复选框，复选框应包含构建输出所需的所有数据元素。

<g:hiddenField name="userSelection" value=""/> 

<g:checkBox name="myCheckBox" id='myCheckBox' value="${instance.id}" 
    data-field1="${instance.field1}" data-field1="${instance.field1}" 
    checked="${instance.userSelected?.contains(instance.id)?true:false}" /> 

在页面的Java脚本段，你将需要添加以下

这一操作将自动选择选择并添加JavaScript数组

// Customized collection of elements used by both selection and search form 
$.fn.serializeObject = function() { 
    if ($("[name='myCheckBox']:checked").size()>0) { 
     var data=[] 
     $("[name='myCheckBox']:checked").each(function() { 
      var field1=$(this).data('field1'); 
      var field2=$(this).data('field2'); 
      data.push({id: this.value, field1:field1, field2:field2 }); 
    }); 
      return data 
    } 
}; 

更重要的是将你的数据坐在跨越许多不同的gsp上市页面，如果是这样你需要破解分页：

//Modify pagination now to capture 
$(".pagination a").click(function() { 
    var currentUrl=$(this).attr('href'); 
    var parsedUrl=$(this).attr('href', currentUrl.replace(/\&userSelection=.*&/, '&').replace(/\&userSelection=\&/, '&')); 
    var newUrl=parsedUrl.attr('href') + '&userSelection=' + encodeURIComponent($('#userSelection').val()); 
    window.location.href=newUrl 
    return false; 
}); 

然后在控制器解析JSON窗体域，使之成为你想要的东西贴

def u=[] 
def m=[:] 
if (params.userSelection) { 
def item=JSON.parse(params.userSelection) 
item?.each {JSONObject i-> 
     // When field1 is null in JSON set it as null properly 
     if (JSONObject.NULL.equals(i.field1)) { 
       i.field1=null 
     } 

     if (resultsGroup) { 
       if (!resultsGroup.contains(i.id as Long)) { 
         u << i 
       } 
     } else { 
       u << i 
     } 
} 
m.userSelected=item?.collect{it.id as Long} 
m.results=u 
} 
return m