CODEWITHSUNDEEP
phpjavascript
user2746093
user2746093

Reputation: 33

how to get php variable in javascript

I want to get value of $security_code which is in captchaCode.php file, in captcha.php file through javascript.I can not include this file in captcha.php file . Here is the code of Captcha_code.php and this code not comes inside any function of this file:

$captcha = new CaptchaCode();
$security_code = str_encrypt($captcha->generateCode(6));

And here is my javascript function, through this function i want to get the value of $security:

function refresh_captcha()
{
    var img = document.getElementById('captcha_img');
    img.src = '<?php echo "/captcha_images.php"?>';
    jQuery("#captcha_img").attr("src",img.src);
    jQuery("#security_code").val("<?php echo $security_code;?>");
}

Actually this code is for getting new encrypted value when captcha is refreshed without refreshing the page.

Upvotes: 0

Views: 308

Answers (4)

Ajith S
Ajith S

Reputation: 2917

In your php file captcha.php,

    $captcha = new CaptchaCode();
    $security_code = str_encrypt($captcha->generateCode(6));?>
    <script>
         var code = '<?= $security_code ?>';
    </script><?php // rest of the php codes

In your js file

function refresh_captcha()
{
    var img = document.getElementById('captcha_img');
    img.src = code;
    jQuery("#captcha_img").attr("src",img.src);
}

Upvotes: 0

Ravindra Gullapalli
Ravindra Gullapalli

Reputation: 9158

You have to change the image source assignment related code. No need to assign PHP tag. Just assign the PHP file name instead like this.

function refresh_captcha()
{
    var img = document.getElementById('captcha_img');
    img.src = '/captcha_images.php';
    jQuery("#captcha_img").attr("src",img.src);
    /*This line will not work without Ajax request*/
    /*jQuery("#security_code").val("<?php echo $security_code;?>");*/
}

Upvotes: 1

Ivan Yonkov
Ivan Yonkov

Reputation: 7034

If you cannot include the files, you need to use ajax request.

captcha.php

$captcha = new CaptchaCode();
$security_code = str_encrypt($captcha->generateCode(6));
echo json_encode($security_code);

in your js:

<img src="" id="captcha_img" onclick="refresh_captcha()"/>
<script>

    function refresh_captcha()
{
    $.ajax({
        url : 'captcha.php',
        type : 'POST',
        dataType : 'json',
        success : function (security_code) {
            var source = security_code;
            var img = document.getElementById('captcha_img');
            img.src = source;
            jQuery("#captcha_img").attr("src",img.src);
            jQuery("#security_code").val(source);
        }
    });

}
</script>

The onclick event on the img could be totally wrong, but for the excercise purpose, I've put it there.

Depends on what $security_code is, you can for example, not use JSON.

Upvotes: 0

Starx
Starx

Reputation: 78971

Send an ajax request to a page to output only the code like:

File: outputcode.php (demo only)

$captcha = new CaptchaCode();
$security_code = str_encrypt($captcha->generateCode(6));
echo $security_code;
exit;

Next, grab that value using AJAX, like for example in jQuery

$("#refresh_code").on('click', function() {
   $.get("outputcode.php", function(data) {
      //data will now hold the new code
   });
});

Hope this gives you an idea.

Upvotes: 0

Related Questions