+ Start a Discussion
TLFTLF 

Problem trying to implement confirmation dialog in Visualforce page

Hi,
 
I have a VF page that has a "Delete" commandButton on it. The button action calls a method called "deleteSettings" in my controller to delete an object from Salesforce. The page looks something like this:
 
Code:
<apex:page controller="MyController" >
    <apex:messages />
    <apex:form id="settingsForm" >
    
        <apex:sectionHeader title="API Connection" rendered="{!settingsDefined}" >
        
            <apex:pageBlock title="Settings" mode="detail" rendered="{!NOT(editMode)}">
                <apex:pageBlockSection columns="1">
                    <apex:outputField id="endpoint" value="{!ppConnection.API_Endpoint__c}" />
                    <apex:outputField id="user" value="{!ppConnection.User__c}" />
                    <apex:outputField id="password" value="{!ppConnection.Password__c}" />
                    <apex:outputField id="signature" value="{!ppConnection.Signature__c}" />
                    <apex:outputField id="version" value="{!ppConnection.Version__c}" />
                </apex:pageBlockSection>
                <br/><br/>
                <apex:commandButton value="Edit" action="{!edit}" />
                <apex:commandButton value="Delete" action="{!deleteSettings}" immediate="true" />
            </apex:pageBlock>
            
        </apex:sectionHeader>                            
            
    </apex:form>    
</apex:page>

 
This works fine, as expected. The deleteSettings action is called when the button is clicked. So, now I wanted to implement a confirmation dialog, so the deleteSettings action method is only called once the user clicks OK. I modified the page as follows (changes highlighted in red):
 
Code:
<apex:page controller="MyController" >
    <apex:messages />
    <apex:form id="settingsForm" >
    
        <apex:actionFunction name="deleteSettings" action="{!deleteSettings}" reRender="settingsForm" />
    
        <apex:sectionHeader title="API Connection" rendered="{!settingsDefined}" >
        
            <!-- This pageBlock is if we are NOT in "edit" mode -->
            <apex:pageBlock title="Settings" mode="detail" rendered="{!NOT(editMode)}">
                <apex:pageBlockSection columns="1">
                    <apex:outputField id="endpoint" value="{!ppConnection.API_Endpoint__c}" />
                    <apex:outputField id="user" value="{!ppConnection.User__c}" />
                    <apex:outputField id="password" value="{!ppConnection.Password__c}" />
                    <apex:outputField id="signature" value="{!ppConnection.Signature__c}" />
                    <apex:outputField id="version" value="{!ppConnection.Version__c}" />
                </apex:pageBlockSection>
                <br/><br/>
                <apex:commandButton value="Edit" action="{!edit}" />
                <apex:commandButton value="Delete" onclick="confirmDelete();" />
            </apex:pageBlock>
            
        </apex:sectionHeader>                            
            
    </apex:form>    
    

    <script>
        function confirmDelete() {
            if (confirm("Are you sure you want to delete the API settings—")) {
                // Invoke the apex:actionFunction that performs the delete
                
                alert("Calling deleteSettings");
                deleteSettings();
            }
        }
    </script>
</apex:page>

When I do this, it does not appear that my "deleteSettings" actionFunction is calling the "deleteSettings" method in my controller. I do observe that the "Calling deleteSettings" alert is displayed, however, the object is not being deleted. I know the "deleteSettings" method in the controller is working, because it worked correctly when I invoked it directly as the action of the commandButton. I'm not sure why it is not being called from the actionFunction. Any ideas? TIA.
jwetzlerjwetzler
You shouldn't need actionFunction for this.  you should be able to keep your action method on your delete button and your javascript method as the onclick attribute.  Might have to return false if the user clicks cancel to prevent your action method from firing.

I did not get a chance to try this out but I'm pretty sure you can do this without actionFunction.
hisrinuhisrinu
Hi,

First of all how can we display the confirmation box using Visualforce.
Can you suggest?

Thanks
Srini
TLFTLF

To jweltzer: Thanks for the suggestion. I simply called the "confirm" function directly from the onclick event. Confirm should return true if the OK button is clicked or false otherwise. So, this is doing what you suggest. What I find is that my "deleteSettings" action method in my controller is called regardless of which button is clicked in the confirm dialog. I tried it both with the immediate attribute set to true and without and got the same result.

Code:
<apex:commandButton value="Delete" onclick="confirm('Are you sure you want to delete the API settings—');" action="{!deleteSettings}" immediate="true" />


 

Please take a look at this posting: http://community.salesforce.com/sforce/board/message?board.id=Visualforce&thread.id=4091

It looks like Vivek is trying to do something very similar to what I was trying to do but it is not working for him. Is there a fundamental problem with apex:actionFunction here?

 

To hisrinu: I'm implementing the confirmation dialog by calling the standard javascript "confirm" function as shown above.

Vivek ViswanathVivek Viswanath
That’s right TLF however I want to throw the message only if a flag is set to true in the controller and hence cannot use the inline JavaScript to confirm. I haven’t tired it but looks like i will have to create a parameter/flag in my controller that I write to from my java script and check that before i save (which is kind of a mess).

I did try putting the inline confirm button to test as well however I am having the same issue as you no matter which button i click cancel or Ok The method is still executed

Regards

Vivek


Message Edited by Vivek Viswanath on 08-05-2008 05:16 AM
TLFTLF

Oops! My bad. My colleague pointed out the error of my ways. This works:

Code:
<apex:commandButton value="Delete" onclick="return confirm('Are you sure you want to delete the API settings—');" 
                    action="{!deleteSettings}" >


 

Vivek ViswanathVivek Viswanath
That worked for me too, though I am throwing the custom dialogue it works

Thankz

Vivek


Message Edited by Vivek Viswanath on 08-05-2008 05:35 AM