Grails GSP Boucle à travers un index et faire quelque chose avec des lignes sélectionnées

Question

Dans un index-gsp, je veux être capable de sélectionner un nombre arbitraire de lignes et ensuite en cliquant sur un lien envoyer toutes ces lignes à un contrôleur pour traitement par ex. créer de nouveaux objets d'un genre différent.

Je n'ai aucune idée de comment la sélection peut être faite ou comment collecter ces lignes sélectionnées dans un GSP. Peut-être que je devrais utiliser une case à cocher sur chaque ligne si c'est possible?

C'est une liste de produits qui est affichée en utilisant un index.gsp modifié. Chaque ligne de produits a une case à cocher devant. Ce que je veux, c'est faire une liste des produits qui sont vérifiés puis transmettre cette liste à un contrôleur.

une partie de cette 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> 

Donc ce pas une forme ordinaire, juste une liste où je veux utiliser un lien pour le transmettre au contrôleur. Je suis un débutant et je n'ai aucune idée de comment le faire.

Answer 1

Vous pouvez collecter toutes les données nécessaires à partir de la page en utilisant javascript, puis envoyer toutes les données à votre contrôleur pour traitement. Il y a beaucoup de façons de le faire. Par exemple envoyer via 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

Je répondrai à cela, mais doivent ralentir car il se sent comme je commence à écrire votre projet:

En gsp vous aurez besoin d'avoir un champ caché suivi par une case à cocher parmi les données que vous essayez de capturer, la case à cocher doit contenir tous les éléments de données requis pour générer votre sortie.

<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}" /> 

Dans le segment java script de la page, vous devez ajouter ce qui suit

Ce sera alors la sélection automatique de sélection et ajouter à javascript tableau

// 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 
    } 
}; 

Plus important encore, vos données s'asseoir à travers de nombreuses pages de liste de GSP différentes si oui, vous aurez besoin de pirater la pagination:

//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; 
}); 

Ensuite, dans le contrôleur analyser le champ de formulaire de JSON et d'en faire ce que vous voulez, quand posté

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