Nathan24
Nathan24

Reputation: 1402

Reload struts2 action embedded in JSP

Ok, I will try to make this as short and easy to follow as possible.

I am using a JQuery Full Calendar and displaying events to a user. I have a Filter action on the page that allows the user to filter the events that display based upon different criteria. One of those criteria is the Event Name. The ultimate goal is to get the filter to reload the selectable 'Event Name' options from the Full Calendar View.

I have this all working, but it's out of sync.

My JSP to include the filter is like this:

<div id="popUpFilterInfo" class="filterPopUp">      
<s:action name="ScheduleFilter" executeResult="true" id="scheduleFilter"></s:action>        
</div>

This returns another JSP page which includes the Filter Form. The Struts is run at page render time, so this filter is built before the view is built. This filter is then hidden/shown with jQuery when a user selects a button.

The Page Action is different from the Filter Action as this Filter Action will need to be included within multiple pages

After the Full Calendar Loads, it sends its dates back to the page action which stores those dates into a filter object in a global context for the Application.

The problem that I'm running into is that I cannot get the page to reload just the filter when the view changes. If i reload the whole page, then the filter does contain the data from the previous view, so I know that I just need to tell the page to re-render the ScheduleFilter form. I tried to do this with jQuery as so:

var filter = "<s:action name=\"ScheduleFilter\" executeResult=\"true\" id=\"scheduleFilter\"></s:action>";
jQuery('#popUpFilterInfo').children().remove();
jQuery('#popUpFilterInfo').append(filter);  

This throws a JasperException saying 'quote symbol expected' on the line where the filter Variable is being instantiated. right in the middle of 'name' specifying character 'm' is the problem.

Does anyone know how to reload an embedded action like this without reloading the whole page?

ANSWER:

As Dave said below, don't embed the action with the <s:action> tag. I switched this and instead am calling the action with Ajax and upon success, then I use jQuery to insert the returned data into my Filter form div. I put in a check to see if the div is empty or not, and clear the div if it already has a filter in it. An example is below

My filter div:

<div id="popUpFilterInfo" class="filterPopUp"></div> 

Action call:

function loadFilter() {
    if(!jQuery('#popUpFilterInfo').is(':empty')){
        jQuery('#popUpFilterInfo').children().remove();         
    }
    jQuery.ajax({
        url:'Filter.action',
        data:"",
        dataType: "",
        type: "GET",
        success: function(filter) {
            jQuery('#popUpFilterInfo').append(filter); 
        }
    });
}

Upvotes: 4

Views: 2514

Answers (1)

Rookie007
Rookie007

Reputation: 1219

In behalf of @Nathan24 i am posting this answer.

As Dave said below, don't embed the action with the tag. I switched this and instead am calling the action with Ajax and upon success, then I use jQuery to insert the returned data into my Filter form div. I put in a check to see if the div is empty or not, and clear the div if it already has a filter in it. An example is below

My filter div:

<div id="popUpFilterInfo" class="filterPopUp"></div> 

Action call:

function loadFilter() {
    if(!jQuery('#popUpFilterInfo').is(':empty')){
       jQuery('#popUpFilterInfo').children().remove();         
  }
    jQuery.ajax({
       url:'Filter.action',
       data:"",
       dataType: "",
       type: "GET",
       success: function(filter) {
           jQuery('#popUpFilterInfo').append(filter); 
    }
});
 }

I thought this might be useful for some other posting this as answer so people will not miss this question. If I am wrong let me know I will delete this answer. Thank you.

Upvotes: 1

Related Questions