0

spring.I を使用して jqxGrid を実装する必要があります。Spring でそれを行う方法がわかりません。以下は、私のコントローラー クラス AccountController.java です。

@Controller
@RequestMapping(value="/account")
public class AccountsController {
@Autowired
private AccountService accountService;
@RequestMapping(value = "/list", method = RequestMethod.GET, headers = 
 "Accept=application/json")
public @ResponseBody ModelAndView listOfAccounts() {
    ModelAndView modelAndView = new ModelAndView();

    List<Accounts> accounts = accountService.getAccounts();
    modelAndView.addObject("accounts", accounts);

    return modelAndView;


}

 }

Accounts.java クラスから取得した json データの形式は次のとおりだと思います。

[{"id":"1","PeriodName":2000-2001,"PeriodStartDate":"2000-01-01","PeriodEndDate":"2001-12-31"},{"id":"2","PeriodName":2001-2002,"PeriodStartDate":"2001-01-01","PeriodEndDate":"2002-12-31"}]

以下は、json 応答に対する jquery get 要求と、jqxGrid を取得するためのコードです。

$.get('account/list',function(responseJson) {

             var data = responseJson;
             var source =
                {     
                    datatype: "json",
                    datafields: [
                        { name: 'id' },
                        { name: 'PeriodName' },
                        { name: 'PeriodStartDate' },
                        { name: 'PeriodEndDate' }
                    ],
                    id: 'id',
                    localdata: data
                };

            var dataAdapter = new $.jqx.dataAdapter(source);
 $("#jqxgrid").jqxGrid(
        {
            //columnsresize: true,
            width: 800,
            source: dataAdapter,
            pageable: true,
            //pagerButtonsCount: 10,
            autoheight: true,
           // editable: false,
            pagerrenderer: pagerrenderer,
            columns: [
              { text: 'Period Name', datafield: 'PeriodName', width: 200 },
              { text: 'Start Date', datafield: 'PeriodStartDate', width: 200 },
              { text: 'End Date', datafield: 'PeriodEndDate', width: 200 }
            ]
        });
 });

しかし、ここでグリッドを取得できませんでした。上記のコードのどこに問題があるのか​​ わかりません。jqxGridのすべてのjsファイルをインポートしました。これを解決するのを手伝ってください

4

1 に答える 1

0

*私はここであなたの問題を見ましたが、同じコードです（少し変更されています）。その pagerenderer コードにコメントしてください。pagerenderer 関数をどこにも定義していません。それが動作します。ここに作業コードhttp://jsfiddle.net/qwm3z/があります。

     responseJson = <c:out value="${accounts}" />;

     var data = responseJson;

      var source =
                {     
                    datatype: "json",
                    datafields: [
                        { name: 'id' },
                        { name: 'PeriodName' },
                        { name: 'PeriodStartDate' },
                        { name: 'PeriodEndDate' }
                    ],
                    id: 'id',
                    localdata: data
                };
            var dataAdapter = new $.jqx.dataAdapter(source);
 $("#jqxgrid").jqxGrid(
        {
            //columnsresize: true,
            width: 800,
            source: dataAdapter,
            pageable: true,
            //pagerButtonsCount: 10,
            autoheight: true,
           // editable: false,
           // pagerrenderer: pagerrenderer,
            columns: [
              { text: 'Period Name', datafield: 'PeriodName', width: 200 },
              { text: 'Start Date', datafield: 'PeriodStartDate', width: 200 },
              { text: 'End Date', datafield: 'PeriodEndDate', width: 200 }
            ]
        });

そして、なぜ各応答でグリッドを作成しているのですか? get リクエストごとに 1 回作成して更新できます。*

于 2014-04-02T05:01:35.383 に答える