Help with connecting input tag to javascript function

JavaScript
1

I’m trying to connect an input tag, type image to an ajax function that will run a php script. I’ve been having trouble getting anything to happen when I click the image button, so I have tripped everything out, but the alert.

Can someone take a look and let me know what I’m doing wrong? Following the current page code I’m including the whole ajax function to show what i’m trying to get to.


<!DOCTYPE html>
<html>

<head>
	<title> Auditions</title>
	<script src="js/jquery-1.7.min.js" type="text/javascript"></script>
<script>
		
$(document).ready(function() {

	$('.audition_btn').click(function() {
		alert($(this).attr("name")); // will give you the name of the clicked element

	}

}); // end ready

</script>

</head>
<body>



<div id='auditionForRole'>
	
<div id='open_roles'>
		<!-- role 1 -->
	<div class='role_box'>
		
		<img src='img/users/missing_225x300.png'>
			
		<div class='role_info'>
			<h3>Actress</h3>
			<h4>Mossad officer Ziva David</h4>
			<h4>A native of Israel, Ziva...</h4>
		</div> <!-- close role info -->
		<input type='image' class='audition_btn' name='audition_btn'  id='audition_btn' 
					src='img/audition_btns/audition_btn.png'>

	</div> <!-- close role1 -->
		
		<!-- role 2 -->
	<div class='role_box'>
		
		<img src='img/users/missing_225x300.png'>
			
		<div class='role_info'>
			<h3>Actress</h3>
			<h4>Mossad officer Ziva David</h4>
			<h4>A native of Israel, Ziva...</h4>
		</div> <!-- close role info -->
		<input type='image' class='audition_btn' src='img/audition_btns/audition_btn.png' name='audition_btn2'  id='			audition_btn2' >

	</div> <!-- close role2 -->

		<!-- role 3 -->
	<div class='role_box'>
		
		<img src='img/users/missing_225x300.png'>
			
		<div class='role_info'>


			<h3>Actress</h3>
			<h4>Mossad officer Ziva David</h4>
			<h4>A native of Israel, Ziva...</h4>
		</div> <!-- close role info -->
		<input type='image' class='audition_btn' src='img/audition_btns/audition_btn.png' name='audition_btn3'  id='			audition_btn3' >

	</div> <!-- close role3 -->
	
</div> <!-- close open roles -->
</div> <!-- close auditionForRole -->
</body>

I’m trying to get this function(located in the head section) to run a php script when one of the buttons (input type=‘image’) are clicked. The buttons are generated with php so it will need to figure out which button has been clicked.


<script>
		
		$(document).ready(function() {
			
			$('.audition_btn').click(function() {
				var buttonNumber = $(this).attr("name"); 

				$.ajax({
				    type: "POST",
		    		    url: "process.php?proj_id="+<?php echo $proj_id ?>,
		    		    data: buttonNumber,
				    
                                    success: function(){
				    	alert('You have auditioned for this project');
				    } // end of success function
                                  }); // end of ajax
			
			}); // end audition_btn.click
		}); // end document).ready
</script>
2

I actually got the button to start working with code below. Now i’m trying to figure out how to return data back to the success function inside of the ajax call.


$(document).ready(function() {

	$('.audition_btn').click(function() {
		var buttonNumber = $(this).attr("name"); // to figure out which button was clicked		
		alert(buttonNumber); // just for testing
		$.ajax({
		    type: "POST",
    		url: "scripts/process_audition.php?proj_id="+<?php echo $requested_proj_id ?>,
    		data: buttonNumber,
		    success: function(){
		    	alert('You have auditioned for this project');
		    }
		}); // end of ajax

	}); // end click

}); // end ready

for some reason the query is not running. It works if I drop the same query into mysql workbench.
How do I sent back an error message that will display inside of the alert box.
php


<?php
require_once 'scripts/app_config.php';
require_once 'scripts/database_connection.php';
require_once 'inc/db.php';

$proj_id = $_REQUEST['proj_id'];
$user_id = 1; // hardcode user_id for now
$audition_id = $_POST['buttonNumber']

$query = 'update jobs set job_user_id = 1 where job_id= 1';
$result = mysql_query($query);
if (!$result)
{
	die(mysql_error());
}