Cannot use responseText in ajax - ajax

I want to write a code to login, the login ajax will send username and password to server and then server will return the result back. My problem is I cannot split the responeText from xmlhttp...
My js:
function kiemTraDangNhap(usrname, pass) {
var xmlhttp;
//
if (usrname == "" || pass == "") {
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) {
var kq = xmlhttp.responseText.split("--");
document.getElementById("notice").innerHTML = kq[0];
}
}
xmlhttp.open("POST", "LoginAjax.aspx", true);
//
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send("un="+usrname+"&"+"pass="+pass);
}
The LoginAjax.aspx:
//Do some thing with databse, example it respone this:
Response.Write("Info--Success");
the document.getElementById("notice").innerHTML = kq[0]; don't show anything.
Any idea?

Related

get response from server without page refresh

<script type="text/javascript">
function fun1(){
var xmlHttp;
try {// Firefox, Opera 8.0+, Safari
xmlHttp = new XMLHttpRequest();
} catch (e) {// Internet Explorer
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
alert("Your browser does not support AJAX!");
return false;
}
}
}
xmlHttp.onreadystatechange = function(){
if (xmlHttp.readyState == 4) {
var respText = xmlHttp.responseText.split('<body>');
elem.innerHTML = respText[1].split('</body>')[0];
$("#st-content").show();
}
}
var ur='Tips.action';
xmlHttp.open("GET", ur, true);
xmlHttp.send(null);
}
</script>
Actually i have 2 jsps.one for inserting and another for viewing the inserted records.
The inserting jsp page appears in popup.after submitting the form the inserted record should be viewed in another jsp without page refresh.
How can i achieve this?please anyone guide me to complete this task
ajax success response you can replace response text to the popup current html code or a div code

How to have more than 1 output for this simple ajax?

This is a script I learnt from w3schools to load in AJAX.
document.getElementById("sendInvoiceButton").innerHTML = '';
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("invoiceIDStatus").innerHTML = '';
document.getElementById("invoiceIDStatus").innerHTML=xmlhttp.responseText;
}
}
var invoiceID = document.getElementById("cred_form_4684_1_wpcf-ticket-invoice-id").value;
var text = "invoiceID=" + encodeURIComponent(invoiceID);
document.getElementById("invoiceIDStatus").innerHTML = '<img src="http://www.lessons.com.sg/freshbooks/demo_wait.gif" />';
xmlhttp.open("POST","/freshbooks/getInvoice.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send(text);
}
I can only output 1 xmlhttp.responseText;
I want to send the invoice number to a textbox too. How can I do that?
the simple way
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
...
document.getElementById("yourTextboxId").innerHTML=xmlhttp.responseText;
}
or if with textbox you mean textfield
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
...
document.getElementById("yourTextfieldId").value=xmlhttp.responseText;
}
I suggest to use jquery, is more simple and cross browser compatible
with jquery this would be
$.ajax({
url:'/freshbooks/getInvoice.php',
method:'POST',
data: {invoiceID: $('#cred_form_4684_1_wpcf-ticket-invoice-id').val()},
success: function(data) {
$('#invoiceIDStatus').html(data);
$('#yourTextfieldId').val(data);
}
});
I'm not sure of the structure of data that you are receiving but you could send it html formatted and then use find() to split it and put in different input fields.

AJAX request not working in IE

$('.sizeSelect').change(function(size) {
sizeId = $(this).attr('id');
size = $('#' + sizeId).val();
lastChar = sizeId.substr(5);
addBtn = "#btn_" + lastChar;
shipId = "shipping_" + lastChar;
if (size=="")
{
document.getElementById(shipId).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(shipId).innerHTML=xmlhttp.responseText;
var response = xmlhttp.responseText;
if (response == 0.00) {
$(addBtn).addClass('invisible');
}
else if (response > 0.00) {
$(addBtn).removeClass('invisible');
}
}
}
xmlhttp.open("POST","cart.php?size="+size+"&shipId="+lastChar, true);
xmlhttp.send();
});
Can anyone tell me why this works in Chrome, Firefox and safari and not in IE. I read somewhere that it had to do with forcing ie not to cache and that changing the the request from a get to a post would help... it didnt :(
Any ideas?
Have you tried using jQuery? Have you checked how IE is handling the response - perhaps it sees "0.00" as text you have to parseFloat?
the trick is use separate code XML for IE browsers or that are version of less than 10 .
so every time Ajax is call a method parseXml is called with input parameter XML Dom or text, depending on browser .... and if current browser is IE, it upload XML doc, process it according to Microsoft standards and return XML and rest of processes in Ajax carries on as expected!!
note : browser.msie is not supported in jQuery 1.9 but you can add jquery-migrate-1.2.1.min.js in order to make it compatible or use userAgent and find which is current browser
$.ajax({
type: 'GET',
url: 'XML_file.xml',
dataType: ($.browser.msie) ? "text" : "xml",
success: function (xml) {
var processedXML = parseXml(xml);
$(processedXML).find('my record').each(function () { //code }
});
function parseXml(xml) {
if ($.browser.msie) {
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET", "XML_file.xml", false);
xmlhttp.send();
xmlDoc = xmlhttp.responseXML;
xml = xmlDoc;
}
return xml;
}

Ajax function is not working

I need to display a name in the textbox with id = txtName using an ajax function, but it won't work. The following is my ajax function:
function showName(str) {
if (str.length == 0) {
document.getElementById("txtName").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("txtName").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "getname.php?q="+str, true);
xmlhttp.send();
}
You have to chnage the innerHTML to value, since the former will be changing the value of the element having the id "txtName".
Hope this helps.
function showName(str)
{
if (str.length==0)
{
document.getElementById("txtName").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("txtName").value=xmlhttp.responseText;
}
}
xmlhttp.open("GET","getname.php?q="+str,true);
xmlhttp.send();
}
Try using jquery , why still using the old fashioned ajax

AJAX Response not working in FF

I have a bit of code which alerts the $response from a php code in IE, but for some reason it doesn't work in FF..
Here's the code:
function contactfunction() {
var url = "scripts/php/cbb.php?pname=";
xmlHttp.open("GET", url, true);
xmlHttp.onreadystatechange = updatecontact1;
xmlHttp.send(null);
}
function updatecontact1() {
if (xmlHttp.readyState == 4) {
var response = xmlHttp.responseText;
alert(response);
}
}
And here's the PHP file (cbb.php)
<?php
$fp=fopen("ip.txt","a+");
fwrite($fp, "cib\r\n");
fclose($fp);
$response = "something";
return $response;
?>
Can anyone help me out here? I'm not sure how to get it to work in FF, it just gives a blank popup..
Do yourself a favour, and use one of the many ajax capable Javascript libraries out there, like jQuery, which frees the user from hacking up code to deal with browser discrepancies (for the most part, at least):
//using jQuery's $.get method
function update(name) {
$.get('cbb.php?name=' + name, function(response) {
alert(response);
$('#someDiv').html(response);
});
}
or:
//using jQuery's $.load method
function update(name) {
//directly inject div id="someDiv" with output of url
$('#someDiv').load('cbb.php?name=' + name);
}
Putting it together:
//when the DOM is ready
$(document).ready(function() {
//bind to click event of all anchors with class="contact"
$('a.contact').click(function(e) {
//stop the link from being followed
e.preventDefault();
//get the name from the link text
var name = $(this).text();
update(name);
});
});
Timmy
McLovin
<div id="someDiv">This is where the output will be injected</div>
See http://docs.jquery.com/Ajax for more information.
I managed to get the code working by using:
function getFile(fileToOpen) {
var xmlhttp;
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else if (window.ActiveXObject) {
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
} else {
alert("Your browser does not support XMLHTTP!");
}
xmlhttp.open("GET",fileToOpen,false);
xmlhttp.send(null);
alert( xmlhttp.responseText );
}
function contactfunction() {
getFile('scripts/php/cbb.php?pname=');
}
If anyone else has the same problem :)

Resources