I want to pass an array of values from my select into the xmlhttp.open request below so I can parse the variables in the new page. How can this be achieved? I attempted the syntax below, but it throws a 500 error when the button is pressed.
<script type="text/javascript">
function GetData() {
var xmlhttp = new XMLHttpRequest();
var hiredate = document.getElementById("hiredate").value;
var termdate = document.getElementById("termdate").value
var arr = document.getElementById("bq").value;
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == XMLHttpRequest.DONE ) {
if (xmlhttp.status == 200) {
document.getElementById("data").innerHTML = xmlhttp.responseText;
}
else if (xmlhttp.status == 400) {
alert('There was an error 400');
}
else {
alert('something else other than 200 was returned');
}
}
};
xmlhttp.open("GET", "Query.php?hiredate="+hiredate+"&termdate="+termdate+"&array="+arr, true);
xmlhttp.send();
}
</script>
<select name="bq" size="12" multiple="multiple" tabindex="1">
<option value="HireDate">HireDate</option>
<option value="TermDate">TermDate</option>
<option value="Dept">Dept</option>
<option value="Manager">Manager</option></select>
Start Date: <input type="date" name="hiredate" id="hiredate">
End Date: <input type="date" name="termdate" id="termdate">
<input type="submit" value="Submit" id="ajaxButton" onclick="GetData()">
<div id="data">
EDIT
This is my Query.php - I omitted the actual connection to the server as I know that is sound
<?php
$hiredate = $_GET['hiredate'];
$termdate = $_GET['termdate'];
$sql = '';
$selected_fields = array();
foreach ($_GET['array'] as $selectedOption){
$selected_fields[] = $selectedOption;
}
if(!empty($selected_fields)){
$fields = implode(',', $selected_fields);
$sql = 'SELECT '.$fields.' from testtable';
}
$sql = $sql & "WHERE hiredate = $hiredate AND termdate = $termdate";
echo $sql
?>
Related
I am adding the comments input box of every XML-RSS article.
When I select a RSS url, that results are commonly as below
PHP code
for ($i=0; $i<=19; $i++) {
$item_title=$x->item($i)->getElementsByTagName('title')
->item(0)->childNodes->item(0)->nodeValue;
$item_link=$x->item($i)->getElementsByTagName('link')
->item(0)->childNodes->item(0)->nodeValue;
$item_desc=$x->item($i)->getElementsByTagName('description')
->item(0)->childNodes->item(0)->nodeValue;
$item_date=$x->item($i)->getElementsByTagName('pubDate')
->item(0)->childNodes->item(0)->nodeValue;
echo ("<p><a href='" . $item_link
. "' target=\'_blank\'>" . $item_title . "</a>");
echo ("<br>");
echo ($item_desc . "<br>".$item_date."</p>");
$item_link1 = str_replace('http://','',$item_link);
$item_link2 = str_replace('https://','',$item_link1);
$item_link3 = str_replace('/','-',$item_link2);
$item_link4 = str_replace('?','-',$item_link3);
$content = $item_title."--". $item_link."--".$item_desc."--".$item_date;
file_put_contents("./comments/".$item_link4.".txt",$content);
//Next line is something wrong or not??
echo "<option id=".$item_link4." onclick=\"showComment(this.value)\" value=".$item_link4."> Show Comments </option> <div id=\"".$item_link."\"></div>";
Next, I can see the results as a below picture.
And I am coding JS which has the showComment function as below.
function showComment(str) {
if (str.length == 0) {
document.getElementById(""+item_link4+"").innerHTML = "";
return;
} else {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById(""+item_link4+"").innerHTML = this.responseText;
}
};
var q = document.getElementById(""+item_link4+"").value;
xmlhttp.open("GET", "showComment.php?q=" + q, true);
xmlhttp.send();
}
}
And Next, I am coding the showComment.php as below to see the 'q' value.
But,
Notice: Undefined index: q in E:\xampp\htdocs\code\v1\showComment.php on line 5.
The first part is like next.
// line 5 is $q = html...
$q = htmlspecialchars($_GET['q']);
global $result;
echo $q;
Eventually, I got something wrong in JS code which received item_link4
How do I change the JS variable originated from php-HTML code?
Please your Kindness.
I have tried so many times. At last I got the good result for going to the better.
PHP code is
echo " <option id=".$i." onclick=\"showComment".$i."(this.value)\" value=".$item_link4."> Show Comments </option>";
And I changed JS code as below.
<script>
function showComment0(str) {
if (str.length == 0) {
document.getElementById("0").innerHTML = "";
return;
} else {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("0").innerHTML = this.responseText;
}
};
var q = document.getElementById("0").value;
xmlhttp.open("GET", "showComment.php?q=" +q, true);
xmlhttp.send();
}
}
</script>
....
<script>
function showComment22(str) {
if (str.length == 0) {
document.getElementById("22").innerHTML = "";
return;
} else {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("22").innerHTML = this.responseText;
}
};
var q = document.getElementById("22").value;
xmlhttp.open("GET", "showComment.php?q=" +q, true);
xmlhttp.send();
}
}
</script>
<script>
function showComment23(str) {
if (str.length == 0) {
document.getElementById("23").innerHTML = "";
return;
} else {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("23").innerHTML = this.responseText;
}
};
var q = document.getElementById("23").value;
xmlhttp.open("GET", "showComment.php?q=" +q, true);
xmlhttp.send();
}
}
</script>
So I made Id 0 to 18 script. That is, 19 scripts are necessary.
I am waiting for better answer.
Goal: I want to retrieve values from the getFaculties() on the Connection.php snippet and insert them into <select> on my form
Piece of code of my form
<form id="myform" method="GET">
<label>Varsity Name</label><br>
<select name="selVarsityName" id="selVarsityName" onchange="dropUpdate();">
<?php
require 'Connection.php';
$conn->getVarsities();
?>
</select><br>
<label>Faculty Name</label>
<select name="selFaculty" id="selFaculty">
</select><br>
This is the function that does the request...
function dropUpdate() {
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
} else {
xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById('selFaculty').innerHTML = xmlhttp.responseText;
}
};
var ghgh = document.getElementById('selVarsityName').value;
xmlhttp.open('GET', 'Middle.php?selVarsityName=' + ghgh, true);
xmlhttp.send();
}
This is the code on the Middle.php page.
require './Connection.php';
if (isset($_GET['selVarsityName'])) {
$selVarsityName = $_GET['selVarsityName'];
$conn->getFaculties($selVarsityName);
}
Code on my Connection.php page
function getVarsities() {
$query = "SELECT * FROM `tb_university`";
$result = mysqli_query($this - > link, $query);
if ($result) {
echo "<option>Select University</option>";
while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) {
$VarsityName = $row['university_name'];
echo "<option>$VarsityName</option>";
}
} else {
echo "record not found";
}
}
function getFaculties($ff) {
$uni_id = 0;
$query = "SELECT `university_id` FROM `tb_university` WHERE `university_name` = '$ff'";
$result = mysqli_query($this - > link, $query);
if ($result) {
while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) {
$uni_id = $row['university_id'];
}
}
$query1 = "SELECT `faculty_name` FROM `faculty` WHERE `university_id` = $uni_id";
$result1 = mysqli_query($this - > link, $query1);
if ($result1) {
while ($row = mysqli_fetch_array($result1, MYSQLI_ASSOC)) {
$fal_name = $row['faculty_name'];
echo < option > $fal_name < /option>;
}
}
}
here is my code what i done
function price() {
var quantity = document.getElementById("quan").value;
var select = document.getElementById("p_id");
var product_id = select.options[select.selectedIndex].value;
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 (this.readyState == 4 && this.status == 200) {
//alert("working");
document.getElementById("price_ajax").innerHTML = this.responseText;
}
}
xmlhttp.open("GET", "get_product.php?p_id=" + product_id + "&quantity=" + quantity);
xmlhttp.send();
and here is my php code which execute ajax request:
$p_id = intval($_GET['p_id']);
$quantity = intval($_GET['quantity']);
$connection=new Database();
$sth=$connection->DBH->prepare("SELECT `unit_price` FROM `product_lookup` WHERE `id`=?");
$sth->bindParam(1,$p_id);
$sth->setFetchMode(PDO::FETCH_OBJ);
$rs=$sth->execute();
$row =$sth->fetch();
$product_price= intval($row->unit_price);
$total_price=$product_price*$quantity;
?>
<input value="<?php echo $p_id?>">
and here is my html :
<input class="form-control" type="number" name="price[]" id="price_ajax" >
this is where i call javascript function:
<input class="form-control" type="number" name="quantity[]" id="quan" oninput="price()" required>
this is the situation my ajax request do not response anything
I am trying to update the text from textbox to database using the onclick event and calling a javascript function.
This is the javascript code
function send_post()
{
var hr = new XMLHttpRequest();
var url ="send_post.php";
var fn = document.getElementById("post").value;
var vars = "post="+fn;
hr.open("POST",url,true);
hr.setRequestHeader("Content-type","application/x-www-form-urlencode");
hr.onreadystatechange = function() {
if (hr.readyState == 4 && hr.status ==200) {
var return_data = hr.responseText;
document.getElementById("status").innerHTML = return_data;
}
}
hr.send(vars);
document.getElementById("status").innerHTML = fn;
}
This is the php file code
<?php include 'inc/connect.inc.php';
$post =#$_POST['post'];
if ($post != "") {
$date_added = date("Y-m-d");
$added_by = "test123";
$user_posted_to = "test123";
$sqlCommand = "INSERT INTO posts VALUES('','$post','$date_added','$added_by','$user_posted_to')";
$query = mysql_query($sqlCommand) or die (mysql_error());
}
else{
echo "Write something to post.";
}
?>
But I get this error from the php :
Undefined index: post on line 3
The MIME type you are trying to use is application/x-www-form-urlencoded (with a d on the end).
PHP doesn't know how to parse data encoded as application/x-www-form-urlencode (without the d) so it doesn't populate $_POST for your code.
Javascript part:
<script>
function getXMLObject(){
var xmlHttp = false;
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP")
}
catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e2) {
xmlHttp = false
}
}
if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
xmlHttp = new XMLHttpRequest();
}
return xmlHttp;
}
var xmlhttp = new getXMLObject();
function send_post() {
if(xmlhttp) {
var post = document.getElementById("post").value;
xmlhttp.open("POST","send_post.php",true);
xmlhttp.onreadystatechange = resultPost;
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlhttp.send("post=" + post);
}
}
function resultPost() {
if (xmlhttp.readyState == 4) {
if(xmlhttp.status == 200) {
alert(xmlhttp.responseText);
}
}
}
</script>
PHP part:
<?php
include 'inc/connect.inc.php';
if(isset($_POST['post']) && trim($_POST['post']) != '') $post = mysql_real_escape_string(trim($_POST['post']));
else $post = '';
if ($post != '') {
$date_added = date("Y-m-d");
$added_by = "test123";
$user_posted_to = "test123";
$sqlCommand = "INSERT INTO posts VALUES('','$post','$date_added','$added_by','$user_posted_to')";
$query = mysql_query($sqlCommand);
if(mysql_affected_rows($link) == 1){
echo 'Operation successfully executed';
exit;
}
}
echo 'Write something to post.';
?>
I have a triple drop down menu and when I select an option for first drop down, based on that I get the values populated in the second drop down but these values in the second drop down do not clear even though I change the change the option of my first drop down. I am facing this problem with Chrome. In Firefox it works fine. Could some one tell me how to clear the previous selection contents. I have pasted my code in the pastebin
http://paste.flingbits.com/m05ef5d2
Could any one please help me with this.
#Cutekate: Try changing onClick in all your <select>'s to onChange.
Update:
JavaScript (save this to xhr.js):
var xhr;
function countySelect(q) {
if (q != "Select State") {
xhr = GetXmlHttpObject();
if (xhr == null) {
document.write("There was a problem while using XMLHTTP");
return;
}
var strURL = "findCounty.php?state=" + q + "&sid=" + Math.random();
xhr.onreadystatechange = countyStateChanged;
xhr.open("GET", strURL, true);
xhr.send(null);
}
else
{
document.getElementById("county").options.selectedIndex = 0;
document.getElementById("genus").options.selectedIndex = 0;
document.getElementById("csv").innerHTML = '';
}
}
function genusSelect(q) {
if (q != "Select County") {
xhr = GetXmlHttpObject();
if (xhr == null) {
document.write("There was a problem while using XMLHTTP");
return;
}
var strURL = "findGenus.php?county=" + q + "&sid=" + Math.random();
xhr.onreadystatechange = genusStateChanged;
xhr.open("GET", strURL, true);
xhr.send(null);
}
else
{
document.getElementById("genus").options.selectedIndex = 0;
document.getElementById("csv").innerHTML = '';
}
}
function dataSelect(q) {
if (q != "Select Genus") {
xhr = GetXmlHttpObject();
if (xhr == null) {
document.write("There was a problem while using XMLHTTP");
return;
}
var strURL = "getData.php?genus=" + q + "&sid=" + Math.random();
xhr.onreadystatechange = dataStateChanged;
xhr.open("GET", strURL, true);
xhr.send(null);
}
}
function countyStateChanged() {
if (xhr.readyState == 4) {
document.getElementById("countydiv").innerHTML = xhr.responseText;
}
}
function genusStateChanged() {
if (xhr.readyState == 4) {
document.getElementById("genusdiv").innerHTML = xhr.responseText;
}
}
function dataStateChanged() {
if (xhr.readyState == 4) {
document.getElementById("csv").innerHTML = xhr.responseText;
}
}
function GetXmlHttpObject() {
var xhr = null;
try {
// Firefox, Opera 8.0+, Safari
xhr = new XMLHttpRequest();
} catch (e) {
// Internet Explorer
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xhr;
}
HTML:
<!-- place above <form> -->
<script type="text/javascript" src="xhr.js"></script>
<!-- rest of code... -->
<tr>
<td>State</td>
<td>
<select id="state" name="state" onchange="countySelect(this.value)">
<option value="Select State">Select State</option>
<option value="Alabama">Alabama</option>
<option value="Tennessee">Tennessee</option>
<option value="Texas">Texas</option>
</select>
</td>
</tr>
<tr>
<td>County</td>
<td>
<div id="countydiv">
<select id="county" name="county" onchange="genusSelect(this.value)">
<option value="Select County">Select County</option>
</select>
</div>
</td>
</tr>
<tr>
<td>Genus</td>
<td>
<div id="genusdiv">
<select id="genus" name="genus" onchange="dataSelect(this.value)">
<option value="Select Genus">Select Genus</option>
</select>
</div>
</td>
</tr>
<!-- rest of code... -->
<div id="csv">
<!-- output of dataSelect will be displayed here -->
</div>