Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Server-side Scripting _ drop down menu

Posted by: tudsy Aug 15 2016, 07:41 PM

)Hi

I am still having problems in trying to come up with a drop down menu. I have attached the full code and the resulting output (screenshot).

The main problem is that I am not generating the options in the drop down menu. Can anyone help?


Thanks.


Attached thumbnail(s)
Attached Image

Attached File(s)
Attached File  code.txt ( 5.36k ) Number of downloads: 890

Posted by: CharlesEF Aug 17 2016, 12:05 AM

I have no idea what are valid values for $pname and $person. Have you tried entering this URL into your browser directly? Substitute a valid name for $pname. 'http://103.226.223.161/~ecovibdc/ECOVIB2D/MYART/$pname/Graphicw'. Is the directory accessible? Or do you get a 403 Forbidden error?

Posted by: tudsy Aug 17 2016, 12:52 AM

Hi

Thanks for that.


Graphicw has permissions set at 0755.

Thanks

Posted by: CharlesEF Aug 17 2016, 02:43 PM

So, does that mean the problem was permissions? Or, are you still having the same problem?

Posted by: tudsy Aug 18 2016, 05:56 AM

Hi

I am having the same problem but I put the url, http://103.........., in the address bar of the browser and got a 403 error.
I since asked my isp to enable directory browsing and was able to see my files.Alas, I am having the same problem.


Thanks biggrin.gif

Posted by: CharlesEF Aug 18 2016, 08:54 AM

Sorry to hear that. I looked over your code but I don't see any obvious errors. I would suggest you place many echos in your code to be sure the results at each step are what you expect.

Posted by: tudsy Aug 20 2016, 11:51 AM

Hi

I used glob() and it works!. It creates the menu (drop down) but it still does not load the picture as you select it.
I will work on it.
Thanks.



foreach(glob("/home/ecovibdc/public_html/ECOVIB2D/MYART/".$pname."/Graphicw/*.bmp") as $files1){

$files1 = basename($files1);

$options= "<option value=".$files1.">".$files1."</option>";


echo "$options";

}

Posted by: CharlesEF Aug 20 2016, 09:37 PM

I think what you need to do is this. The <select> tag needs to have an onchange event fire. The function that is assigned to the onchange event will need to do 1 of 2 things.

1. Use javascript to submit the page back to itself and have some PHP code assign the image path/name.ext to a <img> tag.
OR
2. Use AJAX and PHP to load the selected image into a <img> tag.

You need to decide which option works better for you.

Posted by: CharlesEF Aug 21 2016, 05:20 AM

Maybe, since you are not uploading an image to the server, you don't need to use PHP or AJAX at all. You might be able to use Javascript to set the 'src' attribute of the <img> tag.

It's been awhile since I had to do this so I don't remember for sure, but this is another option to try.

Posted by: Christian J Aug 21 2016, 04:17 PM

QUOTE(CharlesEF @ Aug 21 2016, 12:20 PM) *

Maybe, since you are not uploading an image to the server, you don't need to use PHP or AJAX at all.

Note that using an onchange event to reload the page might annoy users, especially if the SELECT menu is located a bit down on the page --suddenly the whole page reloads, and the user has lost focus of the SELECT menu and finds himself at the top of the new page.

QUOTE
You might be able to use Javascript to set the 'src' attribute of the <img> tag.

Yes, and it may also be a good idea to preload the images with javascript to avoid any delays. Also, BMP images may not be ideal due to their large file sizes (older browser don't support them either).

Posted by: tudsy Aug 30 2016, 10:43 PM

Hi

My problem is now using JS to update the image when the user selects a image from the drop down menu.

Attached is the code in what I am trying to do.Attached File  code.txt ( 2.15k ) Number of downloads: 890

Posted by: CharlesEF Sep 1 2016, 01:24 AM

This is just an outline of what needs to be done. You should do some more research.

In the <select>'s onchange="functionName(image_path);" the actual function should have something like this:

CODE
functionName(path)
{
  var newPath = path;
  var newImage = new Image();
  newImage.src = newPath;
  newImage.onerror = function()
  {
   code to run if there is an error, like file not found
  }
  newImage.onload = function()
  {
   document.getElementById('imageId').src = newPath;
  }
}
newImage is used to pre-load the image and if there is no error then you set the 'src' attribute of the <img> tag.

Posted by: tudsy Sep 5 2016, 12:01 AM

Hi again


I have adopted the changes from the last post but I was wondering what is the effect of having two onchange events in the same script?

Do they execute simultaneously? or what?

Attached is the updated code.

Any help will be appreciated. Thanks.



Attached File(s)
Attached File  updatedcode.txt ( 2.16k ) Number of downloads: 628

Posted by: Christian J Sep 5 2016, 06:52 AM

QUOTE(tudsy @ Sep 5 2016, 07:01 AM) *

I have adopted the changes from the last post

This is not a valid Doctype:

CODE
<!DOCTYPE PHP>

Also there's no reason to create all the HTML and javascript with PHP, it only complicates things for you. Only use PHP for the parts where actual PHP code is used, like the PHP loop that creates the OPTION elements.

QUOTE
but I was wondering what is the effect of having two onchange events in the same script?

I don't think the onchange event applies to IMG elements, only form elements like SELECT. Use it on the SELECT menu, and let the same javascript function change both text and image.

Posted by: CharlesEF Sep 5 2016, 09:09 AM

Christian J has already pointed out some problems. Why do you insist on using PHP to build so much of the page? As far as I can see the getText(element) is useless. The <select> tag, by default, will show the selected text. Also, in the .onerror section of the changePic(path) function, why are you using 'var img = new Image();' again? If it failed to load the first time why would it work the second time? Based on what I think you want your code to do I have re-written it. I would still do some things differently but it's a start.

CODE
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>ECOVIB2D©</title>
<script type="text/javascript">
function changePic(path)
{
var myimg = document.getElementById('myImage');
var newImage = new Image();
newImage.src = path;
newImage.onerror = function()
{
  alert("There was a problem loading the file!");
  myimg.style.height = '';
  myimg.src = '';
}
newImage.onload = function()
{
  myimg.src = path;
}
}
</script>
</head>
<body>
<select name='Graphic_select' id='Graphic_select' onchange='changePic("/home/ecovibdc/public_html/ECOVIB2D/MYART/AdrianTudini/Graphicw/" + this.value)';>
<option   value ='default' selected style='height:120px;'>Click-Tap dropdown menu to view/select AdrianTudini's Art</option>
<?php
foreach(glob("/home/ecovibdc/public_html/ECOVIB2D/MYART/AdrianTudini/Graphicw/*.bmp") as $files1)
{
  $files1 = basename($files1);
  echo " <option value='{$files1}'>{$files1}</option>";
}
?>
</select>
<br>
<img id='myImage' src='' alt='Picture'>
</body>
</html>
If you want the image '260506_2_29w.bmp' to be shown when the page loads then put it back in the 'src' attribute of the <img> tag.

EDIT: After posting I see that the copyright entity was change to the actual symbol, you will have to put the HTML entity back in.

Posted by: CharlesEF Sep 5 2016, 12:13 PM

I forgot to say that the code I posted is not tested. In fact, I can already see 1 thing you should add to the code. Everything in the function should be wrapped in an if() statement to prevent the code from running if/when the 'default' value is selected. This means you will have to move the file path to the function itself, like this:

CODE
function changePic(picname)
{
  if(picname != 'default')
  {
    var path = "/home/ecovibdc/public_html/ECOVIB2D/MYART/AdrianTudini/Graphicw/" + picname;
    var myimg = document.getElementById('myImage');
    var newImage = new Image();
    newImage.src = path;
    newImage.onerror = function()
    {
      alert("There was a problem loading the file!");
      myimg.style.height = '';
      myimg.src = '';
    }
    newImage.onload = function()
    {
      myimg.src = path;
    }
  }
}
You also need to change the <select> tag to this:
CODE
<select name='Graphic_select' id='Graphic_select' onchange='changePic(this.value);'>

This new code is also not tested.

Posted by: tudsy Sep 6 2016, 07:29 AM

Hi


I got it to work by putting the absolute path (http://......) not the relative path.

Thanks.

Posted by: CharlesEF Sep 6 2016, 01:16 PM

QUOTE(tudsy @ Sep 6 2016, 07:29 AM) *

Hi


I got it to work by putting the absolute path (http://......) not the relative path.

Thanks.

Great, good to know. Did my code help? Were there any bugs, besides the path problem?

Posted by: tudsy Sep 9 2016, 02:52 AM

Hi

The path was the only problem.

Posted by: tudsy Sep 9 2016, 02:58 AM

Hi

I was wondering. Can I use the same type of code (with modifications) to link the sound to the graphic (see attached)?

Thanks.


Attached File(s)
Attached File  codewithsound.txt ( 6.87k ) Number of downloads: 612

Posted by: CharlesEF Sep 9 2016, 10:18 AM

When using the audio tag, there was a time when IE didn't support .wav files. You should use .mp3 files to ensure compatibility with most browsers. Audio doesn't support .onerror and .onload, and .preload is not meant to be used as you are trying. I would try something like this:

CODE
var audio = new Audio();
audio.addEventListener('canplaythrough', function()
  {
    audio.play();
  }, false);
audio.addEventListener('ended', function()
  {
    alert('ended');
  }, false);
audio.src = soundfilepath;
OR
CODE
var audio = new Audio(soundfilepath);
audio.addEventListener('canplaythrough', function()
  {
    audio.play();
  }, false);
audio.addEventListener('ended', function()
  {
    alert('ended');
  }, false);

Posted by: CharlesEF Sep 9 2016, 01:46 PM

BTW, you never answered my question. Why do you insist on using PHP to build so much of the page?

Posted by: tudsy Sep 10 2016, 11:46 PM

QUOTE(CharlesEF @ Sep 10 2016, 04:16 AM) *

BTW, you never answered my question. Why do you insist on using PHP to build so much of the page?



To be honest, I am still learning.

Posted by: CharlesEF Sep 11 2016, 06:52 AM

QUOTE(tudsy @ Sep 10 2016, 11:46 PM) *

QUOTE(CharlesEF @ Sep 10 2016, 04:16 AM) *

BTW, you never answered my question. Why do you insist on using PHP to build so much of the page?



To be honest, I am still learning.

IMO you should get out of that habit, fast. It only makes your code hard to read and debug. Since you say you are learning you should drop your bad habits. Yes, thee may be a time when you need to build some of the page with PHP but 99% of the time you don't.

Did you ever see the survey page I re-wrote for you? You remember, it's the one you tried using javascript for. Check post #8 http://forums.htmlhelp.com/index.php?showtopic=43071&hl=. That's the reason you should always come back to your thread for a few days. You might not have anything to add but other people might.

Posted by: tudsy Sep 13 2016, 11:13 AM

QUOTE(CharlesEF @ Sep 11 2016, 09:22 PM) *

QUOTE(tudsy @ Sep 10 2016, 11:46 PM) *

QUOTE(CharlesEF @ Sep 10 2016, 04:16 AM) *

BTW, you never answered my question. Why do you insist on using PHP to build so much of the page?



To be honest, I am still learning.

IMO you should get out of that habit, fast. It only makes your code hard to read and debug. Since you say you are learning you should drop your bad habits. Yes, thee may be a time when you need to build some of the page with PHP but 99% of the time you don't.

Did you ever see the survey page I re-wrote for you? You remember, it's the one you tried using javascript for. Check post #8 http://forums.htmlhelp.com/index.php?showtopic=43071&hl=. That's the reason you should always come back to your thread for a few days. You might not have anything to add but other people might.



Hi

Thanks for that.

I have rewritten the code in javascript with a small section of php. The output reaches the php section but it does not execute it.
Can anyone please help?

Thanks.


Attached File(s)
Attached File  codejsandphp.txt ( 8.01k ) Number of downloads: 801

Posted by: CharlesEF Sep 13 2016, 11:57 AM

Does the page have a .php extension? Have you looked in the PHP error log? The only problem I can see is a problem we have already gone over. This line of code is wrong:

CODE
$options  = "<option value=".$files1.">".$files1."</option>";
The value attribute will not have the required quotes. It should be:
CODE
$options  = "<option value='".$files1."'>".$files1."</option>";
I would write it like this:
CODE
echo "<option value='{$files1}'>{$files1}</option>";

Posted by: tudsy Sep 16 2016, 12:03 AM

Hi

Thanks for that.

I m trying to let the user play the sound on the webpage. I used the 'click' word in your code but it did not work.
Can you please help?

ThanksAttached File  codesound.txt ( 7.85k ) Number of downloads: 984

Posted by: CharlesEF Sep 16 2016, 08:50 AM

I'm not sure where you came up with 'click'. I never used it in any sample audio code. The audio event should be 'canplaythrough'.

Posted by: tudsy Sep 19 2016, 12:33 PM

Hi

I am still having problems with the 'sound' code you wrote. It does not work. Can you please help?

Thanks.

Posted by: CharlesEF Sep 19 2016, 04:56 PM

I've never used javascript's Audio command but from what I understand you will never get instant sound. When you use the 'new Audio(pathtosoundfile)' the sound file will start to download. After it reaches a certain point the event 'canplaythrough' will fire. The event listener will catch that event and issues the 'play' command. Remember, only 3 audio formats are supported, .mp3, .wav and .ogg.

Maybe you should look into HTML5 <audio> tag. You could use javascript to load, play, pause, etc...

Posted by: tudsy Sep 19 2016, 09:40 PM

Hi

Thanks for that.

After some manipulation, I am trying to return the selectedgraphicfilename (graphic that people buy) to pass through the query string when the user presses buy.

But I am not getting anything from the functions changePic and for that matter, linkSound.

Also, the variable Priceofart is nothing in the query string.


Can anyone help?

Here is the code:


<!DOCTYPE html>

<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252">


<script>

(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-908952-3', 'auto');
ga('send', 'pageview');
ga('require','linkid');
</script>






<script>



var personsnamejs ='AdrianTudini';

var personpicture = personsnamejs + '.jpg';

var Priceofart = 2;

function setVar(){

var personpath = 'http://103.226.223.161/~ecovibdc/ECOVIB2D/MYART/' + personsnamejs + '/' + personpicture;

document.getElementById('Price').innerHTML= 'Price of Art ( without a watermark )(USD): $' + Priceofart;

var x = document.getElementById('Title');
x.style.color = '#00FF00';
x.style.fontSize ='36px';

document.getElementById('PersonImage').src = personpath;

var y = document.getElementById('Price');
y.style.color = '#00FF00';
y.style.fontSize ='36px';

var z = document.getElementById('PlaySound');
z.style.color = '#00FF00';
z.style.fontSize ='24px';

var t = document.getElementById('paypal');
t.style.color = '#00FF00';
t.style.fontSize ='24px';

var u = document.getElementById('freename');
u.style.color = '#00FF00';
u.style.fontSize ='20px';

var v = document.getElementById('freeaddress');
v.style.color = '#00FF00';
v.style.fontSize ='20px';


document.getElementById('def').innerHTML = 'Click-Tap dropdown menu to view/select ' + personsnamejs + ' 's Art';




};
</script>


<script type='text/javascript'>

function linkSound(picname,personname)
{

if(picname != 'default')
{

var soundfile = picname.replace('w.bmp','.mp3');





var soundfilepath = 'http://103.226.223.161/~ecovibdc/ECOVIB2D/MYART/' + personname + '/Sound/' + soundfile;



return soundfilepath;



}


};</script>


<script>

function changePic(picname,personname)
{

if(picname != 'default')
{


var path = 'http://103.226.223.161/~ecovibdc/ECOVIB2D/MYART/' + personname + '/Graphicw/' + picname;

var myimg = document.getElementById('myImage');


var selectedgraphicfilename = picname.replace('w.bmp','.bmp');


var newImage = new Image();
newImage.src = path;



newImage.onerror = function()
{
alert('There was a problem loading the Image file! - Please try again');
myimg.style.height = '';
myimg.src = '';
}
newImage.onload = function()
{
myimg.src = path;

}
return selectedgraphicfilename;
}

};

</script>





<title>ECOVIB2D&copy;</title>
</head>
<body onload='setVar();' style='background-color: #660000'>








<table align='centre' border='0' width='965'>
<tbody>
<tr>
<td bgcolor='#660000' width='189px'><img height='90' src='http://103.226.223.161/~ecovibdc/ECOVIB2D/MYART/ecovib2d1.jpg' width='90' /></td>
<td bgcolor='#660000' width='500px'>
<p align='center' id ='Title'>ECOVIB2D&copy;</p>
</td>
</tr>
</tbody>
</table>





<table align='center' style=' background-color: #660000'>
<tbody>


<br>


<tr>

<center> <p id='Price'> </p></center>


<td align='left'>


<img src= 'personpath' id='PersonImage' width='450' height='450'>


</td>


<td align='top'>

<script> alert(personsnamejs)</script>


<select name='Graphic_select' id='Graphic_select' onchange='changePic(this.value,personsnamejs);linkSound(this.value,personsnamejs);'/>





<option value ='default' id = 'def' style='height:120px;'></option>


<?php

$pname = "AdrianTudini";

foreach(glob("/home/ecovibdc/public_html/ECOVIB2D/MYART/".$pname."/Graphicw/*.bmp") as $files1){

$files1 = basename($files1);


echo "<option value='{$files1}'>{$files1}</option>";
}

?>

</select>




<img id='myImage' src='' height='450' width='450'>

<p align='center' id='PlaySound' >Play the sound with my art in mind</p>


<center><audio id='audiotag1' controls='controls'><source='soundfilepath' type='audio/mpeg'>You cannot play the sound in browser.</audio></center>

</td>
</tr>
</table>

<script>alert(selectedgraphicfilename);</script>

<form action='http://103.226.223.161/~ecovibdc/ECOVIB2D/MYART/process.php?Price=Priceofart&Graphic=selectedgraphicfilename' method='POST'>

<p align='center' id='freename'>Enter Full Name:</p>

<p align='center'><input id='Nameofperson' maxlength='50' name=username size='50' type='text' /></p>

<p align='center' id='freeaddress'>Enter Email-Address:</p>

<p align='center'><input id='e-address' maxlength='50' name=email size='50' type='text' /></p>

<p align='center'><input type='submit'style='height:65px;width:220px;font-size:36px' value='Buy*' />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type='reset'style='height:65px;width:220px;font-size:36px;' value='Clear' /></p>
</form>

<p align='center' id='paypal'>* You will be requested by email to pay by Paypal&copy;. Your name and email address will not be sold or traded</p>

<p align='center' class='style8'><a href='http://ecovib2d.blogspot.com.au'>Back to Ecovib2d's blog</a></p>


<p align='center'><span class='style8'><a href='mailto:tudsy@ecovib2d.com.au'>Send me Mail</a></span></p>









</body>
</html>

Posted by: CharlesEF Sep 20 2016, 09:25 AM

This line of code is wrong:

CODE
document.getElementById('def').innerHTML = 'Click-Tap dropdown menu to view/select ' + personsnamejs + ' 's Art';
You need to learn to use your browsers debugging tools. This error would have been caught. The line should be:
CODE
document.getElementById('def').innerHTML = 'Click-Tap dropdown menu to view/select ' + personsnamejs + " 's Art";
Can you tell me why?

Also, this line of code is wrong:
CODE
<img src= 'personpath' id='PersonImage' width='450' height='450'>
personpath is a javascript variable. When you put quotes around it you turn it into a string. So, the 'src' attribute will contain the word personpath not the value of the variable. If you want the value of the variable then you need to use <script> tags.

In a previous post you stated you had the image change working but not the sound. This message makes it sound like nothing is working. Which is it?

Posted by: tudsy Sep 21 2016, 04:14 AM

Hi again

Thanks for that.

I have got the image working but the sound is still loading the soundfile.

when it first loads, the display on the audio tag says 'loading'

I have checked the sizes of the MP3 files and they are reasonable.

Here is the code:

<!DOCTYPE html>

<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252">


<script>

(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-908952-3', 'auto');
ga('send', 'pageview');
ga('require','linkid');
</script>






<script>



var personsnamejs ='AdrianTudini';

var personpicture = personsnamejs + '.jpg';

var Priceofart = 2;

function setVar(){

var personpath = 'http://103.226.223.161/~ecovibdc/ECOVIB2D/MYART/' + personsnamejs + '/' + personpicture;

document.getElementById('Price').innerHTML= 'Price of Art ( without a watermark )(USD): $' + Priceofart;

var x = document.getElementById('Title');
x.style.color = '#00FF00';
x.style.fontSize ='36px';

document.getElementById('PersonImage').src = personpath;

var y = document.getElementById('Price');
y.style.color = '#00FF00';
y.style.fontSize ='36px';

var z = document.getElementById('PlaySound');
z.style.color = '#00FF00';
z.style.fontSize ='24px';

var t = document.getElementById('paypal');
t.style.color = '#00FF00';
t.style.fontSize ='24px';

var u = document.getElementById('freename');
u.style.color = '#00FF00';
u.style.fontSize ='20px';

var v = document.getElementById('freeaddress');
v.style.color = '#00FF00';
v.style.fontSize ='20px';


document.getElementById('def').innerHTML = 'Click-Tap dropdown menu to view/select ' + personsnamejs + " 's Art";




};
</script>


<script type='text/javascript'>

function linkSound(picname,personname)
{

if(picname != 'default')
{

soundfile = picname.replace('w.bmp','.mp3');


var soundfilepath = 'http://103.226.223.161/~ecovibdc/ECOVIB2D/MYART/' + personname + '/Sound/' + soundfile;



return soundfilepath;



}


};</script>


<script>

function changePic(picname,personname)
{

if(picname != 'default')
{


var path = 'http://103.226.223.161/~ecovibdc/ECOVIB2D/MYART/' + personname + '/Graphicw/' + picname;

var myimg = document.getElementById('myImage');


var selectedgraphicfilename = picname.replace('w.bmp','.bmp');


var newImage = new Image();
newImage.src = path;



newImage.onerror = function()
{
alert('There was a problem loading the Image file! - Please try again');
myimg.style.height = '';
myimg.src = '';
}
newImage.onload = function()
{
myimg.src = path;

}
return selectedgraphicfilename;
}

};

</script>





<title>ECOVIB2D&copy;</title>
</head>
<body onload='setVar();' style='background-color: #660000'>








<table align='centre' border='0' width='965'>
<tbody>
<tr>
<td bgcolor='#660000' width='189px'><img height='90' src='http://103.226.223.161/~ecovibdc/ECOVIB2D/MYART/ecovib2d1.jpg' width='90' /></td>
<td bgcolor='#660000' width='500px'>
<p align='center' id ='Title'>ECOVIB2D&copy;</p>
</td>
</tr>
</tbody>
</table>





<table align='center' style=' background-color: #660000'>
<tbody>


<br>


<tr>

<center> <p id='Price'> </p></center>


<td align='left'>


<img src= personpath id='PersonImage' width='450' height='450'>


</td>


<td align='top'>


<select name='Graphic_select' id='Graphic_select' onchange='changePic(this.value,personsnamejs);linkSound(this.value,personsnamejs);'/>





<option value ='default' id = 'def' style='height:120px;'></option>


<?php

$pname = "AdrianTudini";

foreach(glob("/home/ecovibdc/public_html/ECOVIB2D/MYART/".$pname."/Graphicw/*.bmp") as $files1){

$files1 = basename($files1);


echo "<option value='{$files1}'>{$files1}</option>";
}

?>

</select>




<img id='myImage' src=path height='450' width='450'>

<p align='center' id='PlaySound' >Play the sound with my art in mind</p>

<script> alert(soundfilepath);</script>
<center><audio controls><source src= soundfilepath type='audio/mpeg'>You cannot play the sound in browser.</audio></center>

</td>
</tr>
</table>

<script>alert(selectedgraphicfilename);</script>

<form action='http://103.226.223.161/~ecovibdc/ECOVIB2D/MYART/process.php?Price=Priceofart&Graphic=selectedgraphicfilename' method='POST'>

<p align='center' id='freename'>Enter Full Name:</p>

<p align='center'><input id='Nameofperson' maxlength='50' name=username size='50' type='text' /></p>

<p align='center' id='freeaddress'>Enter Email-Address:</p>

<p align='center'><input id='e-address' maxlength='50' name=email size='50' type='text' /></p>

<p align='center'><input type='submit'style='height:65px;width:220px;font-size:36px' value='Buy*' />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type='reset'style='height:65px;width:220px;font-size:36px;' value='Clear' /></p>
</form>

<p align='center' id='paypal'>* You will be requested by email to pay by Paypal&copy;. Your name and email address will not be sold or traded</p>

<p align='center' class='style8'><a href='http://ecovib2d.blogspot.com.au'>Back to Ecovib2ds blog</a></p>


<p align='center'><span class='style8'><a href='mailto:tudsy@ecovib2d.com.au'>Send me Mail</a></span></p>









</body>
</html>

Posted by: CharlesEF Sep 21 2016, 05:53 AM

This line of code is still wrong:

CODE
<img src= personpath id='PersonImage' width='450' height='450'>
Actually, there are 2 problems. Problem 1: there needs to be quotes around the 'src' attribute. Problem 2: the javascript variable 'personpath' will not get converted to the value of the variable. In fact, I'm not even sure you can put javascript code inside HTML tag attributes, like you can with PHP. The best way to write this line is:
CODE
<img src='' id='PersonImage' width='450' height='450'>
And let this line of code set the 'src' attribute:
CODE
document.getElementById('PersonImage').src = personpath;
which is found in the setVar() function.

As for the sound problem, I can't help with that at this time. The computer I'm using has no sound (the motherboard sound system died). I may buy a add-in sound card or maybe even a new computer. But, for now I have no sound.

Posted by: tudsy Sep 21 2016, 06:19 AM

Hi

Thanks for that.

I got the sound working with the appropriate graphic.


I put


document.getElementById('Sound').src = soundfilepath;

in the function linkSound.

It works.

Posted by: CharlesEF Sep 21 2016, 06:42 AM

Great news, glad you got it working.

Posted by: tudsy Sep 21 2016, 07:21 AM

Hi

I was wondering how do I pass JavaScript variables through a query string?

Thanks.

Posted by: CharlesEF Sep 21 2016, 01:07 PM

QUOTE(tudsy @ Sep 21 2016, 07:21 AM) *
Hi

I was wondering how do I pass JavaScript variables through a query string?

Thanks.

Do you mean a URL query string? Do you want to use javascript or PHP? Doing a google search for 'javascript build url query string' might help you before I can reply.

Posted by: Christian J Jun 14 2022, 04:38 AM

New post moved to its own thread:

Drop down menu
https://forums.htmlhelp.com/index.php?showtopic=61059&st=0&#entry143749

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)