How do I pass PHP variable names to Javascript function - php

Question

I have two pages one called upload-file.php, this page uploads the image into the database and my folder.
My PHP page looks like this.
if (move_uploaded_file($_FILES['uploadfile']['tmp_name'], $file))
{
$insert=mysql_query("insert into match_item_image set item_id='".$_SESSION["session_temp"]."', image='".$name."', adid='$adid'") or die(mysql_error());
$cc=mysql_insert_id();
echo "success".$cc;
My other page consist of a javascript function which displays my images upon upload.
The problem I am having is that I need to change the image name when uploading it into my folder. I was able to change the image name but when I upload the image it displays blank because the JavaScript function Is looking for the original name of the image, when the users uploads the file.
This is part of the function:
$(function()
{
var btnUpload=$('#upload');
var status=$('#status');
new AjaxUpload(btnUpload, {
action: 'upload-file.php',
name: 'uploadfile',
onSubmit: function(file, ext)
{
if (! (ext && /^(jpg|png|jpeg|gif)$/.test(ext))){
// extension is not allowed
status.text('Only JPG, PNG or GIF files are allowed');
return false;
}status.text('Uploading...');
},
onComplete: function(file, response)
{
//On completion clear the status
status.text('');
//Add uploaded file to list
var bb=response.substr(0,7)
var idd=response.replace('success',' ');
var idb =idd.replace(/^\s*|\s*$/g,'');
if(bb==="success")
{
$('<span id='+idd+'></span>').appendTo('#files').html('<img src="upload/+file+" alt="" width="290" height="330" class="image1" /><br><a href="javascript:void(0)" onClick="deleteFile('+idd+');" class="image1" > <span style="font-weight:bold; font-size:14px; color:red;" > Delete </span></a>').addClass('success');
}
else
{
$('<span></span>').appendTo('#files').text(response).addClass('error');
}
Please let me know if anyone can help.
I am new to javascript.
Hi,
I forgot to add that the form to upload the image looks like this
<div id="upload" ><span>Upload Image<span></div><span id="status"></span>
<table><tr><td id="files"></td></tr></table>
I just need to know how I can make my code display the image name I have saved in my folder and right after i upload it and not the original image name that the users upload because there might be other users who uploaded images with the same name and they are getting mixed up.
Thanks for everyone help. I been working on this for weeks now and i cant seem to figure it out. I just dont want to give up on this piece of code because it is exactly what I need.

Answer 1

You can write PHP right into your javascript like this:
<script>
alert('<?php echo $myVar; ?>');
</script>
Alternatively, you can create AJAX calls to acquire database variables, processed by a PHP script.
Recommendation based on your code:
Make your onSuccess function give you the name of the file from the PHP page. You can do this with JSON. Please ask if you need help.

Answer 2

Instead of this PHP-Code:
echo "success".$cc;
you could output your result as a JSON-String, which can be easily access by JavaScript:
header("Content-Type: application/json");
echo "{
\"status\" : \"success\",
\"filename\" : "$file",
\"id\" : $cc
}";
Instead of this JavaScript part
//Add uploaded file to list
var bb=response.substr(0,7)
var idd=response.replace('success',' ');
var idb =idd.replace(/^\s*|\s*$/g,'');
you would then be able to access the parameters of your result just like properties of the response object:
var bb = response.status;
var idd = response.id;
var filename = response.filename;
See http://de.wikipedia.org/wiki/JSON for more info.
You can also use php functions for JSON output: http://www.php.net/manual/de/function.json-encode.php

Answer 3

echo '<script type="text/javascript">var myJSVar = '.$myPHPVar.';</script>';

Answer 4

You will want to have your PHP script output the new name, and then use that in your JavaScript. How you would go on extracting the response depends on your AJAX code, and I am not familiar with what you used in the example.