(Struts2 -Jquery) Display data in a Grid after submitting a form.

Hi,

Can any one suggest one example to display data in a grid after submitting the form.

Here exactly what I am doing.

I have two date fields in a form. When ever I submit the form I need to search data from the backend based on the two data fields and I have to display the resulting data in a Grid.
How this can be possible?

Please find the sample code of mine below.

<%@ 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>Insert title here</title>
<sj:head jqueryui="true" jquerytheme="redmond"/>
</head>
<body>
 <s:form id="mcp" action="SampleAction" theme="simple">
 	<sj:datepicker displayFormat="yy-M-dd"  label="Payment Date From" name="paymentDateFrom"></sj:datepicker>
 	<sj:datepicker displayFormat="yy-M-dd" label="Payment Date To" name="paymentDateTo"></sj:datepicker>
 	
 	<sj:submit targets="gridtable" buttonIcon="ui-icon-gear"
 	 effect="pulsate" value="Search" indicator="indicator" button="true" />
 	 
 	
</s:form>
    <sjg:grid
    	id="[b]gridtable[/b]"
    	caption="MCP Payment Details"
    	dataType="json"
    	pager="true"
    	rowList="10,15,20"
    	gridModel=""
    	rowNum="15"
    	rownumbers="true"
    >
    <sjg:gridColumn name="batchRef" title="Batch Reference" ></sjg:gridColumn>
	<sjg:gridColumn name="paymentRef" title="Payment Reference"></sjg:gridColumn>
	<sjg:gridColumn name="qlGrpId" title="QL Group ID"></sjg:gridColumn>
	<sjg:gridColumn name="qlCustId" title="QL Cust ID"></sjg:gridColumn>
    </sjg:grid>
 </body>
</html>

As shown above I need to display the date in the grid having id 'gridTable' when ever I submit the form "SampleAction.action"

Its important and urgent.

Please suggest one solution.

Thanks in advance.

Regards,
Suresh.

You can try out reloadTopics in combination with formIds attribute.

<%@ 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>Insert title here</title>
<sj:head jqueryui="true" jquerytheme="redmond"/>
</head>
<body>
 <s:form id="mcp" action="SampleAction" theme="simple">
 	<sj:datepicker displayFormat="yy-M-dd"  label="Payment Date From" name="paymentDateFrom"></sj:datepicker>
 	<sj:datepicker displayFormat="yy-M-dd" label="Payment Date To" name="paymentDateTo"></sj:datepicker>
 	
 	<sj:a formIds="mcp" onClickTopics="reloadGrid" buttonIcon="ui-icon-gear"
 	 effect="pulsate" value="Search" indicator="indicator" button="true" />
</s:form>

<sjg:grid
    	id="gridtable"
        formIds="mcp"
        reloadTopics="reloadGrid"
    	caption="MCP Payment Details"
    	dataType="json"
    	pager="true"
    	rowList="10,15,20"
    	gridModel=""
    	rowNum="15"
    	rownumbers="true"
    >
    <sjg:gridColumn name="batchRef" title="Batch Reference" ></sjg:gridColumn>
	<sjg:gridColumn name="paymentRef" title="Payment Reference"></sjg:gridColumn>
	<sjg:gridColumn name="qlGrpId" title="QL Group ID"></sjg:gridColumn>
	<sjg:gridColumn name="qlCustId" title="QL Cust ID"></sjg:gridColumn>
</sjg:grid>
 </body>
</html>

Johannes

Hi Johannes,

I am vaey glad to saw reply from you.
I tried with the reloadTopics. But I am getting one stackoverflow exception if I use that.
Can you please suggest why it is coming.

Thanks,
Suresh.

Please post the Stacktrace.

Johannes

Hi,

Please find the attached screen shot. I have traced the error in mozilla.

Thanks,
Suresh.

Please Check follwing Points:

1.) Why is your gridModel Attribute empty? This must match a collection propertie of your JSON Action.

2.) How looks your JSON Result? Is it successfully?

3.) Do you have a recursion in your gridModel? If yes you should exclude this properties from JSON result via the JSON annotion.

Johannes

Hi,

1.) Why is your gridModel Attribute empty? This must match a collection propertie of your JSON Action.

Ans: I have declared appropriate collection for the gridModel.

2.) How looks your JSON Result? Is it successfully?

Ans: I have checked the Json result coming from the action. Using onSuscessTopics. So it is also coming good.

3.) Do you have a recursion in your gridModel? If yes you should exclude this properties from JSON result via the JSON annotion.

Ans:I didnt understand what exactly recursion is. Can you give some example for how to find and how to remove.

Thanks,
Suresh.

Hi,

One more thing I want to mention is, without declaring the targets attribute if the run the application it is just dowloading one .action file instead of refresing the page. can you please let me know if you can track the issue. please find the attached screen shot ot the same.