Highlighted

returning encoded json

Community Beginner ,
Jul 11, 2016

Copy link to clipboard

Copied

I am using the bootstrap framework for my form validation but I also am trying to trigger a success callback using Ajax and Coldfusion.

CFMAIL gets processed OK in the mail.cfm file that I am using, however I also need the mail.cfm file to respond an encoded JSON, such as { "result": "ok" } or { "result": "error" }.

Currently it doesn't respond anything (The current response is empty) therefore $.ajax() isn't triggering the success callback.

Any ideas?

<script>

// <![CDATA[

<!--

$(document).ready(function() {

    $('#addSurveyForm').formValidation({

  // I am validating Bootstrap form

        framework: 'bootstrap',

        // Feedback icons

        icon: {

            valid: 'glyphicon glyphicon-ok',

            invalid: 'glyphicon glyphicon-remove',

            validating: 'glyphicon glyphicon-refresh'

        },

  // List of fields and their validation rules

        fields: {

            name: {

                validators: {

                    notEmpty: {

                        message: 'The name is required and cannot be empty'

                    }

                  

                }

            }, // End of name

  } // End of fields

     

})  // End of validating form

   .on('success.form.fv', function(e) {

        // Prevent form submission

        e.preventDefault();

        // Some instances you can use are

        var $form = $(e.target),        // The form instance

            fv    = $(e.target).data('formValidation'); // FormValidation instance

        // Send all form data to back-end

        $.ajax({

            url: 'mail.cfm',

            type: 'POST',

            data: $form.serialize(),

            dataType: 'json'

        })

    

  .done(function(response) {

            // Clear the form

            $form.formValidation('resetForm', true);

             // Show the message

            response.result === 'error'

                ? $('#alertContainer')

                    .removeClass('alert-success')

                    .addClass('alert-warning')

                    .html('Sorry, cannot send the message')

                    .show()

                : $('#alertContainer')

                    .removeClass('alert-warning')

                    .addClass('alert-success')

                    .html('Your message has been successfully sent')

                    .show();

        });

    });

}); // End of script

//-->

//]]>

mail.cfm:

<cfmail>

.......

</cfmail>

<cfset myStruct =

    { "result": "ok" }

/>

<cfscript>

    result = serializeJSON(myStruct);

    writeOutput(result);

</cfscript>

Views

158

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

returning encoded json

Community Beginner ,
Jul 11, 2016

Copy link to clipboard

Copied

I am using the bootstrap framework for my form validation but I also am trying to trigger a success callback using Ajax and Coldfusion.

CFMAIL gets processed OK in the mail.cfm file that I am using, however I also need the mail.cfm file to respond an encoded JSON, such as { "result": "ok" } or { "result": "error" }.

Currently it doesn't respond anything (The current response is empty) therefore $.ajax() isn't triggering the success callback.

Any ideas?

<script>

// <![CDATA[

<!--

$(document).ready(function() {

    $('#addSurveyForm').formValidation({

  // I am validating Bootstrap form

        framework: 'bootstrap',

        // Feedback icons

        icon: {

            valid: 'glyphicon glyphicon-ok',

            invalid: 'glyphicon glyphicon-remove',

            validating: 'glyphicon glyphicon-refresh'

        },

  // List of fields and their validation rules

        fields: {

            name: {

                validators: {

                    notEmpty: {

                        message: 'The name is required and cannot be empty'

                    }

                  

                }

            }, // End of name

  } // End of fields

     

})  // End of validating form

   .on('success.form.fv', function(e) {

        // Prevent form submission

        e.preventDefault();

        // Some instances you can use are

        var $form = $(e.target),        // The form instance

            fv    = $(e.target).data('formValidation'); // FormValidation instance

        // Send all form data to back-end

        $.ajax({

            url: 'mail.cfm',

            type: 'POST',

            data: $form.serialize(),

            dataType: 'json'

        })

    

  .done(function(response) {

            // Clear the form

            $form.formValidation('resetForm', true);

             // Show the message

            response.result === 'error'

                ? $('#alertContainer')

                    .removeClass('alert-success')

                    .addClass('alert-warning')

                    .html('Sorry, cannot send the message')

                    .show()

                : $('#alertContainer')

                    .removeClass('alert-warning')

                    .addClass('alert-success')

                    .html('Your message has been successfully sent')

                    .show();

        });

    });

}); // End of script

//-->

//]]>

mail.cfm:

<cfmail>

.......

</cfmail>

<cfset myStruct =

    { "result": "ok" }

/>

<cfscript>

    result = serializeJSON(myStruct);

    writeOutput(result);

</cfscript>

Views

159

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Jul 11, 2016 0
Adobe Community Professional ,
Jul 11, 2016

Copy link to clipboard

Copied

What about just returning the text upon success?

$.ajax({

            url: 'mail.cfm',

            type: 'POST',

            data: $form.serialize(),

            dataType: 'json',

            success: function(response){

                 $('#contentDiv').html();

            }

        });

<div id="contentDiv">{ "result": "ok" }</div>

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jul 11, 2016 0
Advocate ,
Jul 12, 2016

Copy link to clipboard

Copied

Your mail.cfm module looks correct. What happens when you call it directly? I use something like FireBug to capture the request and then run it manually to check the results.

I'm guessing that your mail.cfm side is correct but the javascript side has something isn't being executed the way you think it is.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jul 12, 2016 0