JavaScript - Onclick, Create Php Variable And Echo Out

I'm doing a school project and I am using JPlayer as a media player. The site is essentially a music jukebox with a search. I have the playlist set up in the jukebox with 5 songs from the start, but I need to make it so that when you do a search and click the plus sign button next to a song, it will change one of the songs in the playlist to that song.

I have the search and everything working but when I click the button it does not actually change the variable in the javascript. Any help or insight to this would be much appreciated.

Below is the javascript (with some PHP, but that shouldn't effect what I need).

Thanks in advance!!

Code:

<link rel="stylesheet" href="stylesheets/style.css" type="text/css" />
		<!-- CSS files required for JPlayer -->
		<link type="text/css" href="skin/jplayer.blue.monday.css" rel="stylesheet" />
		<link rel="stylesheet" href="skin/jplayeraudio.css" type="text/css" />
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
		<script type="text/javascript" src="js/jquery.jplayer.min.js"></script>
		<script type="text/javascript">
		<!--
		var nextSet = 1;
		
		<?php
		$songsInDB = 70;
		
		$rand1 = rand(1, $songsInDB);
		$rand2 = rand(1, $songsInDB);
		while($rand2 == $rand1) {
			$rand2 = rand(1, $songsInDB);
		}
		$rand3 = rand(1, $songsInDB);
		while($rand3 == $rand2 || $rand3 == $rand1) {
			$rand3 = rand(1, $songsInDB);
		}
		$rand4 = rand(1, $songsInDB);
		while($rand4 == $rand3 || $rand4 == $rand2 || $rand4 == $rand1) {
			$rand4 = rand(1, $songsInDB);
		}
		$rand5 = rand(1, $songsInDB);
		while($rand5 == $rand4 || $rand5 == $rand3 || $rand5 == $rand2 || $rand5 == $rand1) {
			$rand5 = rand(1, $songsInDB);
		}
		?>
		
		var var1 = <?php echo $rand1; ?>;
		var var1artist = '<?php echo $database->getSongArtist($rand1); ?>';
		var var1title = '<?php echo $database->getSongTitle($rand1); ?>';
		var var2 = <?php echo $rand2; ?>;
		var var2artist = '<?php echo $database->getSongArtist($rand2); ?>';
		var var2title = '<?php echo $database->getSongTitle($rand2); ?>';
		var var3 = <?php echo $rand3; ?>;
		var var3artist = '<?php echo $database->getSongArtist($rand3); ?>';
		var var3title = '<?php echo $database->getSongTitle($rand3); ?>';
		var var4 = <?php echo $rand4; ?>;
		var var4artist = '<?php echo $database->getSongArtist($rand4); ?>';
		var var4title = '<?php echo $database->getSongTitle($rand4); ?>';
		var var5 = <?php echo $rand5; ?>;
		var var5artist = '<?php echo $database->getSongArtist($rand5); ?>';
		var var5title = '<?php echo $database->getSongTitle($rand5); ?>';
		
		
		var playItem = 0;
		
		$(document).ready(function(){

			var myPlayList = [
				{name:var1artist+" - "+var1title, mp3:"music/"+var1+".mp3"},
				{name:var2artist+" - "+var2title, mp3:"music/"+var2+".mp3"},
				{name:var3artist+" - "+var3title, mp3:"music/"+var3+".mp3"},
				{name:var4artist+" - "+var4title, mp3:"music/"+var4+".mp3"},
				{name:var5artist+" - "+var5title, mp3:"music/"+var5+".mp3"},
			];

			// Local copy of jQuery selectors, for performance.
			var jpPlayTime = $("#jplayer_play_time");
			var jpTotalTime = $("#jplayer_total_time");

			$("#jquery_jplayer").jPlayer({
				ready: function() {
					displayPlayList();
					playListInit(false); // Parameter is a boolean for autoplay.
				},
				ended: function() {
					playListNext();
				},
				swfPath:"/js",
				nativeSupport: true,
				supplied: "mp3"
			});

			$("#jplayer_previous").click( function() {
				playListPrev();
				$(this).blur();
				return false;
			});

			$("#jplayer_next").click( function() {
				playListNext();
				$(this).blur();
				return false;
			});

			function displayPlayList() {
				$("#jplayer_playlist ul").empty();
				for (i=0; i < myPlayList.length; i++) {
					var listItem = (i == myPlayList.length-1) ? "<li class='jplayer_playlist_item_last'>" : "<li>";
					listItem += "<a href='#' id='jplayer_playlist_item_"+i+"' tabindex='1'>"+ myPlayList[i].name +"</a></li>";
					$("#jplayer_playlist ul").append(listItem);
					$("#jplayer_playlist_item_"+i).data( "index", i ).click( function() {
						var index = $(this).data("index");
						if (playItem != index) {
							playListChange( index );
						} else {
							$("#jquery_jplayer").jPlayer("play");
						}
						$(this).blur();
						return false;
					});
				}
			}

			function playListInit(autoplay) {
				if(autoplay) {
					playListChange( playItem );
				} else {
					playListConfig( playItem );
				}
			}

			function playListConfig( index ) {
				$("#jplayer_playlist_item_"+playItem).removeClass("jplayer_playlist_current").parent().removeClass("jplayer_playlist_current");
				$("#jplayer_playlist_item_"+index).addClass("jplayer_playlist_current").parent().addClass("jplayer_playlist_current");
				playItem = index;
				$("#jquery_jplayer").jPlayer("setMedia", myPlayList[playItem]);
			}

			function playListChange( index ) {
				playListConfig( index );
				$("#jquery_jplayer").jPlayer("play");
			}

			function playListNext() {
				var index = (playItem+1 < myPlayList.length) ? playItem+1 : 0;
				playListChange( index );
			}

			function playListPrev() {
				var index = (playItem-1 >= 0) ? playItem-1 : myPlayList.length-1;
				playListChange( index );
			}
		});
		
		function loadSong(songID, artist, title) {
			if(nextSet == 1){
				var1 = songID;
				var1artist = artist;
				var1title = title;
				nextSet++;
			}

			else if(nextSet == 2){
				var2 = songID;
				var2artist = artist;
				var2title = title;
				nextSet++;
			}

			else if(nextSet == 3){
				var3 = songID;
				var3artist = artist;
				var3title = title;
				nextSet++;
			}

			else if(nextSet == 4){
				var4 = songID;
				var4artist = artist;
				var4title = title;
				nextSet++;
			}

			else if(nextSet == 5){
				var5 = songID;
				var5artist = artist;
				var5title = title;
				nextSet++;
			}

			if(nextSet > 5){
				nextSet = 1;
			}
			
			alert("Song has been queued! "+nextSet)
		}
		
		
		var i = 1;
		$(document).ready(function(){
			$(".search").click(function(){
				$.post("livequery.php", { keywords: $(".keywords").val(), mode: $(".mode").val() }, function(data){
					$("table#content").empty()
					$.each(data, function(){
						var _class = "search_content1";
						if(i % 2 == 0) {
							_class = "search_content2";
						}
						$("table#content").append("<tr class='"+_class+"'><td class='trunc_table' width='4%'><input type='button' value='+' onClick=\"loadSong('"+this.id+"', '"+this.artist+"', '"+this.title+"')\" /></td><td class='trunc_table' width='27%'>" + this.title + "</td><td class='trunc_table' width='1%'> </td><td class='trunc_table' width='22%'>" + this.artist + "</td><td class='trunc_table' width='1%'> </td><td class='trunc_table' width='16%'>" + this.album + "</td><td class='trunc_table' width='1%'> </td><td class='trunc_table' width='14%'>" + this.genre + "</td><td class='trunc_table' width='1%'> </td><td class='trunc_table' width='13%'>" + this.mood + "</td></tr>");
						i++;
					});
				}, "json");
			});
		});
		-->
		</script>

Also, the code for the playlist is in the myPlayList array, which I'm referencing the title, artist, and filename with the javascript values. I'm trying to change them in the function loadSong(songID, artist, title). I get the alert popup that I have in there, but no values change as far as the songs.

Hello, I am trying to access a dynamic asp variable with onclick either in a javascript function where I can use it globally or set another div id with this dynamic variable.

Any help is very much appreciated. Thank you!



<script>
function doSomething(article_id)
}
return article_id;

}
</script>

<a href="#test" onClick="doSomething("<%=rsHeadline("article_id")%>")">try here...</a>

<div id="test">
<%articleid = request.querystring("article_id") %>
<% Response.Write articleid %>
The article id is articleid</div>

I'm trying to make a basic rss reader with a google reader-esque functionality of clicking on article names and being able to expand/collapse that article. I'm working on the expand part and am going crazy. I am having no trouble getting content and displaying it without the onclick function but when I try to integrate onclick I can just get the titles.


here's the snippet. any help?




Code:

<!-- HTML -->
<body>
<div id="feeddiv"></div>



<script type="text/javascript">




//	feed stuff using Google Feed API



    function feedLoaded(result)
	{
      if (!result.error)
	   {
        // Grab the container we will put the results into
        var container = document.getElementById('feeddiv');
        container.innerHTML = '';
        // Loop through the feeds, putting the titles onto the page.
        for (var i = 0; i < result.feed.entries.length; i++)
		 {
		  var entry = result.feed.entries[i];
		  var content = entry.content;
		  var title = entry.title;
		  var url = entry.link;
		  var div = document.createElement('div'); //parentDiv for articles
		 
		  var articleTitle = document.createElement('div');
		  articleTitle.setAttribute('name', i); //set articleTitle name to article's place in array
		  articleTitle.setAttribute('style', 'font-weight:bold;font-size:15px;');  
		  articleTitle.innerText = title;
		  articleTitle.onclick  = function() {populate(content, title, url, i);};
		 
		  div.appendChild(articleTitle); //adds title to div

		  container.appendChild(div); //adds div to the container
        }
      }
    }
	
    
    function populate(content,title, url, i)
    {
    
    var article = document.getElementByName(i); //gets articleTitle
   
     	//clickable title
	  var a = document.createElement('a'); //creating title link
	  var href = document.createElement('href'); 
	  a.setAttribute('href', url); //putting actual url into html
	  a.setAttribute('style', 'font-size:25px;');
	  a.innerText = title;//still puts into html

	//Text
    var snippet = document.createElement('p'); //creates <p> to throw articles in
    snippet.innerHTML = content; //renders the article
    
    article.appendChild(a);
    article.appendChild(snippet);
    
    }
</script>
</body>

Below is the code that is using the name FFF in
various places. The effect of all this is that the onclick function is not executed.
I would expect a pop up alert when clicking the submit button.

This only happens if I rename either the form id or the js variable.
Can anyone explain what is going on here ?

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Title</title>
    </head>
    <script type="text/javascript">
        function newobject(){
            this.exec=exec;
            function exec(){
                alert("exec");
            }
        }
         FFF  = new newobject();
    </script>
    <body>
        <form id=" FFF " name="somename" action="" method="GET">
            <input type="text" id="someid" name="somename" value="value">
            <input onclick=" FFF .exec()" type="submit" id="submitid" name="somesubmit"  value="xxx">
        </form>
    </body>
</html>

Regards
Heinz

Simply put, I need to take a variable (The number '20' in this case) that is displayed by an input box on my web page and plug it into a function so that whenever I click on a button, the number in the input box will decrease by 1.

Seems simple enough, though for hours I've been going at it with no luck. Skipping the rest of my code - I currently have:
Code:

 <head>
   <title> Online Slots </title>
   <script type="text/javascript" 
           src="http://dave-reed.com/book/random.js">
   </script>
   <script type="text/javascript">
     function DoSpin()


     {
       var count;
	   count = 20
	   document.getElementById("countBox") = count - 1;
  }

	

   </script>
 </head>

 <body>

   <div style="text-align:center"> 
     <input type="button" value="Click to Spin" onclick="DoSpin()" />
	 <br /><br />
	    Current Funds: 
     <input type="text" id="countBox" size="4" value="20" onfocus="blur();" />
   </div>

 </body>

The entire code is a slot machine project that's supposed to be extremely simple where you hit the button and it spins 3 wheels, 3 of the same image and you win. Every spin takes $1, every win gives $13.

The majority of the code is already working, however for some reason I appear to be failing badly at getting the read out to show a decrement of $1 every time you push the button.

I know this is a bit newbie of a question to be asking; but I've tried so many different ideas that I've found across w3schools, webdevelopersnotes, dave-reed, ect - and so far I haven't been able to get any of them to work correctly.

Any help would be great!

Well, I'm a beginner to coding, so I need some help.
I'm trying to create a short, html/javascript mario text game.
Now, in the beginning, he fights a goomba.
He has a health and energy number as variables:
Code:

<p><img src="http://img253.imageshack.us/img253/9202/mariodisplayidlefront.png" align="middle" hspace=20>
<font size=3 color="red">
Health:
<script language= "javascript">
var mariohealth = '20';
document.write(mariohealth);
</script>
</font>
<br><font size=3 color="green">
Energy:
<script language= "javascript">
var marioenergy = '20';
document.write(marioenergy);
</script>
</align>
</font>

And the goomba has health:
Code:

<p><br><img src="http://img23.imageshack.us/img23/9438/goombafrontdisplay.png" align="middle" hspace=20>
<font size=3 color="red">
Health:
<script language= "javascript">
var goombahealth = '10';
document.write(goombahealth);
</script>
</font>

And then, there will be different buttons for different attacks. However, the only one created is "Punch", with this code:
<FORM>
<INPUT type="button" value="Punch" name="Mario Punch" onClick="?">
</FORM>

What would I put in the onClick function to make it subtract 4 health from the goomba and 2 health from Mario

Ok I am very very new to java to the point where I only know how to use pre-made javascripts in my php code so be gentle.

First, here is part of a form I have:

Code:

<select name = "pulmonologist" >
<option selected="" value="">---Select---
<option value="none">None</option>
<?php		
while ($row2 = mysql_fetch_assoc ($results2)) {   
        ?><option value = "<?php echo $row2['staff_name'];?>"><?php echo $row2['staff_name'];?></option>
<?php }
?>
</select>

Ok now I want to echo the value that the user selects on the SAME page (i.e. before the submit button is pressed) (so I can't do it with php, I need javascript) like this:

Code:

<input type="submit" value = "Contact <?php echo $pulmonologist;?>" />

Can you tell me how to do this? Thanks!

Hey all, I'm using a fairly simple accordion script. When I went to take a gander at the page in IE I found that the onclick function of the script doesn't respond. It works in FF, Safari, Chrome and Compatibility Mode in IE 8

the error message IE gives me is
Quote:
Message: 'h' is null or not an object
Line: 13
Char: 77
Code: 0
URI: http://proposalfor.us/js/script.js
The problem line (as far as I can tell) is:
Code:

this.a[s]={}; this.a[s].h=h=T$$(e,v)[0]; this.a[s].c=c=T$$('div',v)[0]; h.onclick=new Function(this.n+'.pr(0,'+s+')');

Any help would be greatly appreciated!

Thanks friends!

I have a html page with a lot of thumbnails. The idea is that when the user clicks on an image the onClick event is to display another detailed form and deliver to that form the name of the image in a variable. In the detailed php-form there is a query to MySQL to retrieve a record. The record will be retrieved by a Query based on the name of the picture.
Apparently the PHP cannot do the job. I had an idea to make the thumbnail page as a form and to use use a hidden field with the thummnail name which should be carried on with the $_POST array through the submit button but i do not want to have a submit button. The more elegant way is just by clicking the picture the detailed page is opened and the variable is transferred
where my php code can make use of the variable for the query.
I have never used java before so you have to excuse for the lack of knowledge.
Can anyone gie me an idea how i should implemnt this
Best regards
MSP

I have a html page with a lot of thumbnails. The idea is that when the user clicks on an image the onClick event is to display another detailed form and deliver to that form the name of the image in a variable. In the detailed php-form there is a query to MySQL to retrieve a record. The record will be retrieved by a Query based on the name of the picture.
Apparently the PHP cannot do the job. I had an idea to make the thumbnail page as a form and to use use a hidden field with the thummnail name which should be carried on with the $_POST array through the submit button but i do not want to have a submit button. The more elegant way is just by clicking the picture the detailed page is opened and the variable is transferred
where my php code can make use of the variable for the query.
I have never used java before so you have to excuse for the lack of knowledge.
Can anyone gie me an idea how i should implemnt this
Best regards
MSP

window.onload = initAll;

function initAll() {
document.getElementById("Message").onfocus = focusHandler;
document.getElementById("Message").onblur = blurHandler;

}

function focusHandler() {
document.getElementById("helpYou").innerHTML = "<span class=\"helpMessage\">Hey " + theName + "You should add Lasting Flash to your Facebook!</span>"
}

function blurHandler() {
var helpMessage = document.getElementById("helpYou").innerHTML = "";
}

function nameHandler(frm) {
var theName = frm.firstName.value;
}

Quote:
When I insert theName variable within the span the code completely does not work. I am accessing a text field when the user enters his name and then a small pop up later that includes the users name when another field is clicked on.

I need someone who can help me create javascript code which will create a hyperlink string with a changing variable:

This script should write and execute a hyperlink string which opens a separate pop-up window, nothing more. No image files, no subfolders, forget all that stuff. JUST A HYPERLINK.

The hyperlink SYNTAX does all the work in loading and selecting the images, NOT THE SCRIPT. There is only one changing variable, the value following clipart_id= Here is the basic hyperlink syntax:

<a href="http://www.websitename.com/clipart/manipulate? clipart_id= 00000 &path=%2Fclipart%2Feps%2F&lockRatio=true&width=500&height=500"></a>

THERE ARE ALWAYS 2 WINDOWS: ONE WINDOW HOLDS THE HTML; THE OTHER IS A POP-UP WINDOW (The opened hyperlink)

The basic html page will contain only 2 objects, an input box and a NEXT BUTTON.

Step 1: Initialize the variable from an input box, this variable is used to set the value following clipart_id= which is part of the hyperlink syntax

Step 2: The user inputs the initial variable which is used to write the first hyperlink string; click NEXT to launch the first pop-up window

Step 3: For each subsequent action Click NEXT - OnClick - This ADDS +1 to the initial variable, this variable is passed to be inserted in a new hyperlink string AND then launches a NEW hyperlink to open a NEW popup window. This is an infinite type of action which advances the value of clipart_id= every time the NEXT button is clicked.

Each time you click the NEXT button it advances a counter which executes a NEW hyperlink in a NEW popup window. The only thing that ever changes is the variable after clipart_id=, BUT the entire url syntax of the hyperlink string must be maintained exactly as shown below. If you change the syntax it will not work.

So, if the first value to start with is lets say 13000 ; this is input in a box; then the first hyperlink string will automatically be written and open using this:

<a href="http://www.websitename.com/clipart/manipulate?clipart_id= 13000 &path=%2Fclipart%2Feps%2F&lockRatio=true&width=500&height=500"></a>

Click the NEXT BUTTON and now a new hyperlink window will open which reads like this:

<a href="http://www.websitename.com/clipart/manipulate?clipart_id= 13001 &path=%2Fclipart%2Feps%2F&lockRatio=true&width=500&height=500"></a>

click the NEXT BUTTON and now a new hyperlink hyperlink window will open reads like this:

<a href="http://www.websitename.com/clipart/manipulate?clipart_id= 13002 &path=%2Fclipart%2Feps%2F&lockRatio=true&width=500&height=500"></a>

And so on and so on... Nothing else changes. So the "nextpath" after a CLICK is a complete new hyperlink string which contains a vew variable for the value following clipart_id=

All I am trying to do is execute a standardized hyperlink string with one changing variable.

CAN ANYONE HELP ME TO WRITE THIS CODE?

I am trying to create three buttons that will scale the page up, down, or reset to a default value. I would like to base that incrementing on a global variable declared in javascript:

Code:

var canvasWidth = 600;

Desired incrementing would be in sets of 200, so that when the user clicks zoom in once, the value is 800 and the page is redrawn, twice to 1000, and so on.

All of the visual elements of the page are created in javascript and are sized based on this variable. Very little is done on the HTML page visually, except for a little display organization, so if possible I'd like to be able to complete this task mainly in the javascript file.

Does this make sense?

I'm currently working on a project and I am doing a bunch of image switching.

I'm having a problem with the following...

I have seven medium image objects and one small one. One is at the top and the other 7 are below. When one of the 7 is clicked, it then becomes the one up top and the one up top then takes the place of the image clicked. This needs to be able to happen no matter which of the seven i click.

Also when you click one of the seven it runs a script to change 9 other images in the center of the page. this isnt too important because i have it working already.

What i have is, each of the seven images run their function that changes the 9 center images and then it runs another function.

What i need is for that function to determine which company for example(shaws, lowes, target) the top image belongs to and replace the image that was clicked with the top one. But i also need to replace the NAME="" and ONCLICK="function()" with the proper ones for the original company up top.

Please if you can understand what im trying to do let me know, if you need further clarification i can do so. i can draw a picture of what im trying to do or the layout if needed but i cant necessarily show anyone the project due to a non-disclosure.

Is it possible disable an onclick after clicking it and then enable it from another onclick by id

Code:

<img id="one" href="images/homepage/sliders/bonus_button.jpg" style="position:relative; top:30px; left:50px; height:30px; width:70px; float:left;">

This code runs when it is clicked:

Code:

$("#one").click(function() {
			
				runEffectB();
			
			
			
			return false;
		});

What I would like to happen is for either runEffectB() to not run if it was just run or to disable the #one.click once it has run.
I am assuming I will be able to re-enable it from another onclick running a similar function.
This is jquery and jquery ui if that helps.
Any ideas much appreciated.