javascript post onclick от php

Question

У меня есть следующий скрипт, который отображает изображение на основе результатов базы данных. Когда пользователь нажимает на изображение, он меняется на новое изображение. green_star указывает, что в базе данных находятся $user_id и $thedb_id, а grey_star указывает, что они не существуют. То, что я ищу, - способ вставить или удалить из базы данных при щелчке звезды. На PHP я знаю, что я бы просто сделал

INCLUDE 'addTo_watchlist.php?user_id=$user_id&thetvdb_id=$thetvdb_id'; 

но JavaScript не принимает данные публикации в этом формате. Можно ли делать то, что я ищу, и если да, то каков наилучший маршрут?

<script type="text/javascript"> 
    function changeIt(id) 
{ 
    var theImg = document.getElementById(id), 
      x = theImg.src.split("/"), 
      t = x.length-1, 
      y = x[t]; 

    if(y == 'grey_star.gif') 
    { 
     theImg.src='./images/green_star.gif' 
    } 

    if(y == 'green_star.gif') 
    { 
     theImg.src='./images/grey_star.gif' 
    } 
} 
</script> 

<a onclick="changeIt('<?php echo $img_id; ?>')"><img src='<?php echo $image; ?>' name='<?php echo $img_id; ?>' id='<?php echo $img_id; ?>' border='0' width='50%' /></a> 

Answer 1

Я думаю, что ваш вопрос путается в нескольких точках; не в последнюю очередь потому, что вы указываете на данные GET как данные POST (это два разных способа представления данных формы). Однако, я полагаю, вы хотите спросить, как вы можете добавлять или удалять записи базы данных через JavaScript.

Ответ на вопрос: AJAX (Асинхронный JavaScript и XML).

Смотрите здесь:

http://www.ibm.com/developerworks/web/library/wa-aj-ajaxhistory/index.html?ca=dat http://www.w3schools.com/ajax/ajax_intro.asp

В этом контексте вы бы просто сделать простой XMLHttpRequest для того, чтобы вызвать серверный скрипт. Так, например, JavaScript для добавления фильма в список просмотра будет выглядеть так:

var xmlhttp; 
if (window.XMLHttpRequest) { 
    xmlhttp=new XMLHttpRequest(); 
} else { 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
} 

// Define the url and the GET data (don't forget to pass the userID and thetvdb_id variables from PHP to javascript) 
xmlhttp.open("GET", "Path/addTo_watchlist.php?user_id="+userID+"&thetvdb_id="+thetvdb_id, true); 

// Define what happens when the request's readystate changes 
xmlhttp.onreadystatechange = function() { 
    // Define what happens if the script was successful (similar conditions can be added for other readystates and status codes) 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) { 
    // Change was successful 
    theImg.src='../images/green_star.gif' 
    } 
} 

// Send the request 
xmlhttp.send();