-1

I want to call a jquery function in grails g:each element, i'm using a function call on page load to filter a table which has a loop as follows

   <g:each in="${sampleTypes}" status="i" var="sampleType">
<div class="uniq">${sampleType}</div>
<table id="sampleTable">
    <thead>
        <tr>
            <th class="no-sort"><g:message code="labWorkItem.testUnit.label"
                    default="CustomerId" /></th>

            <th class="no-sort"><g:message code="labWorkItem.testUnit.label"
                    default="OrderNo" /></th>
            <th class="no-sort"><g:message code="labWorkItem.testUnit.label"
                    default="DateCreated" /></th>
            <th class="no-sort"><g:message code="labWorkItem.testUnit.label"
                    default="Test unit" /></th>

            <th class="no-sort no-visible"><g:message
                    code="labWorkItem.sampleType.label" default="Sample Type" /></th>
        </tr>
    </thead>
    <tbody>
        <g:each in="${labWorkItemInstance}" status="a" var="labWorkItem">
            <tr class="${(a % 2) == 0 ? 'even' : 'odd'}">
                <td>
                    ${labWorkItem?.order?.customer?.customerId}
                </td>
                <td>
                    ${labWorkItem?.order?.orderNo}
                </td>
                <td>
                    ${labWorkItem?.order?.dateCreated}
                </td>
                <td >
                    ${labWorkItem?.testUnit}
                </td>
                <td id = "labSample">
                    ${labWorkItem?.testUnit?.sampleType}
                </td>
            </tr>
        </g:each>
    </tbody>
</table>
<g:textField name="singleValue" value="Blood" id="someHiddenField"/>
</g:each>

i am using the class "uniq" to filter the table

function typeSampleCollected() {
jQuery.fn.dataTableExt.afnFiltering.push(function(oSettings, aData,
        iDataIndex) {
    if (oSettings.nTable.id != "sampleTable") {
        return true;
    }

        var uniq = jQuery("div.uniq").html();
alert(uniq);
     jQuery("#someHiddenField").val(uniq);
     var someHiddenField = jQuery("#someHiddenField").val()
    if(someHiddenField){
        //var sampleValue = jQuery("#someHiddenField").val();
        //alert(sampleValue.toString());
    if (someHiddenField != aData[4]){
        console.log("sampleType"+someHiddenField);
        console.log("aData"+aData[4]);
        return false;
        }
    }
    else{
        console.log("else condition");
        }
    return true;
});
}

The problem is, it executes at the first on page load, only the first data of the loop executed others remains the same, i want the remaining data also to execute.

Community
  • 1
  • 1
John
  • 137
  • 1
  • 4
  • 12

1 Answers1

0

jQuery + HTML answer.

  1. Your generated HTML will be wrong because the id "someHiddenField" will be duplicated. An id has to be unique within the HTML document. View the source of the document to check. Copy into an IDE or use w3c validator to check.

  2. Once you have unique ID's you need to iterate over them and run your filter.

I am not sure whether by filter you are sending information back to the server. i.e. text blood results in only content relating to blood being displayed. I don't see any events in your code. Is the code incomplete?

A similar thing - click on an icon to only display items relating to that class. View code: 

<g:each in="${assetTypes}" status="i" var="assetType">
      <li>
          <a href="javascript:void(0)" name="assetTypeSelector" id="assetTypeSelector-${assetType.iconId}" class="icon-small-assetType-${assetType.iconId} ${(activeAssetType.id.toString()==assetType.id.toString()?' selected':'')}"><span class="atext">${assetType.name?.encodeAsHTML()}</span></a>
      </li>
</g:each>

I used delegate() to late-bind jQuery to the click - use go() after 1.7 jQuery. The javascript had to be in a grails view because I use the gsp tags. With delegate() it could be anywhere:

    /* Change asset types */
    jQuery('body').delegate('[name=assetTypeSelector]', 'click', function() {
        var newAssetIconId = jQuery(this).attr("id").split("-").pop();

        // set the asset type.
        ${remoteFunction(controller: 'assetType', action: 'selector', name: 'assetTypeSelector',  update: 'assetTypeSelector', params:'\'currentAssetTypeIconId=\' + newAssetIconId')}

    });

Alternatively we have had a lot of success with DataTables which is a more complete solution.

Interlated
  • 5,108
  • 6
  • 48
  • 79
  • Thanks for your reply, i want to loop a table and filter the the table td's using the set of values comes from server, can you tell me how to do that – John Feb 11 '14 at 05:33
  • By filter do you mean not display the table row? There is no user interaction - ie type in something to trigger the filter? If there is no user action it would be better to do it server side or at least with gsp conditionals. – Interlated Feb 11 '14 at 06:20
  • yes there will be no user interaction, i have three samples like blood ,Urine,tissues as one database table and patients list from who these samples are not still collected as another database table, what i need to bring is, i need to bring patient list who have not collected blood as one table and patient list who have not collected Urine as one table and patient list who have not collected tissues as one table, i need to separate them using those sample like blood, urine and tissues – John Feb 11 '14 at 10:21
  • Your solution should therefore be to select filtered lists in grails. The dynamic finders will probably help you - findWhereCollectedTissue(false) or similar. Display that in the view and avoid cluttering it up with filter logic. – Interlated Feb 12 '14 at 00:44
  • thanks for your kind reply, but i gave blood, tissues and urine as an example the sample can be more than hundred also in that case how to use this findWhereCollected – John Feb 12 '14 at 04:48
  • Query on the database side - details are in the documentation: http://grails.org/doc/latest/guide/GORM.html#querying – Interlated Feb 13 '14 at 05:47