PHP variable from external .php file, inside JavaScript?

Question

I have got this JavaScript code for uploading files to my server (named it "upload.js"):

function startUpload(){
    document.getElementById('upload_form').style.visibility = 'hidden';
    return true;
}

function stopUpload(success){
    var result = '';
    if (success == 1){
        result = '<div class="correct_sms">The file name is [HERE I NEED THE VARIABLE FROM THE EXTERNAL PHP FILE]!</div>';
    }
    else {
        result = '<div class="wrong_sms">There was an error during upload!</div>';
    }
    document.getElementById('upload_form').innerHTML = result;
    document.getElementById('upload_form').style.visibility = 'visible';
    return true;
}

And I've got a simple .php file that process uploads with renaming the uploaded files (I named it "process_file.php"), and connects again with upload.js to fetch the result:

<?php
    $file_name = $HTTP_POST_FILES['myfile']['name'];

    $random_digit = rand(0000,9999);

    $new_file_name = $random_digit.$file_name;

    $path= "../../../images/home/smsbanner/pixels/".$new_file_name;
    if($myfile !=none)
    {
        if(copy($HTTP_POST_FILES['myfile']['tmp_name'], $path))
        {
            $result = 1;
        }
        else
        {
            $result = 0;
        }
    }
    sleep(1);
?>

<script language="javascript" type="text/javascript">window.top.window.stopUpload(<?php echo $result; ?>);</script>

What I need is inside upload.js to visualize the new name of the uploaded file as an answer if the upload process has been correct? I wrote inside JavaScript code above where exactly I need to put the new name answer.

Answer 1

You have to change your code to the following.

<?php
    $file_name = $HTTP_POST_FILES['myfile']['name'];

    $random_digit=rand(0000,9999);

    $new_file_name=$random_digit.$file_name;

    $path= "../../../images/home/smsbanner/pixels/".$new_file_name;
    if($myfile !=none)
    {
        if(copy($HTTP_POST_FILES['myfile']['tmp_name'], $path))
        {
            $result = 1;
        }
        else
        {
            $result = 0;
        }
    }
    sleep(1);
?>

<script language="javascript" type="text/javascript">window.top.window.stopUpload(<?php echo $result; ?>, '<?php echo "message" ?>');</script>

And your JavaScript code,

function stopUpload(success, message){
    var result = '';
    if (success == 1){
        result = '<div class="correct_sms">The file name is '+message+'!</div>';
    }
    else {
        result = '<div class="wrong_sms">There was an error during upload!</div>';
    }
    document.getElementById('upload_form').innerHTML = result;
    document.getElementById('upload_form').style.visibility = 'visible';
    return true;
}

Answer 2

RageZ's answer was just about what I was going to post, but to be a little more specific, the last line of your php file should look like this:

<script language="javascript" type="text/javascript">window.top.window.stopUpload(<?php echo $result; ?>, '<?php echo $new_file_name ?>');</script>

The javascript will error without quotes around that second argument and I'm assuming $new_file_name is what you want to pass in. To be safe, you probably even want to escape the file name (I think in this case addslashes will work).

Answer 3

A dumb man once said; "There are no stupid questions, only stupid answers". Though he was wrong; there are in fact loads of stupid questions, but this is not one of them.

Besides that, you are stating that the .js is uploading the file. This isn't really true. I bet you didn't post all your code.

You can make the PHP and JavaScript work together on this problem by using Ajax , I recommend using the jQuery framework to accomplish this, mostly because it has easy to use functions for Ajax, but also because it has excellent documentation.

Answer 4

How about extending the callback script with:

window.top.window.stopUpload(
    <?php echo $result; ?>,
    '<?php echo(addslashes($new_file_name)); ?>'
);

(The addslashes and quotes are necessary to make the PHP string come out encoded into a JavaScript string literal.)

Then add a 'filename' parameter to the stopUpload() function and spit it out in the HTML.

$new_file_name=$random_digit.$file_name;

Sorry, that is not sufficient to make a filename safe. $file_name might contain segments like 'x/../../y', or various other illegal or inconsistently-supported characters. Filename sanitisation is much harder than it looks; you are better off making up a completely new (random) file name and not relying on user input for it at all.