Jump to content

Looking for an toggle script


Muiter
 Share

Recommended Posts

I'm looking for an toggle script (ajax/php) so I can change some values in my database.I found this one for an example but that is only for ASP http://www.asp.net/ajax/ajaxcontroltoolkit...ggleButton.aspxDoes anybody know an good script that i can use? Requirements:changing icons when clicking;updates database with yes or no;php;

Edited by Muiter
Link to comment
Share on other sites

  • 2 weeks later...

I have an image. When I click on it there should be an action taken in my database.What I have for now is:

<td onclick="toggleContact('.$row['id'].')"><img title="'.$lang['delete'].'" src="images/icon/delete_sm.png"></td>

var xmlhttp;function toggleContact(str){xmlhttp=GetXmlHttpObject();if (xmlhttp==null)  {  alert ("Browser does not support HTTP Request");  return;  }var url="ajax_toggle_contact.php";url=url+"?q="+str;url=url+"&sid="+Math.random();xmlhttp.onreadystatechange=stateChanged;xmlhttp.open("GET",url,true);xmlhttp.send(null);}function stateChanged(){if (xmlhttp.readyState==4){document.getElementById("txtHint").innerHTML=xmlhttp.responseText;}}function GetXmlHttpObject(){if (window.XMLHttpRequest)  {  // code for IE7+, Firefox, Chrome, Opera, Safari  return new XMLHttpRequest();  }if (window.ActiveXObject)  {  // code for IE6, IE5  return new ActiveXObject("Microsoft.XMLHTTP");  }return null;}

<?php$q=$_GET["q"];require('../config.php');require('language.php');$sql="UPDATE contactpersoon SET actief = 'nee' WHERE id = '".$q."' ";// resultaat van queryif(!$res = mysql_query($sql,$con)){	trigger_error(mysql_error().'<br />In query: '.$sql);}?>

Link to comment
Share on other sites

so what's happening currently? Are you getting any errors? my first concern is how that HTML <td> is being generated. Shouldn't you be echoing out the PHP variables? Or is that part of an echo statement? In the source, it should just be a number, letter etc, to be passed to the toggle function.

Edited by thescientist
Link to comment
Share on other sites

you first need to give the cell a id reference so we can target it to return changed value and icon.

echo '<tr><td id="row'.$row['id'].'"><img title="'.$lang['delete'].'" src="images/icon/delete_sm.png"></td></tr>'."\n";

second, because, you need to pass the cell id to function stateChanged(), you have to make is global

var xmlhttp;var hold_rowid="";function toggleContact(str){hold_rowid=str;xmlhttp=GetXmlHttpObject();if (xmlhttp==null)  {  alert ("Browser does not support HTTP Request");  return;  }var url="ajax_toggle_contact.php";url=url+"?q="+str;url=url+"&sid="+Math.random();xmlhttp.onreadystatechange=stateChanged;xmlhttp.open("GET",url,true);xmlhttp.send(null);}function stateChanged(){if (xmlhttp.readyState==4){document.getElementById("row"+hold_rowid).innerHTML=xmlhttp.responseText;  //this now identifies which cell to target and change.}}function GetXmlHttpObject(){if (window.XMLHttpRequest)  {  // code for IE7+, Firefox, Chrome, Opera, Safari  return new XMLHttpRequest();  }if (window.ActiveXObject)  {  // code for IE6, IE5  return new ActiveXObject("Microsoft.XMLHTTP");  }return null;}

now to update database and cell icon

<?php require('../config.php');require('language.php');mysql_select_db($database, $con);$id=$_GET["q"];	$sql = "SELECT actief FROM contactpersoon WHERE id=$id";	$query = mysql_query($sql, $con) or die(mysql_error());//deterime if value is already yes or no		while($myrow = mysql_fetch_assoc($query))		{		if($myrow['actief'] =='no')			{			$changeToAlt='yes';			}		else			{			$changeToAlt='no';			}		}		$sql="UPDATE contactpersoon SET actief=$changeToAlt WHERE id=$id"; 	$query = mysql_query($sql, $con) or die(mysql_error());//toggle table row icon to alternativeif($changeToAlt=='yes')	{echo '<img title="'.$lang['delete'].'" src="images/icon/delete_sm.png">'."\n";	}else	{echo '<img title="'.$lang['otherlang'].'" src="images/icon/otherimage.png">'."\n";}	?>

this may need adjusting to suit your needs, ut it should bring you closer to what you trying to achieve.

Edited by dsonesuk
Link to comment
Share on other sites

I would not use the onclick event on the td cell but use a anchor link instead, when onclick is used on td, it is very erratic, and does not always change instantly, try

echo '<td id="row'.$row['id'].'"><a href="java script:void(null)" onclick="toggleContact('.$row['id'].')"><img title="'.$lang['delete'].'" src="images/icon/delete_sm.png"></a></td>';

this means you have to include this anchor in the response, unless you add id to the anchor itself, that should work, your choice.

if($changeToAlt=='yes')	{echo '<a href="java script:void(null)" onclick="toggleContact('.$row['id'].')"><img title="'.$lang['delete'].'" src="images/icon/delete_sm.png"</a>>'."\n";	}else	{echo '<a href="java script:void(null)" onclick="toggleContact('.$row['id'].')"><img title="'.$lang['otherlang'].'" src="images/icon/otherimage.png"></a>'."\n";}

Note: posting here adds a space between javascript

Edited by dsonesuk
Link to comment
Share on other sites

It's working but now it's messing op an other Ajax script. This script is used to open an new div when clicking on it, and close when clicking it again.Now it's also closed when I use the toggle script.Any new ideas? You made my day so far :)

function showDetails(str){if(document.getElementById("details"+str).innerHTML=="") //if empty proceed to show details{xmlhttp=GetXmlHttpObject();if (xmlhttp==null){alert ("Browser does not support HTTP Request");return;}var url="includes/js/ajax_details_adres.php";url=url+"?q="+str;url=url+"&sid="+Math.random();xmlhttp.onreadystatechange=stateChanged;xmlhttp.open("GET",url,true);xmlhttp.send(null);divnumber=str;}else{document.getElementById("details"+str).innerHTML=""; //if NOT empty, clear the details from div}}function stateChanged(){if (xmlhttp.readyState==4){document.getElementById("details"+divnumber).innerHTML=xmlhttp.responseText;}}function GetXmlHttpObject(){if (window.XMLHttpRequest)  {  // code for IE7+, Firefox, Chrome, Opera, Safari  return new XMLHttpRequest();  }if (window.ActiveXObject)  {  // code for IE6, IE5  return new ActiveXObject("Microsoft.XMLHTTP");  }return null;}

Link to comment
Share on other sites

this toggle row script wouldn't happen to be inside, one of these toggle div element? clicking the table row, may also cause the div function to run also, and since they use the same query string variable 'q' there maybe a conflict try change the 'q' querystring to a different one, but remember to change the value in the php $_GET['q'] reference as well.

Link to comment
Share on other sites

Back yo this problem. I have setting-up an new code that is not in an some Ajax script.

					while ($row = mysql_fetch_array($res))					{						echo '<tr onMouseOver="addHighlight(this);" onMouseOut="removeHighlight(this);">								  <td onclick="setHighlighted(this),showDetails('.$row['id'].');"></td>									<td onclick="setHighlighted(this),showDetails('.$row['id'].');">'.$row['bestelno'].'</td>									<td onclick="setHighlighted(this),showDetails('.$row['id'].');">'.$row['omschrijving'].'</td>';									if(empty($row['aantal_huidig']))									{									  echo '<td width=25 onclick="setHighlighted(this),showDetails('.$row['id'].');"></td>											  <td width=25 onclick="setHighlighted(this),showDetails('.$row['id'].');"></td>';									}									else									{									  echo '<td width=25 onclick="toggleSlijtd('.$row['id'].')"><img title="'.htmlentities($lang['slijtdeel_minus']).'" src="images/icon/arrow_minus.png" /></td>											  <td width=25 align="right" onclick="setHighlighted(this),showDetails('.$row['id'].');">'.$row['aantal_huidig'].'</td>';									}									echo '<td width=50 onclick="setHighlighted(this),showDetails('.$row['id'].');"></td>';									if(empty($row['in_bestelling']))									{									  echo '<td width=65 onclick="setHighlighted(this),showDetails('.$row['id'].');"></td>';									}									else									{									  echo '<td width=65 align="right" onclick="setHighlighted(this),showDetails('.$row['id'].');">'.$row['in_bestelling'].'</td>';									}									echo '<td width=35 onclick="setHighlighted(this),showDetails('.$row['id'].');"></td>';									if($row['prijs'] == 0.00)									{									  echo '<td width=75 onclick="setHighlighted(this),showDetails('.$row['id'].');"></td>';									}									else									{									  echo '<td width=75 align="right">€ '.$row['prijs'].'</td>';									}									echo '<td width=50 onclick="setHighlighted(this),showDetails('.$row['id'].');"></td>									<td onclick="setHighlighted(this),showDetails('.$row['id'].');">'.$row['catagorie'].'</td>									<td onclick="setHighlighted(this),showDetails('.$row['id'].');">'.htmlentities($row['leverancier']).'</td>								  <td onclick="setHighlighted(this),showDetails('.$row['id'].');"></td>							  </tr>							  <tr>								  <td colspan="13"> <div id="details'.$row['id'].'"></div> </td>							  </tr>';					}

My first problem is where the new arrow and number is shown.wR1SA.gif

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...