Take variable from a PHP file using AJAX/JavaScript

StackOverflow https://stackoverflow.com/questions/23117289

Pergunta 

I have a form that uses AJAX and Javascript to submit itself.

HTML:

<h3>Sign Up Here</h3>
<form name="signupform" id="signupform" onsubmit="return false;">
<div>Username:</div>
<input id="username" type="text" onblur="checkusername()" onkeyup="restrict('username')" maxlength="16" />
<span id="unamestatus"></span>
<div>Email Address:</div>
<input id="email" type="text" onfocus="emptyElement('status')" onkeyup="restrict('email')" maxlength="88" />
<div>Create Password:</div>
<input id="pass1" type="password" onfocus="emptyElement('status')" />
<div>Confirm Password:</div>
<input id="pass2" type="password" onfocus="emptyElement('status')" />
<div>Gender:</div>
<select id="gender" onfocus="emptyElement('status')">
    <option value=""></option>
    <option value="m">Male</option>
    <option value="f">Female</option>
</select>
<div>Country:</div>
<select id="country" onfocus="emptyElement('status')">
    <option value="england">England</option>
</select>
<button id="signupbtn" onclick="signup()">Create Account</button>
<span id="status"></span>

Ajax/JS:

function signup(){
    var u = _("username").value;
    var e = _("email").value;
    var p1 = _("pass1").value;
    var p2 = _("pass2").value;
    var c = _("country").value;
    var g = _("gender").value;
    var status = _("status");

    if(u == "" || e == "" || p1 == "" || p2 == "" || c == "" || g == ""){
        status.innerHTML = "Message 1"; 
    } else if (p1 != p2){
        status.innerHTML = "Message 2!";
    } else {
        _("signupbtn").style.display = "none";  
        status.innerHTML = "please wait...";
        var ajax = ajaxObj("POST", "signup.php");
        ajax.onreadystatechange = function(){
            if(ajaxReturn(ajax) == true){
                if(ajax.responseText != "signup_success"){
                    status.innerHTML = ajax.responseText;
                    _("signupbtn").style.display = "block"; 
                } else {
                    _("signupform").innerHTML = "Message 3";
                }
            }
        }
        ajax.send("u="+u+"&e="+e+"&p="+p1+"&c="+c+"&g="+g);
    }
}

As you see, I have Message 1, Message 2 and Message 3 in my second code. Here is the part I'm in trouble: I will have multiple language files containing some variables associated with some texts. For example, in my french.php file I will have: $welcome = 'Bonjour!'. Then I will check the default language inside the a MySQL table and will determine wich is it. That's simple. But how can I make AJAX take the $welcome variable and use it instead of Message 1 for example?

For Sharikov:

<head>
<?= include_once("language.php"); ?>
<script type="text/javascript"> 
    window.onload = function() {
        function _(x){ 
            return document.getElementById(x); 
        } 
        var welcome = <?=json_encode($welcome);?>
        _("test").innerHTML = '<h2>Mesajul este: ' + welcome + '</h2>'; 
    }
</script>
</head>
<body>
   <div id="test"></div>
</body>
Foi útil?

Solução

NEW ANSWER FOR ADDED CODE

<?= include_once("language.php"); ?> — this is wrong. You can use <?= only when you outputting variable (<?=$welcome;?> == <?php echo $welcome; ?>). You have to remove = sign from this php tag. <? include_once("language.php"); ?> is correct.

Use console.log(welcome) or alert(welcome) to be sure, that welcome is assigned.

OLD ANSWER You output this js and html throw php, right?

You can use this:

// some php code
?>
<script type="text/javascript">
    var welcome = <?=json_encode($welcome); ?>
    // alert(welcome); // to make sure value is assigned in js
</script>
<?
//more php code or html output

You have to use <?=json_encode($welcome); ?> instead of simple <?=$welcome;?>. Explanation by Marc B:

Never dump arbitrary text from PHP into javascsript code. You are HIGHLY likely to introduce a JS syntax error and kill the entire script. ALWAYS use json_encode: <?= json_encode($welcome) ?>

Additional example:

// more php
include_once("language.php"); 
// var_dump($welcome); // to debug what value assigned to $welcome
?> 
<script type="text/javascript"> 
    window.onload = function() {
        function _(x){ 
        return document.getElementById(x); 
        } 
        var welcome = <?=json_encode($welcome);?>
        _("test").innerHTML = '<h2>Mesajul este: ' + welcome + '</h2>'; 
    }
</script>
<?
// more php
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top