Develop Reference

How can Variable and that value move freely in the cycle of PHP->HTML->JS->PHP

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.

How do I make an HTTP request to bitstamp?

I'm trying to use an API from bitstamp to fetch a currency trading price on my webpage.
I have researched this problem, but I still cannot get it to work as it always returns ERROR
The link used is https://www.bitstamp.net/api/ticker/ and the response should be last
Here is my code:
var xhr = new XMLHttpRequest();
xhr.open("GET", "https://www.bitstamp.net/api/ticker/", true);
xhr.send();
xhr.addEventListener("readystatechange", processRequest, false);
function processRequest(e) {
if (xhr.readyState == 4 && xhr.status == 200) {
var response = JSON.parse(xhr.responseText);
window.alert(response.last);
}
else {
window.alert("ERROR");
} }

Try this:
function loadXMLDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var jsonRes= JSON.parse(this.responseText);
if (jsonRes.hasOwnProperty('last')) {
document.getElementById("demo").innerHTML =
jsonRes.last;
alert(jsonRes.last);
}
}
};
xhttp.open("GET", "https://www.bitstamp.net/api/ticker", true);
xhttp.send();
}
<h2>Using the XMLHttpRequest object</h2>
<button type="button" onclick="loadXMLDoc()">Change Content</button>
<p>last attribute is: <span id="demo"></span></p>

Here is one way:
<script src="./jquery.min.js">
//none secure web page ?
jQuery.get("https://www.bitstamp.net/api/ticker/", function (data, status)
{
// use response here; jQuery passes it as the first parameter
var response = JSON.parse(data);
window.alert(response.last);
console.log("MyFunc: " + "response : " + response + "\nStatus: " + status);
});
</script>

var xhr = new XMLHttpRequest();
xhr.open("GET", "https://www.bitstamp.net/api/ticker/", true);
xhr.send();
xhr.addEventListener("readystatechange", processRequest, false);
function processRequest(e) {
if (xhr.readyState == 4) {
if (xhr.status == 200) {
var response = JSON.parse(xhr.responseText);
window.alert(response.last);
} else {
window.alert("ERROR");
}
}
}

Pass Array From Select Into xmlhttp

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
?>

data is not showing in dropdown

I am very new in javascipt infact this is my first program.
i have written html javascrpit code to shoow data in dropdown from python django databse but when i run it, it is not showing data my code is
<!DOCTYPE html>
<html>
<title>CP Project</title>
<head>
</head>
<body>
Country : <select class="country" onchange="changeCountry(this)">
</select><br/>
State :
<select class="state" onchange="changeState(this)">
</select><br/>
City :
<select class="city" onchange="changeCity(this)">
</select>
<script>
var country = document.querySelector(".country");
var state = document.querySelector(".state");
var city = document.querySelector(".city");
var countryList = {};
var stateList = {};
var cityList = {};
// Access-Control-Allow-Origin: http://127.0.0.1:8002/data/ ;
Access-Control-Allow-Methods: POST, GET, OPTIONS;
getCountryList(function(response){
countryList = response;
var tempStr = "";
/*for(var i in response.result){
tempStr+="<option value="+i+">"+response.result[i]+"</option>";
}*/
for(var i=0;i<response.length; i++){
tempStr+="<option value="+response[i].countryId+">"+response[i].country+"</option>";
}
country.innerHTML = tempStr;
});
function changeCountry(this_){
getStateList(this_.value, function(response){
stateList = response;
var tempStr = "";
/*for(var i in response.result){
tempStr+="<option value="+i+">"+response.result[i]+"</option>";
}*/
for(var i=0;i<response.length; i++){
tempStr+="<option value="+response[i].state_id+">"+response[i].state+"</option>";
}
http.open("GET", "http://127.0.0.1:8002/data/country/", true);
http.send();
state.innerHTML = tempStr;
});
}
function changeState(this_){
getCityList(this_.value, function(response){
cityList = response;
var tempStr = "";
/*for(var i in response.result){
tempStr+="<option value="+i+">"+response.result[i]+"</option>";
}*/
for(var i=0;i<response.length; i++){
tempStr+="<option value="+response[i].cityid+">"+response[i].city+"</option>";
}
city.innerHTML = tempStr;
});
}
function getCountryList(callBackFun){
var http = new XMLHttpRequest();
http.onreadystatechange = function(){
if (this.readyState === 4){
callBackFun(JSON.parse(this.responseText));
}
};
http.open("GET", "http://127.0.0.1:8002/data/country/", true);
http.send();
}
function getStateList(countryCode, callBackFun){
var http = new XMLHttpRequest();
http.onreadystatechange = function(){
if (this.readyState === 4){
callBackFun(JSON.parse(this.responseText));
}
};
http.open("GET", "http://127.0.0.1:8002/data/state?count_id="+countryCode, true);
http.send();
}
function getCityList(stateCode, callBackFun){
var http = new XMLHttpRequest();
http.onreadystatechange = function(){
if (this.readyState === 4){
callBackFun(JSON.parse(this.responseText));
}
};
http.open("GET", "http://127.0.0.1:8002/data/cities/?sta_id="+stateCode, true);
http.send();
}
</script>
</body>
</html>
it is showing two warning
1.SyntaxError: missing ; before statement
2.The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol.

Well, you're probably missing a semicolon.
And adding
<meta charset="UTF-8">
should solve the bottom error.

Unable to use two functions with same ajax object

Below function only works to fetch URL that is function 1. Function 2 which makes another ajax call to fetch and display data in one of the pages that fetched by function 1, doesn't work. WHy is it so, is there any conflict here? I believe can use same object which is xmlhttp in this case for multiple function?
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/jquery-1.11.2.min.js"></script>
<script>
var xmlhttp = false;
try {
xmlhttp = new ActiveXObject(Msxml2.XMLHTTP);
//alert("javascript version greater than 5!");
} catch (e) {
try {
xmlhttp = new ActiveXObject(Microsoft.XMLHTTP);
// alert("you're using IE!");
} catch (E) {
xmlhttp = new XMLHttpRequest();
//alert("non IE!");
}
}
//function 1
function sendtobox(param, param2) {
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
if (this.responseText !== null) {
var ajaxElm = document.getElementById('boxA');
//ajaxElm.innerHTML = this.responseText + ajaxElm.innerHTML; // append in front
jQuery(ajaxElm).prepend(this.responseText);
}
}
}
xmlhttp.open("GET", "getsubjects.php?q=" + param + "&r=" + param2, true);
xmlhttp.send();
}
//function 2
function makerequest(serverPage, objID) {
var obj = document.getElementById(objID);
xmlhttp.open("GET", serverPage);
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
obj.innerHTML = xmlhttp.responseText;
}
}
xmlhttp.send(null);
}
html
<div class="row">
<div class="small-11 medium-12 large-12 small-centered medium-centered large-centered text-center columns top_menu">
<ul class="small-block-grid-4 maedium-block-grid-4 large-block-grid-4">
<li>
Home
</li>
<li>
Search Tutors</li>
<li>
Become a tutor
</li>
<li>
How it works
</li>
</ul>
</div>
</div>
<div class="row">
<div class="small-11 medium-12 large-12 columns">
<section id="content">
<div class="row">
<div class="small-12 medium-12 large-12 columns" id="hw">
</div>
</div>
</section>
</div>
</div>

Create different xmlHTTP request objects for each call
function getXmlHttp() {
var xmlhttp = false;
try {
xmlhttp = new ActiveXObject(Msxml2.XMLHTTP);
//alert("javascript version greater than 5!");
} catch (e) {
try {
xmlhttp = new ActiveXObject(Microsoft.XMLHTTP);
// alert("you're using IE!");
} catch (E) {
xmlhttp = new XMLHttpRequest();
//alert("non IE!");
}
}
return xmlhttp;
}
//function 1
function sendtobox(param, param2) {
var xmlhttp = getXmlHttp();
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
if (this.responseText !== null) {
var ajaxElm = document.getElementById('boxA');
//ajaxElm.innerHTML = this.responseText + ajaxElm.innerHTML; // append in front
jQuery(ajaxElm).prepend(this.responseText);
}
}
}
xmlhttp.open("GET", "getsubjects.php?q=" + param + "&r=" + param2, true);
xmlhttp.send();
}
//function 2
function makerequest(serverPage, objID) {
var xmlhttp = getXmlHttp();
var obj = document.getElementById(objID);
xmlhttp.open("GET", serverPage);
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
obj.innerHTML = xmlhttp.responseText;
}
}
xmlhttp.send(null);
}