How to use javascript variable within another javascript script?

Question

So in an earlier part of my code, within tags I set the value of variable charge to a different link.

How do I use the value of this variable in the later javascript as 'url: charge' does not work. Do I need to write the variable differently.

'Url: chargesilver.php' works, but 'url: charge' doesn't.

<script>

function setmembershipayment(){
    if (usermembershipchoice == "Silver") {
        var charge = "chargesilver.php";
        alert(charge);
    } else if (usermembershipchoice == "Gold") {
        var charge = "chargegold.php";
        alert(charge);
    } else if (usermembershipchoice == "Platinum") {
        var charge = "chargeplatinum.php";
        alert(charge);
    } else { 
       alert("ERROR");
    } // THE MISSED BRACKED!! ;)
}
</script>

.

<script>
    $.ajax({
                  type: "POST",
                  url: charge,
                  data: form.serialize(),
                  success: function(response){
 </script>

Answer 1

charge is not global.

Its scope is just within the function

Declare it outside the function

var charge = ''

function setmembershipayment(){
    ....

Sample

<script>

var charge = ''

function setmembershipayment(){
  if (usermembershipchoice == "Silver") {
    charge = "chargesilver.php";
    alert(charge);
  } else if (usermembershipchoice == "Gold") {
    charge = "chargegold.php";
    alert(charge);
  } else if (usermembershipchoice == "Platinum") {
    charge = "chargeplatinum.php";
    alert(charge);
  } else { 
   alert("ERROR");
 } // THE MISSED BRACKED!! ;)
}

 setmembershipayment()

 $.ajax({
     type: "POST",
     url: charge, // OR Just return it from the function here and make sure there is a default value
     data: form.serialize(),
     success: function(response){
</script>

OR Just return it from the function and make sure there is a default value

Answer 2

The easiest way is to make your function return the charge you want to use.

function getMembershipPayment(){
    if (usermembershipchoice == "Silver") {
        return "chargesilver.php";
    } else if (usermembershipchoice == "Gold") {
        return "chargegold.php";
    } else if (usermembershipchoice == "Platinum") {
        return "chargeplatinum.php";
    } else { 
       alert("ERROR");
       return "some default value"
    } // THE MISSED BRACKED!! ;)
}

$.ajax({
  type: "POST",
  url: getMembershipPayment() // returns the value of charge,
  data: form.serialize(),
  success: function(response){}
})

Answer 3

Perhaps call the function from url to return the correct string value. And perhaps use a switch instead of an if/else structure as it's a little easier to read.

function setmembershipayment(usermembershipchoice) {
  switch (usermembershipchoice) {  
    case 'Silver': return "chargesilver.php";
    case 'Gold': return "chargegold.php";
    case 'Platinum': return "chargeplatinum.php";
    default: console.log('error'); break;
  }
}

$.ajax({
  type: "POST",
  url: setmembershipayment(usermembershipchoice),
  data: form.serialize(),
  success: function(response) {
    ...
  }
});