Bdtjtk

I'm trying to redirect the form on https://sodacitysolar.com/consultation.html to https://sodacitysolar.com/thanks.html once the form is validated. I've traced the code and believe the solution lies somewhere below, which is the form.js file:

$(function()

{

    function after_form_submitted(data) 

    {

        if(data.result == 'success')

        {

            $('form#reused_form').hide();

            $('#success_message').show();

            $('#error_message').hide();

        }

        else

        {

            $('#error_message').append('<ul></ul>');



            jQuery.each(data.errors,function(key,val)

            {

                $('#error_message ul').append('<li>'+key+':'+val+'</li>');

            });

            $('#success_message').hide();

            $('#error_message').show();



            //reverse the response on the button

            $('button[type="button"]', $form).each(function()

            {

                $btn = $(this);

                label = $btn.prop('orig_label');

                if(label)

                {

                    $btn.prop('type','submit' ); 

                    $btn.text(label);

                    $btn.prop('orig_label','');

                }

            });



        }//else

    }



    $('#reused_form').submit(function(e)

      {

        e.preventDefault();



        $form = $(this);

        //show some response on the button

        $('button[type="submit"]', $form).each(function()

        {

            $btn = $(this);

            $btn.prop('type','button' ); 

            $btn.prop('orig_label',$btn.text());

            $btn.text('Sending ...');

        });





                    $.ajax({

                type: "POST",

                url: 'handler.php',

                data: $form.serialize(),

                success: after_form_submitted,

                dataType: 'json' 

            });        



      });   

});

I've tried to replace this code with the code below but it's not working:

$('form#reused_form').hide();

            $('#success_message').show();

            $('#error_message').hide();







function redirect()

{

    window.location.href="thanks.html";

}

Any chance you guys could point me in the right direction?

EDIT:

Here's the code I was trying to use:

$(function()

    {

        function after_form_submitted(data) 

        {

            if(data.result == 'success')

            {

                 function redirect()

    {

        window.location.href="thanks.html";

    }

            }

            else

            {

                $('#error_message').append('<ul></ul>');



                jQuery.each(data.errors,function(key,val)

                {

                    $('#error_message ul').append('<li>'+key+':'+val+'</li>');

                });

                $('#success_message').hide();

                $('#error_message').show();



                //reverse the response on the button

                $('button[type="button"]', $form).each(function()

                {

                    $btn = $(this);

                    label = $btn.prop('orig_label');

                    if(label)

                    {

                        $btn.prop('type','submit' ); 

                        $btn.text(label);

                        $btn.prop('orig_label','');

                    }

                });



            }//else

        }



        $('#reused_form').submit(function(e)

          {

            e.preventDefault();



            $form = $(this);

            //show some response on the button

            $('button[type="submit"]', $form).each(function()

            {

                $btn = $(this);

                $btn.prop('type','button' ); 

                $btn.prop('orig_label',$btn.text());

                $btn.text('Sending ...');

            });





                        $.ajax({

                    type: "POST",

                    url: 'handler.php',

                    data: $form.serialize(),

                    success: after_form_submitted,

                    dataType: 'json' 

                });        



          });   

    });

You created a function block, that will do nothing unless you actually call that specific function.

For example:

function foo() {

  console.log('bar');

}

Here, I have a simple function which would print bar in my Console. However, this function above will do nothing unless I first call it:

foo() // bar

After calling it in my code I will then see bar in my console.

You can brush up your function knowledge here:

Generally speaking, a function is a "subprogram" that can be called by code external (or internal in the case of recursion) to the function. Like the program itself, a function is composed of a sequence of statements called the function body. Values can be passed to a function, and the function will return a value.

Solution

But to make your code work, simply add:

//...

redirect(); // calls the redirect function

// ...

Completed code

This is what this should look like:

$(function () {

  function after_form_submitted(data) {

    if (data.result == 'success') {

      $('form#reused_form').hide();

      $('#success_message').show();

      $('#error_message').hide();



      // call the function

      redirect();



    } else {

      $('#error_message').append('<ul></ul>');



      jQuery.each(data.errors, function (key, val) {

        $('#error_message ul').append('<li>' + key + ':' + val + '</li>');

      });

      $('#success_message').hide();

      $('#error_message').show();



      //reverse the response on the button

      $('button[type="button"]', $form).each(function () {

        $btn = $(this);

        label = $btn.prop('orig_label');

        if (label) {

          $btn.prop('type', 'submit');

          $btn.text(label);

          $btn.prop('orig_label', '');

        }

      });



    } //else

  }



  $('#reused_form').submit(function (e) {

    e.preventDefault();



    $form = $(this);

    //show some response on the button

    $('button[type="submit"]', $form).each(function () {

      $btn = $(this);

      $btn.prop('type', 'button');

      $btn.prop('orig_label', $btn.text());

      $btn.text('Sending ...');

    });





    $.ajax({

      type: "POST",

      url: 'handler.php',

      data: $form.serialize(),

      success: after_form_submitted,

      dataType: 'json'

    });

  });

  

});



function redirect() {



  window.location.href = 'thanks.html';



}