如何在春天显示jqxGrid

时间:2014-03-04 04:40:37

标签: java jquery spring jqxgrid jqxwidgets

我必须使用spring实现jqxGrid。我不知道怎么做spring.Below是我的控制器类 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"}]

下面是jQuery get请求json响应和获取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文件。请帮我解决这个问题

1 个答案:

答案 0 :(得分: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 }
            ]
        });

你为什么要在每个回复中制作网格?您可以为每次获取请求进行一次更新。*