grailsアプリケーション用のjqueryデータテーブルに値が設定されていない

controller-actionから値リストを取得してdata-tableにロードする値を取得しています。コントローラのアクションから値が正しく取得されていることを確認しましたが、 data-tableに負荷EDを取得.ANDそれはgrailsアプリケーション用のjqueryデータテーブルに値が設定されていない

利用可能

ませデータを示していないことはここでは私のコントローラです。ここで

package com.standout.utilityapplication 
 
import grails.plugin.springsecurity.annotation.Secured 
 

 
@Secured(['ROLE_ADMIN']) 
 
class ReportController { 
 
\t AdminService adminService 
 
    def report() { 
 
\t \t 
 
\t \t println ("--Inside ReportController"); 
 
\t } 
 
\t def searchAjax(){ 
 
\t \t String criteria = params.search_criteria 
 
\t \t println ("criteria "+criteria) 
 
\t \t if(criteria.equalsIgnoreCase("Employee ID")){ 
 
\t \t def resultSet = adminService.getReportById(params) \t 
 
\t \t println("----------------+++++ "+resultSet) 
 
\t \t [bill_details:resultSet] 
 
\t \t } 
 
\t \t 
 
} 
 
}

私のGSPです。

<html> 
 
<head> 
 
    <title>Report</title> 
 
    <link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"/> 
 
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.12/css/dataTables.jqueryui.min.css"/> 
 
    <script type="text/javascript" src="//code.jquery.com/jquery-1.12.3.js"></script> 
 
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script> 
 
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.12/js/dataTables.jqueryui.min.js"></script> 
 
<script> 
 
function displayTable(){ 
 
\t $(function() { 
 
    $('#example').DataTable(); 
 
\t }) 
 
\t document.getElementById('reportSearch').style.display = '' 
 
\t 
 
} 
 
\t </script> 
 
</head> 
 
<body> 
 
<g:formRemote name="billSearchForm" class="form-horizontal" onComplete="displayTable()" url="[controller: 'Report', action:'searchAjax']"> 
 
<div id="reportSearch" style="border-bottom: 1px solid;display:none;padding-right:45px;" class="col-sm-9"> 
 
<br/> 
 
<br/> 
 
<table id="example" class="display" cellspacing="0" width="100%"> 
 
     <thead> 
 
      <tr> 
 
       <th>Employee Id</th> 
 
       <th>Bill Date</th> 
 
       <th>Amount</th> 
 
       <th>No. of Persons</th> 
 
       <th>Bank Submission Date</th> 
 
       <th>Bank Submission Status</th> 
 
       <th>Bill Date</th> 
 
       <th>Reimbursed</th> 
 
       <th>Restaurant Name</th> 
 
       <th>Team</th> 
 
      </tr> 
 
     </thead> 
 
     <tfoot> 
 
      <tr> 
 
       <th>Employee Id</th> 
 
       <th>Bill Date</th> 
 
       <th>Amount</th> 
 
       <th>No. of Persons</th> 
 
       <th>Bank Submission Date</th> 
 
       <th>Bank Submission Status</th> 
 
       <th>Bill Date</th> 
 
       <th>Reimbursed</th> 
 
       <th>Restaurant Name</th> 
 
       <th>Team</th> 
 
      </tr> 
 
     </tfoot> 
 
     <tbody> 
 
     <g:each in="${bill_details}" var="it"> 
 
      <tr> 
 
       <td>${it.employee_id}</td> 
 
       <td>${it.bill_submitted_dt}</td> 
 
       <td>${it.amount}</td> 
 
       <td>${it.number_of_persons}</td> 
 
       <td>${it.presented_bank_dt}</td> 
 
       <td>${it.presented_bank_fl}</td> 
 
       <td>${it.receipt_dt}</td> 
 
       <td>${it.reimbursed}</td> 
 
       <td>${it.restaurant_name}</td> 
 
       <td>${it.team}</td> 
 
      </tr> 
 
      </g:each> 
 
     </tbody> 
 
    </table> 
 
<br/> 
 
<br/> 
 
</div> 
 
</g:formRemote> 
 
</body> 
 
    </html>

は、誰もが何をすべきかを教えてもらえますか？

出典

2016-09-16 Abhilash Shajan

コントローラーで印刷すると、データは正常ですか？ gspで '$ {bill_details.size（）}'を単に印刷するとどうなりますか？それは何を示していますか？ –

gsp/jqueryコードに問題があると思います。 –

下記のコードをご利用ください。

html-tableコンテンツgspファイルあなたの希望に応じて、他のカスタムアイテムをテーブルに追加することができます。ここからdata-table

var userDetailsDataTable = ""; 

userDetailsDataTableReload : function(){ 

userDetailsDataTable = $('#userDataTable').DataTable(); 
userDetailsDataTable.destroy(); 

userDetailsDataTable = $('#userDataTable').DataTable({ 
    "ajax": '../restaurantManagement/fetchUserDetails' 
}); 

}

にデータをpouplating ロード/ため

<table id="userDataTable" class="table table-bordered table-striped tableWidth dataTable"> <thead> <tr> <th>Branch Name</th> <th>User Name</th> <th>First Name</th> <th>Last Name</th> <th>Contact Number</th> </tr> </thead> </table>

jqueryコンテンツ、我々はコントローラのアクションfetchUserDetails

controller-actionコンテンツ

Map userDetailsMap = [:] List userDetailsList = userManagementService.fetchAllUsersByRestaurantId(restaurantId) userDetailsMap << [data : userDetailsList] render userDetailsMap as JSON
への呼び出しを与えています
問題がある場合は教えてください。

出典

2016-09-17 09:18:44

あなたはグラムの使用中にエラーますformRemote を私はあなたのGrailsのバージョンを知りませんが、このリンクはあなたの詳細を与え、あなたは属性を次のように重要性をアコード必要があります：更新、onCompleteの

http://docs.grails.org/2.4.5/ref/Tags/formRemote.html

あなたのコードでは、あなたのコードでbill_detailsを表示しようとしましたが、これは好きではないため、onCompleteイベントを使用する必要があります。これはajax呼び出し中に評価されますが、

更新属性では、たとえば、ajax呼び出しの結果が表示されるdivタグのIDを指定できます。

<g:formRemote name="billSearchForm" class="form-horizontal" onComplete="displayTable(data)" url="[controller: 'Report', action:'searchAjax']">

：

は

def searchAjax(){ 
    ... 
    def result = [bill_details:resultSet] 
    render result as JSON 
}

次に、あなたのGSPのコードでは、このようなonCompleteの属性を指定：あなたのケースで

あなたはonCompleteのイベント属性を使用して、このようなJSON形式でbill_detailsを返す必要がありますデータを使用すると、ajax呼び出しのJSON結果にアクセスできます

次にdisplayTableでJSONデータを反復処理することができますbill_details

出典

2016-09-17 10:37:20 Nico

grailsアプリケーション用のjqueryデータテーブルに値が設定されていない

答えて

関連する問題