sending variables from <a> to javascript, from javascript to <form value>

I have the following codes:

code1:

<div name="content">
    <a id="various3" href="picture.php" title="<?php echo $info; ?> " idno="5" >
        <img class="last" src="./images/page11.png" />
    </a>
</div>

code2:

<script language="javascript" type="text/javascript">
        $(document).ready(function() {
        var imagelinks = $('div[name=content] a');
        idno = imagelinks.attr开发者_Go百科('idno');
        document.getElementById("pid").value = idno;
</script>

code3:

<form id="target" method="get" action="picture.php?=">
    <input id="pid" name="pid" value="" />

code4:

<?php

$host = 'localhost';
$user = 'root';
$pw = '';
$db = 'thepillar';
$phpVar = $_GET["pid"];

mysql_connect($host,$user,$pw); 
mysql_select_db($db); 
$sql = "select pics, ext from infopics where id='$phpVar'"; 
$result = mysql_query($sql) or die('Bad query at 12!'.mysql_error()); 
while($row = mysql_fetch_array($result,MYSQL_ASSOC))
{
    $db_img = $row['pics'];
    $type = $row['ext'];
} 
$img = base64_decode($db_img); //print_r($db_img );
$img = imagecreatefromstring($img);
header("Content-Type: image/jpeg");
imagejpeg($img);
imagedestroy($img);

?>

.code1, code2, and code3 are on the same page index.php, while code4 is on another page picture.php.

the flow that i want to have is that when index.php loads code2 assigns every tag inside as imagelinks, and then declare a javascript variable idno and then sets the idno attribute in my tag in code1 as its value.

idno = imagelinks.attr('idno');

next up

document.getElementById("pid").value = idno;

this code sets the javascript variable idno as the value for the input id="pid" in my code3. as a result a textbox appears on my index.php containing the value from my code3.

.what i want to do is to pass the pid value to code4 in my picture.php and store it as the value of $phpVar

$phpVar = $_GET["pid"];

and it is performed when i click the tag inside code1 instead of using a .

Firstly, the jQuery inside $(document).ready could be written more simply like so:

$('#pid').val($('div[name=content] a').attr('idno'));

If you then want to send that to the php, you could add something like:

$('#various3 img').click(function(){
    $('#target').submit();
});

Which will submit the form when the image is clicked.

I would also second the commenter's advice regarding SQL sanitizing and not using arbitrary HTML attributes.