[SalesForce] How to retain same page in jquery data table

I am using jquery data table for the list view. In the list i have Action section, this section contains the 'Edit' option for that row. When selecting the Edit button on record that in 2nd page of list. Entire page is reloading and list showing the first page results. To find the edit record now i need to go 2nd page again. If i am saving it, again the page is reloading and list showing the first page results. What i need is when i click on edit/save/cancel i need to retain on the same page. Below i given screen shots for better understanding.

See the image below Cuba record in 2nd page.
enter image description here

When i click on edit button it's reloading entire web page and showing first page. like

enter image description here

now need to go 2nd page for that record. like
enter image description here

If i use rerender than edit method is not working. Can anyone suggest how to achieve it in same page.

My script is:

<script>
    j$ = jQuery.noConflict();
    j$(document).ready( function () {
        var aa = j$('[id$="aa"]').DataTable({
            "sPaginationType": "full_numbers",
            "bFilter": true,
            "iDisplayLength": 10,
            "aaSorting": [ [2,'asc'] ],
            "oLanguage": { "sSearch": "Enter the Country" }
        });
    });
</script>

And my markup is:

<apex:pageBlock rendered="true" title="CF COUNTRIES">
    <apex:pageBlockSection columns="1"   >
        <apex:pageblocktable value="{!lst}" var="a"  id="aa">
            <apex:column headerValue="Action" >           
                <apex:commandlink value="Edit" rendered="{!NOT(a.isEdit)}" action="{!editmethid}" >
                    <apex:param name="rowNumber" value="{!a.rowNo}" assignTo="{!rowIndex}" />
                </apex:commandLink>
                <apex:commandlink value="Save"   rendered="{!a.isEdit}" action="{!savemethid}" rerender="none" >
                    <apex:param name="rowNumber" value="{!a.rowNo}" assignTo="{!rowIndex}" />
                </apex:commandLink>
                <apex:outputLabel rendered="{!a.isEdit}"> &nbsp;/&nbsp;&nbsp;</apex:outputLabel>
                <apex:commandlink value="Cancel"   rendered="{!a.isEdit}" action="{!cancelmethod}" rerender="none" >
                    <apex:param name="rowNumber" value="{!a.rowNo}" assignTo="{!rowIndex}" />
                </apex:commandLink>
            </apex:column>
            <apex:column headerValue="Country" >
                <apex:outputField value="{!a.act.Name}"  />           
            </apex:column>
            <apex:column headerValue="Is PRA Trial Conducted" >
                <apex:outputField value="{!a.act.Is_Trial_Conducted__c}" rendered="{!NOT(a.isEdit)}"/>  
                <apex:inputField value="{!a.act.Is_Trial_Conducted__c}"  rendered="{!a.isEdit}" />
            </apex:column>         
        </apex:pageblocktable>
    </apex:pageBlockSection>            
</apex:pageBlock>

Best Answer

Since you want to display the records which has been edited in the first page, you can probably query the records based on the Last Modified Date

<apex:pageblocktable value="{!lst}" var="a"  id="aa">

In this lst, try to query the records from the object Ordered by Last Modified Date. For example if your Custom Object is CountryList__c, you can do an SOQL query like:

lst = [SELECT Id, Name, IsPraTrialConducted FROM CountryList__c ORDER BY LastModifiedDate ]
Related Topic