ajax can't display hash sign - javascript

i have this code of HTML
<textarea cols="120" rows="4" name="editor" id="editor" onkeyup="sendData()"></textarea>
<span id="container" name="container"></span>
and this one in JS
function sendData(){
var hc = document.getElementById('editor').value;
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("container").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "w.php?h=" + hc, true);
xmlhttp.send();
}
also this one in w.php
<?php
$h = $_REQUEST['h'];
echo $h;
?>
when i use this code it's work very fine but there is a problem with tow letters first one "#" and second one "&" so how can i fix this problem :)
thank you

You have to encode your data for a URI. Simply use
encodeURIComponent(/* The data to encode here. */)
before creating your request URL.

Related

How to pass datepicker value to php without reloading the page using XMLHttpRequest();

How to pass datepicker value to PHP without reloading the HTML page using XMLHttpRequest();
I am using this date value for further query and displaying in the same html page.
<input type="date" id="month" onchange="myFunction(this.value)">
<script>
function myFunction(str) {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("month").value = this.responseText;
}
};
xmlhttp.open("POST", "chart.php", true);
xmlhttp.send("value=" + str);
}
</script>
<?php
$date = "";
if(isset($_POST["value"])){
$date = $_POST["value"];
}
?>
I believe the function parameter str is giving you the date value you selected if yes, then you are missing the header information for content-type. Please set it as follow after xmlhttp.open("POST", "chart.php" , true);
xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

send content to other page using script

I have written a code in script which is given below.
function myFunction(a) {
var k=a;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("ques").innerHTML = this.responseText;
}
};
xhttp.open("GET", "retrieveQuestion.php?question=" +a, true);
xhttp.send();
var q="<td><input type='text' name='answer' id='ans' placeholder='submit your answer here'/></td>" ;
document.getElementById("t2").innerHTML=q;
var answ = document.getElementById("ans").value;
var z="<td align='center'><input type='button' value='submit' onclick='myfunc1(k,answ)'/></td>";
document.getElementById("t3").innerHTML=z;
}
function myfunc1(q1,a1)
{
xhttp.open("GET", "checkanswer.php?question=" +q1 + "&a1=" +a1, true);
xhttp.send();
}
Now when i click on submit button it did not redirected to checkanswer.php
can anyone help me in this problem.
Using xhttp.open is sending a background request to checkanswer.php, rather than actually redirecting to it. You'd need to use something like window.location instead.

How to check if a session is empty using javascript inside php

Also, how do i unset the session through javascript?
I have made this code with PHP:
if(isset($_SESSION) && !empty($_SESSION)) {
unset($_SESSION['Plan1']);
unset($_SESSION['excel_array']);
$_POST['excel_name']['Main'] = "Main".date("y_m_d_Hi");
$_POST['excel_array']['Main']['Plan1'] = array();
}
else{
$_SESSION['excel_name']['Main'] = "Main".date("y_m_d_Hi");
$_SESSION['excel_array']['Main']['Plan1'] = array();
}
So here i check if there is a session. If there is, i unset it and send the $_POST data instead. however, if there isn't one, i create it.
The problem is, i might want to call this on a button click. How would i make a code with the same functionality, but using a javascript function?
Put your php in a file on its own, called set_session.php for example:
<?php
session_start();
unset($_SESSION['Plan1']);
echo 'unset';
?>
Call it in javascript:
<script>
function unset() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("result").innerHTML = this.responseText;
}
};
xhttp.open("GET", "set_session.php", true);
xhttp.send();
}
</script>
<button type="button" onclick="unset()">Unset</button>
<div id="result"></div>

split "responseText" coming from php to 2 parts

I use:
document.getElementById("result").innerHTML = xhttp.responseText;
To place the result from PHP (responseText) in result div of HTML file.
How to split the result coming from PHP to two parts and put the first part in result div then replace the result div with second part?
I try:
var url = "file.php";
var params = "x1="+x1+"&x2="+x2;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function()
{
if (xhttp.readyState == 4 && xhttp.status == 200)
{
var r= xhttp.responseText.split("|");
document.getElementById("result").innerHTML = r[0];
document.getElementById("result").innerHTML = r[1];
}
}
xhttp.open("POST", url, true);
xhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhttp.send(params);
In php file, I put | after the end of the printed text "part 1" but, the result was:
This is your first part result |
"|" is printed! and the div does not replaced with the second part!
It is working now. I solve the problem by print "|" in a separetwe echo statement.
echo "first statement";
echo"|";
echo"second statement";
Thanks all;

How to pass input values to ajax

Okay, I'm new to Ajax. My problem is that I'm not sure how to retrieve data which is in the <input> tag and send it to Ajax. I have tried searching on the internet, but most of the solutions are using jQuery Ajax, which is what I'm not looking for at the moment.
Here is my code.
I want to save this value so that my Ajax can read it...
<input id="IDValue" name="IDValue" value="<?php echo $row['exist']?>" >
This is my Ajax script...
function message(){
var ID=$(".IDValue").val();
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
}
};
xmlhttp.open("POST","retrieveMsg.php?q=" +ID,true);
xmlhttp.send();
}
Please help me, guys. The reason I am doing this method is because (My previous post) Send input value to php using ajax with result printed to div
Replace it
var ID=$(".IDValue").val();
With
var ID = document.getElementById("IDValie").value;
i am confused about your $row['exist'] returns value or not and what html control you used for id="txtHint". here i have provided demo which same as your code in some way...try and have an idea and make changes as per your requirement...
<html>
<head>
<script src="jquery.js"></script>
</head>
<body>
<input id="IDValue" name="IDValue" value="<?php echo 'hello';?>" >
<textarea id="txtHint"></textarea>
<input type="button" value="Click" onClick="message()"/>
<script>
function message(){
var ID=$("#IDValue").val();
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
}
};
xmlhttp.open("POST","login.php?q=" +ID,true);
xmlhttp.send();
}
</script>
</body>
</html>

Categories