Add Values to my sql database

[bravo14]

Hi

 

I am brand new to Ajax and have got so far with a script that will indicate damage on a vehicle in a facebook style image tagging, the only bit I am unsure of is how to add the values to a database.

 

<script language="javascript">
		$(document).ready(function(){
			$("#img1").tag({
				save: function(width,height,top_pos,left,label,the_tag){
					alert('I can save this tag ('+width+','+height+','+top_pos+','+left+','+label+')');
					/* once the ajax is done I need to get the ID here and then set it on the tag */
					the_tag.setId('someIdFromMyDb');
				},
				remove: function(id){
					alert('Here I can do some ajax to delete tag #'+id+' in my db');
				}
			});
		});

	</script>

 

I just need to know how to put a mysql query into this code.

 

Thanks in advance

[monkeytooth]

There is no direct relations with mysql or any database to my knowlege through the use of javascript alone, as that a very large security conflict in my eyes. But seeing as your using what looks like jQuery might I suggest

 

http://api.jquery.com/jQuery.ajax/

http://api.jquery.com/jQuery.post/

http://api.jquery.com/jQuery.get/

http://api.jquery.com/jQuery.getJSON/

 

Most people seem to find the first Link the more popular of the ones to use, me I personally favor post() but to each is own I suppose, and ultimately rides on what your desire is to do with the information your submitting vs what you want to get back as confirmation.

 

With that said, what you have to do with your page is through one of the 4 methods above essentially post data to a specific php script of your choice. All in all the data being passed by one or the other of the above links to php works with php through the _POST or _GET functions so its like posting a form without the form if that makes sense.

 

 

[bravo14]

Thanks for your reply

 

Do you mean so it would look something like this

<div>
<h1>Indicate any Vehicle Damage</h1>
	<img src="images/car-outline.jpg" id="img1" />
	</div>

	<script language="javascript">
		$(document).ready(function(){
			$("#img1").tag({
				save: function(width,height,top_pos,left,label,the_tag){
				type: "POST",
   					url: "add_tag.php",
   					data: "top_pos=top_pos&left=left&label=label",
   					success: function(msg){
     				alert( "Data Saved: " + msg );
					alert('I can save this tag ('+width+','+height+','+top_pos+','+left+','+label+')');
					/* once the ajax is done I need to get the ID here and then set it on the tag */
					the_tag.setId('someIdFromMyDb');
				},
				remove: function(id){
					alert('Here I can do some ajax to delete tag #'+id+' in my db');
				}
			});
		});

	</script>

 

I have tried this and the record is not added, is there something wrong with the javascript?

[monkeytooth]

unfortunately not likely. Your going to have to ultimately customize the event. I am not familiar with the .tag() plugin your using, but its set of functions is specific to itself, adding a post/get to it may not work, so your going to have to add a custom handler to the image or script your working on in general to do the effects of the .tag() plugin as well as add to the db through get/post on top of it.