Two functions (Javascript and AJAX) dont work together

Question

Im trying to send some data to the server through AJAX with the value i get from a JS variable. Code:

<script type="text/javascript">
    var url;
    function aplicarFoto(_src) {
        url = _src;
        var fotosel = document.getElementById("fotosel");
        fotosel.src = 'fotos/'+_src;
    }

    function guardarCambios() {
        $.post("guardarCambios.php",
              {url: url},
              function(response) {
                  alert(response);
                  if (response == "NoUsuario") {
                      window.location = "../login.php";
                  } else {
                      alert("correcto");
                  }                         
              }
          alert(url);
    }
</script>

The idea is update the user picture with the url i get from aplicarFoto(_src) with the variable url . The first function ( aplicarFoto(_src) ) alone works correctly, but when i put the another function ( guardarCambios() ), the first function doesnt work, therefore the second neither! I dont know why, but it just happens when using ajax functions because i did a test with an alert(url) (sunrrounding the rest of code with comments) in the second function and both work correctly! Some guess? Thank you!

Answer 1

Your script alone has syntax errors.

<script type="text/javascript">
var url;

function aplicarFoto(_src) {
    url = _src;
    var fotosel = document.getElementById("fotosel");
    fotosel.src = 'fotos/' + _src;

}

function guardarCambios() {
    $.post("guardarCambios.php", {
            url: url
        }, function (response) {
            alert(response);
            if (response == "NoUsuario") {
                window.location = "../login.php";

            } else {
                alert("correcto");
            }
            alert(url);
        }

    );
}
</script>