CODEWITHSUNDEEP
javascripthtmlajaxxmlhttprequest
JLearner
JLearner

Reputation: 1311

Getting data from xmlhttp.responseText

I'm been trying on getting the xmlhttp.responseText after calling out the function as i wish to do some show and hide objects. But it seems that I cant match the innerhtml and show the object like button.

Updated Javascript function:

function ShowHideDisplay(str)
{
   xmlhttp = new XMLHttpRequest();
   //It will echo whatever message into this response.text.
   if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
   {
   document.getElementById("validate").innerHTML = xmlhttp.responseText;
   }
   //Using test
   var successText = "<img src=\"./images/success.gif\" alt=\"Correct!\">Can be used";
   document.getElementById("validate").innerHTML = responseText;
   if(document.getElementById("validate").innerHTML.test(/success/gmi))
   {
       document.getElementById("submit").style.visibility = 'visible';
   }
   else
   {
       document.getElementById("submit").style.visibility = 'hidden';
   }
}

HTML Form:

 <input name="Numbers" type="text" id="Numbers" onkeyup="ShowHideDisplay(this);" value=""/>
 <span id="validate"></span>
 //wants to hide and show upon onkeyup and getting the span id of validate.innerhtml success message
 <input name="submit" id="submit" type="submit">

I just need to get the span id of the validate value or innerhtml text to show and hide the button. But i try different ways yet it cant match the innerhtml text. Kindly advise.

Upvotes: 0

Views: 6612

Answers (1)

Split Your Infinity
Split Your Infinity

Reputation: 4229

I created a Fiddle that probably does what you want.

The HTML

<input id="submit" type="submit" />
<span id="validate"></span>​

The JavaScript

/* Success */
var responseText = "<img src=\"./images/success.gif\" alt=\"Correct!\">Can be used";

/* Failure */
//var responseText = "<img src=\"./images/Failed.gif\" alt=\"Incorrect!\">Can not be used";

/* Assign content */    
document.getElementById("validate").innerHTML = responseText || "";

/* Change visibility based on outcome (success or not) */    
if(document.getElementById("validate").innerHTML.test(/success/gmi)) {
  document.getElementById("submit").style.visibility = 'visible';
} else {

    document.getElementById("submit").style.visibility = 'hidden';
}​

Test with a regular expression if the word 'success' was in the result or not. This way it doesn't really matter what the HTML in the response is.

Note There is no <success\> element in HTML, use a span or div with class success.

PS. If you can you should only return the word true or false or success or failure instead of HTML and render the text plus image on the client.

Upvotes: 1

Related Questions