New Topic/Question
Reply
- On index.php load, it reads all the slider values from the database and automatically generates and sets each slider to that value
- On setting each individual slider to a new value by adjusting the slider, the code automatically updates the slider value in the database via AJAX.
So far I have gotten both functionalities to work successfully. There is just one problem with the 2nd functionality. I can only get one slider value to save to the database at a time.
I know how to fix the problem, I just do not know to achieve it.
I shall now illustrate via snippets of code:
This is the slider code:
<DIV class=carpe_slider_group>
<DIV class=carpe_horizontal_slider_display_combo>
<DIV class=carpe_slider_display_holder>
<!-- Default value: 0 -->
<input name="Input" class=carpe_slider_display id="display1" value="<?=$row['slider_val']?>" />
</DIV>
<DIV class=carpe_horizontal_slider_track>
<DIV class=carpe_slider_slit></DIV>
<DIV class=carpe_slider id=1 display="display1" style="left:<?=$row['slider_val']?>px"></DIV>
</DIV>
</DIV>
<DIV class=carpe_horizontal_slider_display_combo></DIV>
<DIV class=carpe_horizontal_slider_display_combo></DIV>
<DIV class=carpe_horizontal_slider_display_combo></DIV>
</DIV>
This is actually placed between a php for loop so that according to the number of entries, say x entries in the database, it prints this code x times to get x sliders.
This is the php code on a separate php webpage that AJAX uses to update one slider table entry got for one given slider:
<?
$sliderval=$_GET['sliderval']; //get the value from ajax function
$link = mysql_connect('localhost', 'root', ''); //changet the configuration in required
if (!$link) {
die('Could not connect: ' . mysql_error());
}
mysql_select_db('my_db'); //change the name of the database if required
$query="UPDATE tbl_slider SET slider_val='$sliderval' WHERE id='1'";
$result=mysql_query($query);
?>
In the above code, there the second to last line reads "UPDATE tbl_slider SET slider_val='$sliderval' WHERE id='1'".
This '1' would be used to identify the entry into the database where the silder value for that slider is updated.
We can also see from the slider code that the id of the slider is , that is id=1 (line09). I can make it so that for each iteration of the for statement execution, the id can be changed to 2,3 etc.
I want to be able to pass this dynamic id value to my javascript function that uses AJAX to call the php page that updates the database (code above). I can then use this information to update database entry 2, 3 etc, for that slider(2,3,etc).How can I do this? Can I possibly use DOM to access the this dynamic value of id? If this is so, how can I do so? If this can be done, I can just append this value to the querystring (code below) and get it into the $_GET array.
The Javascript code has posted below if it is of any help. Many Thanks in advance
<script language="javascript" type="text/javascript">
function setSliderVal(value)
{
xmlHttp=getXMLHTTP();
if (xmlHttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
xmlHttp.onreadystatechange=function()
{
if (req.readyState == 4) { // only if "OK"
if (req.status == 200) {
//dont do any thing here we just need to save the valued in the database
} else {
alert("There was a problem while using XMLHTTP:\n" + req.statusText);
}
}
}
var queryString = "?sliderval=" + value.substring(0,value.length-2); //stripping last two letter which is px
xmlHttp.open("GET","AJAX4Slider.php"+queryString,true);
xmlHttp.send(null);
}
function getXMLHTTP() { //fuction to return the xml http object
var xmlhttp=false;
try{
xmlhttp=new XMLHttpRequest();
}
catch(e) {
try{
xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e){
try{
req = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e1){
xmlhttp=false;
}
}
}
return xmlhttp;
}
</script>
MultiQuote
| 