I want to post the field values entered in this code to the page ajaxpost.php using Ajax and then do some operations there. What would be code required to be written in ajaxpost.php. Also woithout using any js file/jquery
Here is the code of page in which fields are entered, I would like to know what would be the code to be written in ajaxpost.php
<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
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)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
var zz=document.f1.dd.value; //alert(zz);
var qq= document.f1.cc.value;
xmlhttp.open("POST","ajaxpost.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("dd=zz&cc=qq");
}
</script>
</head>
<body>
<h2>AJAX</h2>
<form name="f1">
<input type="text" name="dd">
<input type="text" name="cc">
<button type="button" onclick="loadXMLDoc()">Request data</button>
<div id="myDiv"></div>
</form>
</body>
</html>
I think you are looking for bare bones php and ajax for which there are tons of tutorials such as this one, which is quite close to what you are looking for.
Related
I am having trouble with my php code. I have tried everything and nothing works.
I want that the form will save the search query into the database but but i canot use action="search.php" since the result is displayed on the index.php page so it need's to stay on the index page and execut the save.
The form:
<form class="form-domain" role="form" action="search.php" method=post>
<!-- Search input -->
<div class="search-input">
<span class="www">www.</span>
<input type="text" class="form-control input-domain" placeholder="vasa-nova-domena" name="ime_domene">
<div class="domain-extension">
<select class="form-control" name="koncnica">
<option value=".com" selected="">.com</option>
<option value=".si">.si</option>
</select>
</div>
</div><!-- /.search-input -->
<button class="btn btn-success btn-block" id="poslji" name="preglej" type="submit"><strong>PREVERI</strong></button>
</form>
Right after this form comes the php result so i need to stay on the index.php to have the result of the search visible but the same time i want the input/search that was given saved into the database.
I hope this wasen't to complicated. :)
<script>
function loadXMLDoc()
{
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)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("POST","<?php include 'search.php';?>",true);
xmlhttp.send();
}
}
</script>
I have an AJAX script that used to replace an entire div with new html including the <input> markup:
<script>
function show_locations(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) {
var a = xmlhttp.responseText;
a = JSON.parse(a);
document.getElementById('locations_dropdown').innerHTML=a.location;
document.getElementById('dm').innerHTML=a.dm;
document.getElementById('dm_email').innerHTML=a.dm_email;
}
}
xmlhttp.open('GET','includes/get_locations.php?d='+str,true);
xmlhttp.send();
}
</script>
The document.getElementById('dm_email').innerHTML=a.dm_email;').innerHTML=a.dm_email; would replace the <div id=dm_email></div> contents with a new <input> markup which would include the new email value in value="" here:
<div id="dm_email">
<input type="email" value="">
</div>
But, now I know that sending html markup through json is a bad practice, so how can I change my AJAX script above to replace just the value of the input?
I tried this:
document.getElementById('dm_email').value=a.dm_email;
But it doesn't work. Any ideas?
I'm new at Ajax and this code should change the div dynamically in real time when the user type something in the input field but nothing happens.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<!--api to use ajax-->
<script type="text/javascript" src="sarissa/gr/abiss/js/sarissa/sarissa.js"> </script>
<title>Ajax Test</title>
<script>
function loadXMLDoc() {
var xmlhttp;
//parameter
var suggest = document.getElementById("searchbox").value;
//using XMLHttpRequest
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
//when xmlhttp be ready...
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
//the HTML will be modify
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
//the file that will receive and retrieve info
xmlhttp.open("POST","enviar.php",true);
//header to the retrieved information
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//the param will be send
var sendParam = "fname="+suggest;
xmlhttp.send(sendParam);
}
</script>
</head>
<body>
Busca: <input type="text" id="searchbox" />
<div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onkeypress="loadXMLDoc()">Change Content</button>
</body>
</html>
Change the onkeypress event to onclick.
If you would like the content to change as the user types, add an onkeyup event to the text input element.
First you should put your javascript codes before, your HTML inputs, because, the DOM needs to load the entire document, before it can manupilate it. otherwise, you should put your functions inside the body tag, with onload attribute.
second, use the onclick event instead of onkeypress, I modified your script, and tested it. It works now
<html>
<head></head>
<body>
Busca: <input type="text" id="searchbox" />
<div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="loadXMLDoc()">Change Content</button>
<script type='text/javascript'>
function loadXMLDoc() {
var xmlhttp;
//using XMLHttpRequest
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else
{// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//when xmlhttp be ready...
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
//the HTML will be modify
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
//parameter
var suggest = document.getElementById("searchbox").value;
var sendParam = "fname="+suggest;
//the file that will receive and retrieve info
xmlhttp.open("POST","enviar.php",true);
//header to the retrieved information
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//the param will be send
xmlhttp.send(sendParam);
console.log(xmlhttp);
}
</script>
<body/>
I was try to attach the ckeditor to a textarea in php page, which is being called by ajax in a html page, but ckeditor is not appearing in textarea. Can any one have any idea, Why it is not happening, it just making me freak.
TRY1.HTML
<script type="text/javascript">
function load()
{
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("div_content").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","try2.php?",true);
xmlhttp.send();
}
</script>
<!--end tinymcs-->
</head>
<body>
<input type="button" onclick="load()">
<div id="div_content">
</div>
</body>
</html>
TRY2.PHP
<textarea id="txt1"> </textarea>
That is because the textarea in which you are binding the editor was not present on the initial load of the page so its not getting binded.
You should bind that on the success call back of ajax call.
On Success you should do bind the textarea with ckeditor and it will work.
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("div_content").innerHTML=xmlhttp.responseText;
document.getElementById("txt1").ckEditor();
//or whatever the exact code you do for ckEditor
}
I have a profile create page like this.
<html>
<head>
<script>
function validateMe(){
var xmlhttp;
var userEmail = document.getElementById("email").value;
var userPwd = document.getElementById("pwd").value;
//alert(userEmail);
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);
}
document.getElementById("responds").innerHTML=xmlhttp.responseText;
}
xmlhttp.open("POST","api.php?email="+userEmail+"&pwd="+userPwd,true);
xmlhttp.send();
}
</script>
</head>
<body>
<form name="login" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<table>
<tr><td colspan="2">Login</td></tr>
<tr><td>Username:</td><td><input type="text" name="email" id="email"/></td></tr>
<tr><td>Password:</td><td><input type="text" name="pwd" id="pwd"/></td></tr>
<tr><td><input type="button" value="Submit" name="submit" onclick="validateMe();"/><td></td></tr>
</table>
<div id="responds"></div>
</form>
</body>
</html>
I need to use the RESTful web service with php and ajax to insert these data into my MySql database.
How can I implement this. Can anyone help me out to do this.
First, I suggest you to use the jQuery Javascript framework. With it, it made dead simple to make AJAX requests and getting the input values (without worrying of the web browser, etc).
Second, I don't see any RESTful web service here. It's a simple POST form.
So please, details your question :)