onchange cannot use? - javascript

function gettime(str) {
var strURL="/Doctor/booking/gettime.jsp?datepicker="+str;
var req = getXMLHTTP();
if (req) {
req.onreadystatechange = function() {
if (req.readyState == 4) {
// only if "OK"
if (req.status == 200) {
document.getElementById('d11').innerHTML=req.responseText;
} else {
alert("There was a problem while using XMLHTTP:\n" + req.statusText);
}
}
}
req.open("GET", strURL, true);
req.send(null);
}
}
<b>Date:<input id="d11" type="text" name="datepicker" onClick="WdatePicker()" onchange="gettime(this.value)"/></b>
When I click the textbox, alert a datepicker and choose a date, the textbox should change its value. But it doesn't. What way can I solve it?
Moreover, when I directly enter this url: /Doctor/booking/gettime.jsp?datepicker=2012-02-02 I see the output that I want.

instead of:
document.getElementById('d11').innerHTML=req.responseText;
try:
document.getElementById('d11').value=req.responseText;

Related

xmlhttprequest responsetext is null

I'm trying to make basic HTML Server connection, therfore I want to call and JS function which should call an PHP file just schoing "hello world". Everything is working so far but the response I get seems to be null.
I've read through various tutorials but I did not find an answer, hope someone can help me.
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState == XMLHttpRequest.DONE && xhttp.status==200 && xhttp.responseText!=null) {
alert("Responestext: " + xhttp.responseText + " ENDE");
}else if(xhttp.status==403){
alert("forbidden");
}else if(xhttp.status==404){
alert("not found");
}else if(xhttp.responseText==null) {
alert("response text = null");
}else{
alert("Error");
}
};
xhttp.open("GET", "http://URL/fahrgemeinschaft/login.php", true);
xhttp.send(null);
I expect the output to be "Responsetext: hello world ENDE" but all I get is "Error".
I get two alert boxes saying "Error" as well.
The problem is your onreadystatechange handler is called for every ready state change event, not just when it is done.
You should skip the events that are not done:
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState != XMLHttpRequest.DONE) {
return;
}
if (xhttp.status==200 && xhttp.responseText!=null) {
alert("Responestext: " + xhttp.responseText + " ENDE");
}else if(xhttp.status==403){
alert("forbidden");
}else if(xhttp.status==404){
alert("not found");
}else if(xhttp.responseText==null) {
alert("response text = null");
}else{
alert("Error");
}
};
xhttp.open("GET", "http://messenger.hopto.org:8080/fahrgemeinschaft/login.php", true);
xhttp.send(null);
Or to make it easier on yourself, so long as you don't need to support obsolete browsers, just use the onload event.
var xhttp = new XMLHttpRequest();
xhttp.onload = function() {
if (xhttp.status==200 && xhttp.responseText!=null) {
alert("Responestext: " + xhttp.responseText + " ENDE");
}else if(xhttp.status==403){
alert("forbidden");
}else if(xhttp.status==404){
alert("not found");
}else if(xhttp.responseText==null) {
alert("response text = null");
}else{
alert("Error");
}
};
xhttp.open("GET", "http://messenger.hopto.org:8080/fahrgemeinschaft/login.php", true);
xhttp.send(null);

changing the text of a button in ajax

I Have list confirmation buttons generated dynamically using PHP.When I click a button i want it change to "approved".But it is not doing so?Nothing changes though the query is submitted successfully.Any help please.Here is my js code snippet:
function appr ($ref) {
var job_id= $ref;
var resp;
var buttons=$('.confirm');
buttons.click(function(){
var $this=$(this);
$this.text=('approved');
});
if (window.XMLHttpRequest) {
resp = new XMLHttpRequest();
} else if (window.ActiveXObject) {
resp = new ActiveXObject("Microsoft.XMLHTTP");
}
var data = "job_id="+job_id
resp.open("POST",
"approve.php",
true);
resp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
resp.send(data);
resp.onreadystatechange = display_data;
function display_data() {
if (resp.readyState == 4) {
if (resp.status == 200) {
document.getElementById("myDiv").innerHTML=resp.responseText;
} else {
alert('Request not successful.');
}
}
}
}
you can do it like that
$this.html("approved");

how to fix startWith not working in chrome

I am checking some date whether available or not from DB using Ajax using below my code,
var url = "ValidateDateFromDB.jsp?cdate="+selecteddate.value;
if (window.XMLHttpRequest)
req = new XMLHttpRequest();
else if (window.ActiveXObject)
req = new ActiveXObject("Microsoft.XMLHTTP");
req.open("GET", url, true);
req.onreadystatechange =callback;
req.send(null);
function callback()
{
if (req.readyState == 4)
{
if (req.status == 200)
{
var message = req.responseText;
alert(message);
if(message.startsWith("Available"))
{
alert("Availabe");
}
else
{
alert("Not Availabe");
}
}
}
}
I am getting output like below image,
It is working fine in firefox but not working in chrome.I checked out that startsWith works only chrome above 40 version.So to fix this i used == operation like below,
if(message=="Available")
{
alert("Availabe");
}
else
{
alert("Not Availabe");
}
But this code always goes to else part that i know why.
someone tell me how to fix this?

How to resolve the conflict two ajax request at a same time

I have one nominal.jsp page,which includes header.jsp.Here i am using Ajax for the first time, for the request in header.jsp,then for the second time Ajax request is called to the nominal.jsp,i am facing the conflict issue in the Ajax request. Because of this issue,my preferred drop-down list is not displayed. Sometimes when response is entered in the JavaScript, the drop-downs are displayed and if the response are not entered in the JavaScript, the drop-downs are not displayed. Tried my level best to resolve the issue, but could not resolve it. Please help me guys
thank u,
My header.jsp code:
<script>
headerDisplay();
function headerDisplay()
{ var url ='<%=request.getContextPath()%>/summary?operation=header';
transactionRequest(url);
}
function transactionRequest(url)
{
if (window.XMLHttpRequest)
{
req = new XMLHttpRequest();
req.onreadystatechange = transactionResponse;
try
{
req.open("POST", url, true); //was get
}
catch(e)
{
alert("Problem Communicating with Server\n"+e);
}
req.send(null);
}
else if (window.ActiveXObject)
{
// IE
req = new ActiveXObject("Microsoft.XMLHTTP");
if (req)
{
req.onreadystatechange = transactionResponse;
req.open("POST", url, true);
req.send();
}
}
}
function transactionResponse()
{
if (req.readyState == 4) // Complete
{
if (req.status == 200) // OK response
{ var servletVal = req.responseText;
var myObject = eval('(' + servletVal + ')');
var userId = myObject.userId;
}}}......
</script>
And,this is my nono.jsp code:
<%#include file="/pages/common/header.jsp"%>
<script>
function displayNominal()
{
document.getElementById("ajaxLoading").style.display="block";
var url ='<%=request.getContextPath()%>'+'/nominalList';
postRequest(url);
}
function postRequest(url) {
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
req.onreadystatechange = nominalSelect;
try {
req.open("POST", url, true); //was get
} catch (e) {
alert("Problem Communicating with Server\n" + e);
}
req.send(null);
} else if (window.ActiveXObject) {
// IE
req = new ActiveXObject("Microsoft.XMLHTTP");
if (req) {
req.onreadystatechange = nominalSelect;
req.open("POST", url, true);
req.send();
}
}
}
function nominalSelect() {
if (req.readyState == 4) // Complete
{
if (req.status == 200) // OK response
{
var servletVal = req.responseText;
var myObject = eval('(' + servletVal + ')');
var userId = myObject.userId;
if (userId == null || userId == "") {
window.location = '/accounts1/?status=session';
}
}}..
</script>
<body class="bodystyle" onload="displayNominal()">
<% if("N".equals(roleDemoStatus))
{%>
<!-- /#demo Header -->
<div style="top: 0px; display: block;" id="header" class="fixed">
<div class="outer">
<h1 class="blog-title" style="text-align:center;margin-top:10px;"><span style="font-weight: normal; color:#777777; font-size: 30px;">accounts<font color="#5DA915">1</font>.co</span> Demo Only - <font color="red">Click Here</font> To Use For Free Forever</h1>
</div><!-- .outer -->
<div style="display: block;" class="shadow"></div>
</div>
<!-- /#Demo Header -->
<%} %>
</body>
Again thanks for advance.
Use a single callback and a try/catch block to enforce the request order:
function transactionResponse()
{
// Check whether this is the initial callback or a subsequent one
if (!!transactionResponse.state)
{
try
{
//POST data from the GET request
}
catch(e)
{
//Get data from the GET request
}
}
// Set state after the initial callback reference
else
{
transactionResponse.state = this;
}
}
References
Long Polling Experiment

JavaScript data post

I am working in PHP I have created a page here I have 2 combo box when I select first combo box item the second one is filled according the first combobox using JavaScript the problem I am facing is where I am trying to save the data of second combo box in database I found null value. transition_party_id is the combobox that fill dynamically here I code
function getXMLHTTP() { //function to return the xml http object
var xmlhttp=false;
try{
xmlhttp=new XMLHttpRequest();
}
catch(e) {
try{
xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e){
try{
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e1){
xmlhttp=false;
}
}
}
return xmlhttp;
}
function getparty(category) {
var strURL="../admin/get_partyname.php?category="+category;
var req = getXMLHTTP();
if (req) {
req.onreadystatechange = function() {
if (req.readyState == 4) {
// only if "OK"
if (req.status == 200) {
document.getElementById('partydiv').innerHTML=req.responseText;
} else {
alert("There was a problem while using XMLHTTP:\n" + req.statusText);
}
}
}
req.open("GET", strURL, true);
req.send(null);
}
}
req.open("GET", strURL, true);
req.send(null);
You send 'null' post data by "GET" method.
Or you waiting data in get?

Categories