In my application i'am making two ajax call for getting some data from database based on another variable value.
code part:
var xmlHttp;
var redirect;
function populate_site(obj, passedselect) {
xmlHttp = GetXmlHttpObject();
var site_type;
if (obj.value) {
site_type = obj.value
}else {
site_type = document.app.site_type.value;
}
var url="/cgi-bin/Web/Begin.cgi";
url=url+"?redirect=Get_Site_List";
url=url+"&site_type=" + site_type;
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}
function stateChanged() {
if (xmlHttp.readyState == 4){
document.getElementById('site_id').innerHTML = xmlHttp.responseText;
}
}
function Populate_Process_List(obj, process_id_param) {
var action_id;
if (obj.value) {
action_id = obj.value
}else {
action_id = document.app.action_id.value;
}
xmlHttp = GetXmlHttpObject();
if (obj.value == '') {
document.getElementById('process_id').innerHTML = ' ';
return false;
}
var url="/cgi-bin/Web/Begin.cgi";
url=url+"?redirect=Fetch_User_Process_List";
url=url+"&action_id=" + action_id;
url=url+"&process_id=" + process_id_param;
url=url+"&gp_flag=" + 'YES';
xmlHttp.onreadystatechange= Process_Data_StateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}
function Process_Data_StateChanged() {
if(xmlHttp.responseText != 'NA') {
if (xmlHttp.readyState == 4){
document.getElementById('process_id').innerHTML = xmlHttp.responseText;
}
}
}
function GetXmlHttpObject(){
var xmlHttp1=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp1=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp1=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp1=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp1;
}
And validating site_id and process_id variable using JavaScript.
Problem facing is whenever user press the submit button before ajax call loading is not completed (since me passing async parameter of the open() method has as true). Even while validating the site_id and process_id variable using JavaScript is not getting captured.
Validation code:
var siteaddindex = document.app.site_id[document.app.site_id.selectedIndex].value;
if(siteaddindex == "null"){
alert("Please select site location.");
document.app.site_id.focus();
return false;
}
var process_id = document.app.process_id.value;
if (process_id == '') {
alert("Please select process");
return false;
}
Please let me know how to perform validation of above fields, since those fields are mandatory.
Related
I am facing some unidentified issue. please any one help me to sort out.
problem is when runonload() function runs, we will get print but I am getting duplicate prints (with same data). but this function executes one time (logs in this function write one time) but fnQrCode() & fnBuildBody() calling twice (logs in these function writes twice and getting prints twice). there is no loop for second time. Below is my code snippet.
var xmlcodebar="";
---
---
function runonload(){
code for print preparation
-------
-------
fnQrCode(dealref,sterlingQR, deliveryType); //this function for qr code generation
xmlcodebar = "data:image/png;base64,"+xmlcodebar;
footer11 = '<td width="100%"><img src='+xmlcodebar+' align="center" width="750" height="150"></td>';
footer12 = '</tr></table>';
fnBuildBody(strRows,strPrintData, Number(strPageLength),footer1,footer2, footer3, footer4, footer5, footer6, footer7, footer8,footer9, footer10, footer11, footer12); //this function for printing
-------
--------
}
function fnQrCode(dealref,sterlingQR,deliType){
var data =sterlingQR+";"+dealref+"$;"+deliType;
var strQueryString = "hdnOptPage=QRCODE&DATA="+data;
xmlHttp = GetXmlHttpObject();
if (xmlHttp == null) {
alert("Browser doesn't supports Http Request");
return;
}
var url = "<%=CONTROLSERV_TFROUT%>"+"?"+strQueryString;
xmlHttp.onreadystatechange = stateBarcode;
xmlHttp.open("POST",url,false);
xmlHttp.send();
}
function stateBarcode() {
if (xmlHttp.readyState == 4 || xmlHttp.readyState == "complete") {
if(xmlHttp.status == 404 || xmlHttp.status == 500){
alert("Problem occured at server. Please try again.");
window.event.returnValue=false;
return;
} else if (xmlHttp.status == 200) {
xmlcodebar = xmlHttp.responseText;
}
}
}
function GetXmlHttpObject() {
var objXMLHttp = null;
//check whether browser supports HttpRequest
if (window.XMLHttpRequest) {
objXMLHttp = new XMLHttpRequest();
} else {
if (window.ActiveXObject) {
objXMLHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return objXMLHttp;
}
I have a form that is supposed to display a feedback message from the server once it is submitted in <div id="resposta"></div>
I can't use JQuery on my page because it is also using Mootools and it's really a mess to avoid the conflicts with those two (I tried all sorts of things I don't to bother you with). Therefore, I must use pure JavaScript here.
Once the form is submitted (after validation) it calls the function getResposta below:
function getXmlHttp() {
var xmlhttp;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
};
function getResposta(){
var resposta = document.getElementById("resposta");
var request = getXmlHttp();
request.open("POST", "thanks.php", true);
request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
request.onreadystatechange = function () {
if (request.readyState != 4) return;
if (request.status == 200) {
resposta.innerHTML = '<p>' + request.responseText + '</p>';
} else {
alert("Erro: "+request.statusText);
}
};
}
}
thanks.php:
<?php
echo "thank you";
?>
It seems that thanks.php isn't being called, although the form is correctly filled in and sent to the server.
I've tried typing in the absolute path to the file but it didn't work. So, what is wrong with this code?
Thanks for any help!
function login1() {
var user = document.getElementById("username").value;
var pass = document.getElementById("password").value;
var url = "http://agero-dev.apigee.net/v1/id/auth/login";
var http = getHTTPObject();
if (http.status == 200 ) {
this.http.open("post", url, false, user, pass);
this.http.send("");
document.location = job-list.html;
} else {
alert("Incorrect username and/or password!");
}
return false;
}
function getHTTPObject() {
var xmlhttp = false;
if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
return xmlhttp;
}
Please look at the above code, while giving wrong username and password, it showing an alert, but while using correct login, it doesnt redirecting to job-list.html page, please advice?
You can use readyState to check whether response is ready.
http.onreadystatechange=function() {
if (http.status == 200 && http.readyState == 4) {
.... //your code
window.location = job-list.html;
}
}
http.open("post", url + '?user=' + user + '&pass=' + pass, true);
http.send();
We have the following method to invoke the URL using ajax.
Currently after hitting the url we are using the response.
So we want to put a timeout for reposne.So when we invoke the url if the response didn't came after 2sec then call one more method and if resp comes within two seconds call other mehtod.
We have tried using the timeout,but unable to made it working with the code.
function ajaxCall(url1) {
var ajaxresp = null;
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
} else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET", url1, true);
xmlhttp.send();
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
ajaxresp = xmlhttp.responseText;
//function call
getAdResponse(ajaxresp);
}
}
}
}
Please advice me how to proceed.
Try smth like this
xmlhttp.open("GET",url1,true);
xmlhttp.onreadystatechange= function (){
if (xmlhttp.readyState==4){
if (xmlhttp.status == 200){
ajaxresp = xmlhttp.responseText;
}
}
xmlhttp.send();
setTimeout(function() {
if(ajaxresp) {
dosmth(ajaxresp);
} else {
dosmthelse();
}
}, 2000);
please see the code below:
function createXMLHttpRequestObject() {
// will store the reference to the XMLHttpRequest object
var ajaxRequest;
// create the XMLHttpRequest object
try{
// Opera 8.0+, Firefox, Safari
ajaxRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser broke!");
return false;
}
}
}
// return the created object or display an error message
if (!ajaxRequest) alert("Error creating the XMLHttpRequest object.");
else return ajaxRequest;
}
function ajax_update() {
var ajaxRequest = createXMLHttpRequestObject();
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState != 4){
...
}
if(ajaxRequest.readyState == 4){
//process JSON data
}
}
}
I am trying to monitor/listen for ajaxRequest.readyState value from outside ajax_update() function.
ajax_update() is triggered on button onlick.
MY aim is being outside of function ajax_update() to fire another JS function only when all Ajax calls are completed, that means ajaxRequest.readyState==4.
for ex:
<input type='button' value='SEND QUOTE' onclick=\"ajax_update(some params); function_that_fires_when_readystate_is_completed();\">
Any ideas?
Thank you in advance!
Use a callback.
JS
function ajax_update(callback) {
var ajaxRequest = createXMLHttpRequestObject();
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
callback();
}
};
xmlhttp.open(...);
xmlhttp.send(null);
}
HTML
<input onclick="ajax_update(function_that_listens_to_readyState);">
ajaxRequest1.onreadystatechange = function(){
if(ajaxRequest.readyState != 4){
...
}
if(ajaxRequest.readyState == 4){
//process JSON data
firstIsReady = true;
check();
}
}
ajaxRequest2.onreadystatechange = function(){
if(ajaxRequest.readyState != 4){
...
}
if(ajaxRequest.readyState == 4){
//process JSON data
secondIsReady = true;
check();
}
}
function check() {
if (firstIsReady && secondIsReady) {
//both ajax calls completed
}
}
Something like that. It's really ugly, but without knowing exactly what you want to do, I can't give you a better way to do it.
define this globaly
var requestCounter = 0;
and then
function ajax_update() {
var ajaxRequest = createXMLHttpRequestObject();
//after calling request.open();
requestCounter++;
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState != 4){
requestCounter--;
//error code here
}
if(ajaxRequest.readyState == 4){
//process JSON data
requestCounter--;
}
if (requestCounter == 0)
onAllRequestComplete();
}
}
function onAllRequestComplete(){
// code that have to run when all requests have been completed
}
hope that help.