function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
ShakespeareShakespeare 

Stop ajax call through javascript on visualforce page

Hi,

I have a multi line editor with first column as checkboxes. On Save button I am deleting the checked items. I have worte a javascript function that will give me a confirm message if I have checked some item. My problem is, that records gets deleted even if I click on the cancel button of th message. I believe the ajax call is its reason, if I am right is there a way to stop the ajax call in VF pages if user selects Cancel option from javascript. Or there is some other solution.

 

Shakespeare

 

<apex:page controller="PixelReqFormController" showHeader="false" id="pixelReqPage"> <script> function checkIsDelete() { var table = document.getElementById('pixelReqPage:pixelReqForm:pixelReqPageBlock:pixelReqTable'); var rowsCount = table.rows.length; var checkbox; for (var i=0; i < rowsCount-1; i++) { checkbox = document.getElementById'pixelReqPage:pixelReqForm:pixelReqPageBlock:pixelReqTable:'+i+':isDelete'); alert (checkbox.checked); if (checkbox.checked) { if (confirmDelete()) { return true; } else { return false; } } } }

 

function confirmDelete()
    {
        var isDelete = confirm("Are you sure you want to delete the checked item(s)?");
        if (isDelete )
        {
            return true;           
        }
        return false;   
    } </script> <apex:form id="pixelReqForm"> <apex:pageBlock title="Pixel Request Form" id="pixelReqPageBlock"><br></br> <apex:pageBlockButtons > <apex:commandButton value="Save" action="{!save}" rerender="pixelReqTable" status="outStatus" onclick="checkIsDelete()" /> </apex:pageBlockButtons> <apex:pageBlockTable value="{!PixelReq}" var="aPixelReq" id="pixelReqTable"> <apex:column headerValue="Delete" id="isDeleteColumn"> <apex:inputCheckbox value="{!aPixelReq.isDeleted__c}" id="isDelete"/> </apex:column> <apex:column headerValue="Agency"> <apex:inputField value="{!aPixelReq.Agency__c}"/> </apex:column> <apex:column headerValue="Advertiser"> <apex:inputField value="{!aPixelReq.Advertiser__c}"/> </apex:column> </apex:pageBlockTable> </apex:pageBlock> </apex:form> </apex:page>

 

ShakespeareShakespeare

Just to add the controllerClass:

 

public class PixelReqFormController { public PageReference save() { pixelReqList; ApexPages.Message myMsg = new ApexPages.message(ApexPages.Severity.INFO, 'Pixel Request Saved Successfully'); ApexPages.addMessage(myMsg); return null; } }

 

Richie DRichie D

Have a try at this:-

 

<apex:commandButton value="Save" action="{!save}" rerender="pixelReqTable" status="outStatus" onclick="checkIsDelete()" /> change to <apex:commandButton value="Save" action="{!save}" rerender="pixelReqTable" status="outStatus" onclick="return checkIsDelete()" />

 

 

You need to get javascript to do something with your returned true/false value.

 

Should work...

 

R.

ShakespeareShakespeare

Thank for you input Richie, I already tried this and it helps nothing. Infact doing this call is not sent at all even if user presses YES of confirm message and of course when YES is pressed method returns true.

 

Regards,
Shakespeare

Richie DRichie D

hi,

 

This should work. On many times I have used this pattern.

 

You should check to see if you have javascript errors, perhaps even debug it in a debugger and step through.

 

If you have directly copied your code then, for example, this line is wrong

 

checkbox = document.getElementById'pixelReqPage:pixelReqForm:pixelReqPageBlock:pixelReqTable:'+i+':isDelete');

 This is malformed Javascript. missing (.

 

I'd debug and see whats going on. If Javascript isn't well formed then perhaps this is why it isn't working. 

 

R. 

 

Richie DRichie D
Also, you must make sure that you return a value from CheckIsDelete() as if your checkbox isn't checked you return 'nothing'. perhaps a return false as the last staement will fix this.
ShakespeareShakespeare
Thanks for your continuous interaction, Infact I have tried this all, there is no javascript error also syntax is correct. Return false in my particular scarerio does not matter becuase I alway select some item to delete and I have varified that controls goes into 'else' statement and 'else' returns false, However to double check I have tried as you advised but it is not helping.

Since this is an ajax request, I believe, the ajax request can't be stopped if you use a confirm method, it just triggers. I think there should be some way to stop this ajax request.

Shakespeare
Richie DRichie D

Shakespeare,

 

You can stop an ajax request - see example below:

 

 

<apex:commandButton action="{!submit}" onclick="return (confirm('Clicking \'ok\' will not allow any further updating of the questionnaire. Are you sure?'));" value="Submit" />

 

 

 

My example is simplier than yours but the same principle still applies. I know this works as gives the functionality you request.

 

If you are still having problems then I can only suggest that you start with a simplified scenario e.g. onclick ="return false;" and see what happens. There must be a problem somewhere that is causing your code not to function properly - you just need to find it! 

 

R. 

ShakespeareShakespeare

Richie, 

 

Thanks for your solution. It is still not working. I have tried this all ... from very simple alert to full mehtod. Either it updated despite of cancel or it does'nt do anything.

Now I am thinking to remove 'action="{!save}" ' from the button attributes and call this method through my javascript. Is it possible that I can call an apex mehtod from my javascript? any example.

 

Thanks,
Shakespeare

ShakespeareShakespeare

Hi Richie,

 

I have not been able to stop the ajax call. However I have discovered its work around by adding an apex:actionFunction control and called the actionFuntion on confirmation of message. It works fine for me.

Thanks for your help.

 

Shakespeare

 

<apex:page controller="PixelReqFormController" showHeader="false" id="pixelReqPage"> <apex:pageMessages rendered="true" id="msg1"/> <script> function checkIsDelete() { if (confirm()) { saveRecord (); return true; } else { return false; } saveRecord (); } </script> <apex:form id="pixelReqForm"> <apex:actionFunction action="{!save}" name="saveRecord" reRender="pixelReqTable" /> <apex:pageMessages rendered="true" id="msg2"/> <apex:pageBlock title="Pixel Request Form" id="pixelReqPageBlock"><br></br> <apex:pageBlockButtons > <apex:commandButton value="Save" id="btnSave" rerender="pixelReqTable" status="outStatus" onclick="checkIsDelete()"/> </apex:pageBlockButtons> <apex:pageBlockTable value="{!PixelReq}" var="aPixelReq" id="pixelReqTable"> <apex:column headerValue="Delete" id="isDeleteColumn"> <apex:inputCheckbox value="{!aPixelReq.isDeleted__c}" id="isDelete"/> </apex:column> <apex:column headerValue="Agency"> <apex:inputField value="{!aPixelReq.Agency__c}"/> </apex:column> </apex:pageBlockTable> </apex:pageBlock> </apex:form> </apex:page>