How can I create a confirmation box in ColdFusion?

Haitashi

I had the following code that would create a javascript confirmation page. This code lived inside a form which wouldn't submit until the user clicked the Ok button.

Expand|Select|Wrap|Line Numbers

 <input type="image" onclick="return confirm('You will not be able to change your answers if you submit now.\nAre you sure you want to submit this test?');" name="SubmitTestButton" src="images/submit_test.jpg" value="Submit Test" class="submit_test_button" />
 

I've bee trying to achieve the same effect using CFWINDOW. Only, once the window comes up the form automatically submits.

Current code:

Expand|Select|Wrap|Line Numbers

         <form name="TestForm" [...]>

 [OTHER CODE]
 
                <p><input type="image" onclick="ColdFusion.Window.show('submitTest')" name="SubmitTestButton" src="images/submit_test.jpg" value="Submit Test" class="submit_test_button" /></p>

            </cfif>

        </form>
 
        <cfwindow name="submitTest"

            center="true"

            closable="true"

            draggable="false"

            height="200"

            width="200"

            initShow="false"

            modal="true"

            refreshOnShow="false"

            resizable="false">

                    <cfoutput>

                        <p>You will not be able to change your answers if you submit now. </p><p>Are you sure you want to submit this test?</p>

                        <input type="image" name="SubmitTestButton" src="images/submit_test.jpg" value="Yes, Please Sumbit" class="submit_test_button" /></p>
 
                    </cfoutput>

        </cfwindow>

I've been trying to figure out a way to create a coldfusion confirmation box, essentially. Any help or direction will be appreciated. I will post back the final code for reference.

acoder

If it's just an image button, why does it submit?

You need to return true or false to control the form submission, but cfwindow doesn't return anything, but what you can do is use the Coldfusion.Window.onHide function to define a function to run when the window is "closed".

Haitashi

What you're saying makes sense but what if after clicking submit, they get that box and they decide they don't want to submit after all - if they close the window then it would still submit, wouldn't it?

acoder

Not quite. If, for example, you return false when calling from onsubmit, the form will not submit.

Haitashi

Ok. I did something based off what you said. I did implement some javascript, though.

Expand|Select|Wrap|Line Numbers

 <form name="ParentForm" id="ParentForm" action="action.cfm" method="post">
 
    <input type="hidden" name="TestFormField" value="booyah" />

    <input type="submit" value="Submit the Parent Form" onclick="showCfWindowConfirm(); return false;" />
 
</form>
 
<script type="text/javascript">

    function showCfWindowConfirm() {

        ColdFusion.Window.show('cfwinconfirm');

    }
 
    function hideCfWindowConfirm() {

        ColdFusion.Window.hide('cfwinconfirm')

    }
 
    function hideAndSubmit(cfwindowname,formID) {

        ColdFusion.Window.hide(cfwindowname)

        document.getElementById(formID).submit();

    }

</script>
 
<cfwindow initShow="false" title="Confirm" name="cfwinconfirm" modal="true" center="true" source="confirm.cfm" width="300" height="150"/>

and in confirm.cfm:

Expand|Select|Wrap|Line Numbers

 <a href="" onclick="hideAndSubmit('cfwinconfirm','ParentForm'); return false;">Confirm</a>

<a href="" onclick="hideCfWindowConfirm(); return false;">Cancel</a>

Note: this is the the skeleton of what I did just for demonstration purposes. It does not reflect how the scripts and files were placed in my actual application.

As always, I really appreciate the help!

acoder

That seems about right.

If you wanted to really get fancy, you could try replacing the confirm dialog with a cfwindow dialog, though you may need to extend it to return values.

Haitashi

I am using cfwindow. =) This is the cfwindow code that I have in place of what is written at line 23 above.

Expand|Select|Wrap|Line Numbers

          <cfajaximport cssSrc="styles/cfskins/" />        

        <cfwindow name="cfwinconfirm"

            center="true"

            closable="true"

            draggable="false"

            height="200"

            width="380"

            initShow="false"

            modal="true"

            resizable="false">

                <cfoutput>

                    <span class="test_confirmation_window">

                    <p>    You will not be able to change your answers if you submit now. </p><p>Are you sure you want to submit this test?</p>

                    <p>    <input type="image" onclick="hideAndSubmit('cfwinconfirm','TestForm'); return false;" name="confirmSubmit"  src="images/submit_button.gif" class="confirmation_test_button" />

                        <input type="image" onclick="hideCfWindowConfirm(); return false;" name="cancel" src="images/cancel_button.gif" class="confirmation_test_button" />

                    </p>

                    </span>

                </cfoutput>

        </cfwindow>

acoder

Nice. Thanks for posting and glad to see that you've got a working solution.

How can I create a confirmation box in ColdFusion?

re: How can I create a confirmation box in ColdFusion?

re: How can I create a confirmation box in ColdFusion?

re: How can I create a confirmation box in ColdFusion?

re: How can I create a confirmation box in ColdFusion?

re: How can I create a confirmation box in ColdFusion?

re: How can I create a confirmation box in ColdFusion?

re: How can I create a confirmation box in ColdFusion?

Similar ColdFusion bytes

/bytes/development

/bytes/it

/bytes/about