Краткий пример jquery grid-начинающего struts2

Я хочу создать страницу формы с текстовыми полями и редактируемой таблицей сетки, в которой данные, введенные в текстовые поля, должны динамически добавляться в таблицу сетки внизу формы, и мы можем редактировать данные в таблице сетки. Я получаю данные, которые я вводю статически, не сохраняются в сетке. Я прикрепляю классы, которые у меня сейчас есть, просто предлагает мне, что делать, поскольку я новичок в Struts2.

моя страница JSP:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
 pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="sj" uri="/struts-jquery-tags" %>   
<%@taglib prefix="sjg" uri="/struts-jquery-grid-tags"%>

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 <html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
 <title>Product Master</title>
 <sj:head jqueryui="true"/>
 </head>
 <body>

 <tr><a href="javascript:update('<s:property      value="anyValueYouwantToSend"/>')">Stock</a></tr>
 <tr><a href="javascript:update('<s:property value="anyValueYouwantToSend"/>')">Substitutes</a></tr>

 <s:form action="Welcome" namespace="/">
 <s:textfield name="productCode" label="Product Code"></s:textfield>
 <s:textfield name="productName" label="Product Name"></s:textfield>
 <s:textfield name="packaging" label="Packaging"></s:textfield>
 <s:textfield name="conversion" label="Conversion"></s:textfield>
 <s:textfield name="rackNumber" label="Rack Number"></s:textfield>
 <s:textfield name="manufacturer" label="Manufacturer"></s:textfield>

 <s:submit name="btnSave" type="submit" value="Add"/>
 </s:form>
 <s:url var="hello" action="getData" method="post"></s:url>
 <sjg:grid id="gridtable"
   caption="Product Master"
   dataType="json"
   href="%{hello}"
   pager="true"
   gridModel="gridModel"
   rowList="10,15,20"
   rowNum="15"
   rownumbers="true">

<sjg:gridColumn name="productCode" index="productCode" title="ProductCode" sortable="false" value="34545"/>
<sjg:gridColumn name="productName" index="productName" title="ProductName" sortable="false" value="hgfhgh"/>
<sjg:gridColumn name="packaging" index="packaging" title="Packaging" sortable="false" value="786878"/>
<sjg:gridColumn name="conversion" index="conversion" title="Conversion" sortable="false" value="78787"/>
<sjg:gridColumn name="rackNumber" index="rackNumber" title="RackNumber" sortable="false" value="7898"/>
<sjg:gridColumn name="manufacturer" index="manufacturer" title="Manufacturer" sortable="false" value="87878"/>


</sjg:grid>

</body>
</html>

Мой класс действий:

import java.`util.ArrayList`;
import java.`util.List`;
import `com.srivasishta.hms.pharmacy.domain.Productmaster`;
import `com.opensymphony.xwork2.ActionSupport`;

public class `ProductAction`  extends `ActionSupport`{

    List<`Productmaster`> list=null;

    public List<`Productmaster`> `getList`() {
        return list;
    }

    public void `setList(List<`Productmaster> list) {
        this.list = list;
    }
    public String execute()throws Exception
    {
        list=new `ArrayList<Productmaster>`();
        `Productmaster` product=new `Productmaster`();
        `Productinfo` pi=new `Productinfo`();
        `product.setProductCode`(34545);
        `product.setProductName`("hgfhgh");
        `product.setPacks`(786878);
        `product.setQuantityPack`(78787);
        `product.setPurchaseRate`(7898);
        `product.setIpSellingRate`(87878);
        `product.setOpSellingRate`(87878);
        `product.setRowNo`("hgfh");
        `product.setRackNo`("hgfhnbm");

        `product.setProductType`("hgfjkl");
        `product.setBatchNo`("hqwed");
        `product.setMrp`("herwt");
        `list.add`(product);

        `Productmaster` product1=new `Productmaster`();
        `product.setProductCode`(34545);
        `product.setProductName`("hgfhgh");
        `product.setPacks`(786878);
        `product.setQuantityPack`(78787);
        `product.setPurchaseRate`(7898);
        `product.setIpSellingRate`(87878);
        `product.setOpSellingRate`(87878);
        `product.setRowNo`("hgfh");
        `product.setRackNo`("hgfhnbm");

        `product.setProductType`("hgfjkl");
        `product.setBatchNo`("hqwed");
        `product.setMrp`("herwt");
        list.add(product1);
        `pi.setGridModel`(list);
        return "success";
    }
}

Мой класс Productinfo.java:

import `java.util.List`;
import `com.srivasishta.hms.pharmacy.domain.*`;
public class `Productinfo` {
    private List<`Productmaster`> `gridModel`;
    // get how many rows we want to have into the grid – rowNum attribute in the
    // grid
    private Integer rows = 0;
    // Get the requested page. By default grid sets this to 1.
    private Integer page = 0;
    // sorting order – asc or desc
    private String sord;
    // get index row – i.e. user click to sort.
    private String `sidx`;
    // Search Field
    private String `searchField`;
    // The Search String
    private String `searchString`;
    // he Search Operation
    // ['eq','ne','lt','le','gt','ge','bw','bn','in','ni','ew','en','cn','nc']
    private String `searchOper;
    // Your Total Pages
    private Integer total = 0;
    // All Record
    private Integer records = 0;
    public void execute() {
        int to = (rows * page);
        //int from = to–rows;
        page = 1;
        rows = `gridModel.size`();
        records = `gridModel.size`();
        // calculate the total pages for the query
        total = records;
    }
    public List<`Productmaster`> `getGridModel`() {
        return `gridModel`;
    }
    public void `setGridModel`(List<`Productmaste`r> `gridModel`) {
        `this.gridModel` = `gridModel`;
        execute();
    }
    public Integer `getRows`() {
        return rows;
    }
    public void `setRows`(Integer rows) {
        this.rows = rows;
    }
    public Integer `getPage`() {
        return page;
    }
    public void `setPage`(Integer page) {
        this.page = page;
    }
    public String `getSord`() {
        return `sord`;
    }
    public void `setSord`(String sord) {
        `this.sord` = sord;
    }
    public String `getSidx`() {
        return sidx;
    }
    public void setSidx(String sidx) {
        `this.sidx` = sidx;
    }
    public String `getSearchField`() {
        return searchField;
    }
    public void `setSearchField`(String searchField) {
        `this.searchField` = searchField;
    }
    public String `getSearchString`() {
        return searchString;
    }
    public void `setSearchString`(String searchString) {
        `this.searchString` = searchString;
    }
    public String getSearchOper() {
        return searchOper;
    }
    public void `setSearchOper`(String searchOper) {
        `this.searchOper` = searchOper;
    }
    public Integer `getTotal`() {
        return total;
    }
    public void `setTotal`(Integer total) {
        this.total = total;
    }
    public Integer `getRecords`() {
        return records;
    }
    public void `setRecords`![enter image description here][1](Integer records) {
        this.records = records;
    }
    // Getters and Setters for Attributes
}

1 ответ

Вам нужно действие, которое возвращает результат JSON

private List<?> gridModel; //setters and getters omitted

@Action(value = "account-summary-data-provider", 
       results = { @Result(type = "json") })

 public String dataProvider() {

 //Make some object and put it in grid
 UserObject sample1 = new UserObject ();
 sample1.setName('foo');
 UserObject sample2 = new UserObject ();
 sample2.setName('bar');

 gridModel.add(sample1);
 gridModel.add(sample2);
 return SUCCESS;

}

Теперь вам нужно вызвать его через ajax в примере HTML и преобразовать JSON в таблицу

<script type="text/javascript">
$.ajax({ // ajax call starts
    url: '/youaction/adata-provider.ib', // JQuery loads serverside.php
    dataType: 'json', // Choosing a JSON datatype
    success: function(data) {
        $.each(data.gridModel, function(key, val) {
            var tr=$('<tr></tr>');
            $.each(val, function(k, v){
                $('<td>'+v+'</td>').appendTo(tr);
            });
            tr.appendTo('#sampleTable');
        });
    }
    });    

</script>

<table id="sampleTable"></table>

Вы должны сделать больше на создании лучшего стола.

Примечание. Если вы не хотите использовать jquery grid на стойках 2, хотя бы подумайте об использовании jqGrid, который спасет вам жизнь. Есть еще json to table инструменты в Интернете.

Другие вопросы по тегам