I have next scripts:
test.php - in header I have:
<script>
function dest(str2) {
if (str2 == "") {
return;
} else {
//alert(str2);
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("destin").innerHTML = xmlhttp.responseText;
alert(xmlhttp.responseText);
}
}
xmlhttp.open("GET","dest.php?q2="+str2,true);
xmlhttp.send();
}
}
</script>
test.php - in body I have:
<div class="col-sm-12">
<div class="form-group has-icon has-label selectpicker-wrapper">
<label>De la</label>
<?php
$plecari=db_query("SELECT DISTINCT plecare from `pl_dest_pf` WHERE activ = 'activ' ORDER BY plecare");
?>
<select class="selectpicker input-price" data-live-search="true" data-width="100%" data-toggle="tooltip" title="Select" name="plecare" id="dela" onchange="dest(this.value)">
<?php
while($rez_plecari = $plecari->fetch_assoc()){
?>
<option value="<?php echo $rez_plecari['plecare']?>"><?php echo $rez_plecari['plecare']?></option>
<?php } ?>
</select>
<span class="form-control-icon"><i class="fa fa-location-arrow"></i></span>
</div>
</div>
<div class="col-sm-12">
<div class="form-group has-icon has-label selectpicker-wrapper">
<label>Pana la </label>
<select id="destin" class="selectpicker input-price" data-live-search="true" data-width="100%" data-toggle="tooltip" title="Select" name="desti">
</select>
<span class="form-control-icon"><i class="fa fa-location-arrow"></i></span>
</div>
</div>
dest.php:
<?php
session_start();
include('include/functions2.php');
$a=$_GET['q2'];
$destinatie=db_query("SELECT DISTINCT destinatie from `pl_dest_pf` WHERE plecare ='".$a."' AND activ = 'activ' ORDER BY destinatie ");
?>
<option value="">Selecteaza...</option>
<?php
while($rez_destinatie = $destinatie->fetch_assoc()){
?>
<option value="<?php echo $rez_destinatie['destinatie']?>"><?php echo $rez_destinatie['destinatie']?></option>
<?php } ?>
My issue is that the values for 2nd select are returned, but not showed on 2nd select (I can see it only with alert command).
May you please tell me where I have the mistake.
Many thanks!
Related
i am in dire need here. i have gone to every person i know that knows php/mysql/ajax, but no one can help.
i am trying to get an input field populated with data from my dbase that is chosen from two different selects. here is the situation:
building a golf scoring page on my website. the user will choose a course (select #1), then the tee they played (select #2), which then the disabled text inputs will populate with the rating and slope. the rating and slope are very important b/c they help figure out the handicap for the user. i am able to get everything to populate fine, but i can't figure out the correct WHERE clause in my query on the get_rating.php page. can somebody help me with that query?
here is my code:
dbase setup:
this is pulling from 2 tables, one is the courses table (course_id, c_id, name) and the other is the course_tees table (tee_id, course_name, c_id, t_id, color, rating, slope). the c_id's on both tables are the same.
<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="post" class='new_score'>
<div class='form-group'>
<select class="form-control" name="course_name" onchange="get_tees(this.value)">
<option value="">select a tee</option>
<?php get_courses() ?>
</select>
</div>
<div class='form-group'>
<select class='form-control' name='tee_played' onchange="get_rating(this.value)" id='txtHint'>
<option value="">select a tee</option>
</select>
</div>
<div class="form-group" id="getRating">
</div>
the first select uses the get_tees.php code (listed below) and the second one uses the get_rating.php code (listed 2 below) which is the one i'm having trouble with.
get_tees.php
$con = mysqli_connect("***","***","***","***") or die("connection was not established");
$q = intval($_GET['q']);
mysqli_select_db($con,"course_tess");
$sql="SELECT * FROM course_tees WHERE c_id = '".$q."'";
$result = mysqli_query($con,$sql);
while($row=mysqli_fetch_array($result)) {
$tee_id = $row['tee_id'];
$c_id = $row['c_id'];
$t_id = $row['t_id'];
$tee_color = $row['color'];
$cor_rating = $row['rating'];
$cor_slope = $row['slope']; ?>
<option value='<?php echo $tee_id ?>'><?php echo $tee_color ?></option>
get_rating.php
$con = mysqli_connect("***","***","***","***") or die("connection was not established");
$q = intval($_GET['q']);
mysqli_select_db($con,"course_tees");
$sql="SELECT * FROM course_tees";
$result = mysqli_query($con,$sql);
while($row=mysqli_fetch_array($result)) {
$c_id = $row['c_id'];
$t_id = $row['t_id'];
$cor_rating = $row['rating'];
$cor_slope = $row['slope']; ?>
<input type='text' name='cor_rating' class='form-control' value='<?php echo $row['rating']; ?>' disabled>
<input type='text' name='cor_slope' class='form-control' value='<?php echo $row['slope']; ?>' disabled>
and here's my ajax for both selects:
function get_tees(str) {
if (str == "") {
document.getElementById("txtHint").innerHTML = "";
return;
} else {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","get_tees.php?q="+str,true);
xmlhttp.send();
}
}
function get_rating(str) {
if (str == "") {
document.getElementById("getRating").innerHTML = "";
return;
} else {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("getRating").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","get_rating.php?q="+str,true);
xmlhttp.send();
}
}
am i not passing something correctly in my ajax? what am i doing wrong?!?! PLEASE help!!
#chris85 this is essentially the bandaid that i have put over the issue for right now ... instead of trying to populate the text fields automatically, i am listing them in the selects and manually putting in the rating/slope ... this is my code:
php:
mysqli_select_db($con,"course_tess");
$sql="SELECT * FROM course_tees WHERE c_id = '".$q."'";
$result = mysqli_query($con,$sql);
echo "<option value=''>select a tee</option>";
while($row=mysqli_fetch_array($result)) {
$tee_id = $row['tee_id'];
$c_id = $row['c_id'];
$t_id = $row['t_id'];
$tee_color = $row['color'];
$cor_rating = $row['rating'];
$cor_slope = $row['slope']; ?>
<option value='<?php echo $tee_color ?>'><?php echo $tee_color ?> - <?php echo $cor_rating ?> : <?php echo $cor_slope ?></option>
and the form:
<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="post" class='new_score'>
<div class='form-group'>
<select class="form-control" name="course_name" onchange="get_tees(this.value)">
<option value="">select a tee</option>
<?php get_courses() ?>
</select>
</div>
<div class='form-group'>
<select class='form-control' name='tee_played' onchange="get_rating(this.value)" id='txtHint'>
</select>
</div>
<div class="form-group">
<input type="text" class="form-control" name="cor_rating" placeholder="enter rating from above">
<input type="text" class="form-control" name="cor_slope" placeholder="enter slope from above">
</div>
so, like you can see, it's just a bandaid. if you want to see it working, go to the http://www.havikmarketing.com and sign in with these credentials:
EM: test#test.com
PW: testing123
then go up to the settings (gears) and choose 'new round'. go through and enter a score ... you'll see how it pulls everything through. now mind you, i just have it set up as pretty much a skeleton right now ... so no judging on the design :)
thanks again
I am working on a project at the moment. In iI am using ajax to update and calculate scores, which works fine. However, I have a color scheme that changes according to the score. The color does change, but only after the page is refreshed. Is there anyway I can get the color to change with refreshing the page?
Here is the code that I am using to assign colors:
<?php $row_class = "";
while($row = mysql_fetch_assoc($dbResult1))
{
if($row['total_mai'] <= 2)
$row_class = "success";
else if($row['total_mai'] >= 5)
$row_class = "danger";
else if($row['total_mai'] >= 3 and $row['total_mai'] < 5)
$row_class = "warning";
// echo $row_class;
?>
In another page, here is an example of one question, it has three answers and depending on the answer a color is assigned based on the score
<tr>
<td class="form-group col-md-6">Is the duration of therapy acceptable?</td>
<td class="form-group col-md-6">
<p class="radio-inline">
<input type="radio" name="therapydur" id="j1" value="0" <?php echo $j1; ?> required onchange="ajaxFunction('therapydur','<?php echo $count; ?>','0','<?php echo $row['p_id']; ?>')">
A
</input></p>
<p class="radio-inline">
<input type="radio" name="therapydur" id="j2" value="0" <?php echo $j2; ?> required onchange="ajaxFunction('therapydur','<?php echo $count; ?>','0','<?php echo $row['p_id']; ?>')">
B
</input></p>
<p class="radio-inline">
<input type="radio" name="therapydur" id="j3" value="1" <?php echo $j3; ?> required onchange="ajaxFunction('therapydur','<?php echo $count; ?>','1','<?php echo $row['p_id']; ?>')">
C
</input></p>
</td>
</tr>
Here is the ajax from the same page:
<script language="javascript" type="text/javascript">
function ajaxFunction(title,id,val,p_id)
{
//alert("test");
//alert(id);
//alert(val);
//alert(title);
//alert(p_id);
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
//alert(xmlhttp.responseText);
var resp = xmlhttp.responseText;
var split_v = resp.split("__");
//alert(split_v.length);
//alert(split_v[1]);
document.getElementById("ajaxDiv_"+id).innerHTML=split_v[0];
document.getElementById("ajaxTotal").innerHTML=split_v[1];
}
}
xmlhttp.open("GET","ajax_mai.php?pdr_id="+id+"&value="+val+"&title="+title+"&p_id="+p_id,true);
xmlhttp.send();
return true;
}
</script>
I am trying to use an ajax function when the form's select value has changed. It should display a list of cities based on the selected state. However, it is not doing anything.
cities.php
<script type="text/javascript">
function change_state(str)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("cityselector").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","changestate.php?changed_state="+str,true);
xmlhttp.send();
}
</script>
<div class="city-switcher">
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="get" id="cityselector" style="position: absolute; top: 15px; left: 310px;">
<select name="city" onchange="document.forms['cityselector'].submit()" style="font-size: 1.5em;">
<?php
$selected_state = select_single("STATE", "locations", "NAME='$location'", "");
$cities = select("*", "locations", "STATE='$selected_state'", "");
foreach ($cities as $city){
echo '<option value="'.$city['NAME'].'" '.($location == $city['NAME'] ? 'selected="selected"' : '').'>'.$city['NAME'].'</option>';
}
?>
</select>
</form>
<select name="state" onchange="change_state(this.value)" style="font-size: 1.5em;">
<?php
$states = select("DISTINCT STATE", "locations", "", "ORDER BY STATE ASC");
$selected_state = select_single("STATE", "locations", "NAME='$location'", "");
foreach ($states as $state){
echo '<option value="'.$state['STATE'].'" '.($selected_state == $state['STATE'] ? 'selected="selected"' : '').'>'.$state['STATE'].'</option>';
}
?>
</select>
</div>
changestate.php
<?php
include '../config.php';
include '../library.php';
$changed_state = $_GET['changed_state'];
echo '<select name="city" onchange="document.forms[\'cityselector\'].submit()" style="font-size: 1.5em;">';
$cities = select("*", "locations", "STATE='$changed_state'", "");
foreach ($cities as $city){
echo '<option value="'.$city['NAME'].'" '.($location == $city['NAME'] ? 'selected="selected"' : '').'>'.$city['NAME'].'</option>';
}
echo '</select>';
?>
Can anyone tell me what I'm doing wrong.
Thanks,
After Rereading i am modifying my answer
<select name="state" onchange="change_state(this.value)"
should be
<select ... onchange="change_state(this.options[this.selectedIndex].value)" ...
Figured out the problem. The problem was that my path was wrong for xmlhttp.open("GET","changestate.php?changed_state="+str,true);
Instead it should be
xmlhttp.open("GET","sections/changestate.php?changed_state="+str,true);
At the moment, I'm in the process of creating a website, where I have some products which have a quantity. This quantity depends on a size and color.
So I came up with the following procedure to check and give feedback about how many there are still left.
<div class="product_stock" id="stock_form<?php echo $i; ?>"><?php
$size = $product_sizes[0];
$color = $product_colors[0];
$sql = "SELECT * FROM products WHERE product_id = '$product_id' AND size = '$size' AND color = '$color'";
$result = mysql_query($sql) or die(mysql_error());
echo $sql;
if(mysql_num_rows($result) > 0) {
$product_stock = mysql_fetch_array($result);
if($product_stock['stock'] > 0) {
echo "Nog ".$product_stock['stock']." verkrijgbaar";
} else {
echo "Combinatie is niet meer verkrijgbaar";
}
}?>
</div>
<div class="product_text">
<?php echo $product['text']; ?>
</div>
<div class="product_num">
art: #<?php echo $product['product_id']; ?>
</div>
<div class="product_bar_bot">
<form name="form<?php echo $i; ?>" action="shopping_cart.php?">
<input type="hidden" name="id" value="<?php echo $product['pid']; ?>"/>
<select name="size" class="product_select" onChange="get_stock('form<?php echo $i; ?>');">
<?php foreach($product_sizes as $p_size) { ?>
<option>
<?php echo $p_size; ?>
</option>
<?php } ?>
</select>
<select name="color" class="product_select" onChange="get_stock('form<?php echo $i; ?>');">
<?php foreach($product_colors as $p_color) { ?>
<option value="<?php echo $p_color; ?>">
<?php echo $color_array[$p_color]; ?>
</option>
<?php } ?>
</select>
<input type="hidden" name="url" value="sale">
<input type="hidden" name="action" value="add">
<input type="text" name="amount" value="1" size="1" style="vertical-align: top; margin-top: 9px;"></input>
<img src="images/icons/cart_shop.png" align="top"/>
<input type="submit" class="button" value="Voeg toe" style="vertical-align: top; margin-top: 7px;">
The function that is required to be called:
function get_stock(formid) {
var form = document.forms[formid];
var size = form.size.value;
var color = form.color.value;
var pid = form.id.value;
var stock = 'stock_'+formid;
// code for IE7+, Firefox, Chrome, Opera, Safari
if (window.XMLHttpRequest) {
xmlhttp=new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById(stock).innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","get_stock.php?id="+pid+"&size="+size+"&color="+color,true);
xmlhttp.send();
}
The problem I'm having is that it does work for some of the forms, but for some forms the get_stock.php page isn't even being called.
If more information is needed don't hesitate to ask.
I made a small error that I already fixed, thanks to #Bergi's comment. I was creating the forms by adding +1 at $i each time, but I reseted $i at the wrong place, which resulted in more then one of $i = 1 for example.
<script type="text/javascript" src="jquery-1.js"></script>
<style type="text/css">
div {
height:25px;
}
label {
text-align:left;
width:100px;
display:inline-block;
vertical-align:top;
}
input {
margin-right:5px;
}
</style>
<script type="text/javascript">
//<![CDATA[
$(window).load(function(){
// $('select').toggle();
$('input').click(function(event) {
$(this).closest('div').children('select').toggle();
});
});
//]]>
</script>
<?php
#mysql_select_db('badoo',mysql_connect('localhost', 'root', ''));
$query = "select id,language,code from language WHERE first=1";
$results = mysql_query( $query);
$lang = array();
while ($rows = mysql_fetch_assoc(#$results)){
$lang[$rows['language']] = $rows['code'];
}
?>
<form action="" method="post" name="myForm" id="myForm" >
<?php
foreach($lang as $key=>$value){ ?>
<div>
<label for="lang_<?=$value;?>" >
<input name="language[<?=$value;?>]" id="lang_<?=$value;?>" value="1" type="checkbox">
<?=$key;?>
</label>
<select style="display: none;" name="level[<?=$value;?>]" id="f_level_<?=$value;?>">
<option selected="selected" value="">your level</option>
<option value="Low">Low</option>
<option value="Average">Average</option>
<option value="Fluent">Fluent</option>
<option value="Native">Native</option>
</select>
</div>
<?php } ?>
<input value="submit" name="submit" type="submit">
<!--**********************************************************-->
<br />
<br />
<br />
<script type="text/javascript">
function showCD(str)
{
if (str == "") {
document.getElementById("txtHint").innerHTML = "";
return;
}
if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
// document.getElementById("newone").innerHTML=xmlhttp.responseText;
$('#newone').append(xmlhttp.responseText);
// document.getElementById('newone').appendChild(xmlhttp.responseText);
}
}
xmlhttp.open("GET", "123.php?q=" + str, true);
xmlhttp.send();
}
</script>
<?php
#mysql_select_db('badoo',mysql_connect('localhost', 'root', ''));
$query = "select id,language,code from language WHERE first=0";
$results = mysql_query( $query);
$lang = array();
while ($rows = mysql_fetch_assoc(#$results)){
$lang[$rows['language']] = $rows['code'];
}
?>
<select name="level[]" id="f_level" onchange="showCD(this.value)">
<option selected="selected" value="">language</option>
<?php
$results = mysql_query( $query);
while ($rows = mysql_fetch_assoc(#$results)){
?>
<option value="<?php echo $rows['id'];?>" ><?php echo $rows['language'];?></option>
<?php
}
?>
</select>
<div id="newone"></div>
</form>
---------------
<?php
mysql_select_db('badoo',mysql_connect('localhost', 'root', ''));
if($_REQUEST)
{
$id = $_REQUEST['q'];
$query = "select id,language,code from language where id = ".$id;
$results = mysql_query( $query);
$rows = mysql_fetch_assoc($results );
if($rows!='')
{?>
<div>
<label for="lang_<?=$rows['code'];?>" >
<input name="language[<?=$rows['code'];?>]" id="lang_<?=$rows['code'];?>" value="1" type="checkbox">
<?=$rows['language'];?>
</label>
<select style="display: none;" name="level[<?=$rows['code'];?>]" id="f_level_<?=$rows['code'];?>">
<option selected="selected" value="">your level</option>
<option value="Low">Low</option>
<option value="Average">Average</option>
<option value="Fluent">Fluent</option>
<option value="Native">Native</option>
</select>
</div>
<?php
}
return;
}
?>
Unfortunately I can't yet comment everywhere so apologies for adding an answer when a comment would have sufficed.
2 suggestions for you:
1) You are using jQuery but not making use of its excellent AJAX functions. Take a look at them.
2) You are suppressing PHP warnings and errors that may be helpful to you debugging this yourself. Remove the # from the front of several of these function calls and run it again. Maybe you will see the problem yourself.
The only other thing that jumped out at me while scanning this code (since I have no idea what your problem is) is that the derived responce does not include the 'onchange' event that all of your other selects do. Is it a simple oversight?