Ajaxurl suddenly not defined

Question

I am developing a wordpress plugin where I use an ajax call to submit form data, it was working fine and then all of a sudden I get a console error saying that ajaxurl (the url passed to the ajax post) is not defined? My jQuery function:

 $(".button").click(function() {

            $(".error").hide();

            var name = $(":input.name").val();
            if (name == "") {

                $("label#nameErr").show();
                $(":input.name").focus();
                return false;
            }

            var email = $(":input.email").val();
            if (email == "") {

                $("label#emailErr").show();
                $(":input.email").focus();
                return false;
            }


            var phone = $(":input.phone").val();
            if ((phone == "") || (isNaN(phone))) {

                $("label#phoneErr").show();
                $(":input.phone").focus();
                return false;
            }

            var info = 'name:' + name + '&email:' + email + '&phone:' + phone;
            var ajaxurl = '<?php echo admin_url("admin-ajax.php"); ?>';
            alert(info);

            jQuery.ajax({

                type:"post",
                dataType:"json",
                url: ajaxurl,
                data: {action: 'submit_data', info: info},
                success: function(response) {
                    if (response.type == "success") {

                        alert("success");
                    }
                    else {

                        alert("fail");
                    }
                }
            });

            return false;               

        });

The var ajaxurl = ''; line is a solution I just found on the web but this now leaves me with an error of 403 forbidden.

Answer 1

take a look here:

http://codex.wordpress.org/Function_Reference/wp_localize_script

First add Data in your php file

// Register the script first.

wp_register_script( 'some_handle', 'path/to/myscript.js' );

// Now we can localize the script with our data.

$translation_array = array( 'some_string' => __( 'Some string to translate' ), 'a_value' => '10' );

wp_localize_script( 'some_handle', 'object_name', $translation_array );

// The script can be enqueued now or later.
wp_enqueue_script( 'some_handle' );

?>

After that you can use the data in js

alert(object_name.some_string);

// alerts 'Some string to translate'