Explore our sites

Stack Exchange
tour help
Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

Basically, I'm trying to call a Javascript function inside a PHP script when using Ajax.

JavaScript:

<script type="text/javascript">
    function Validate() {
        hr = new XMLHttpRequest();
        name = document.getElementById('name').value;

        hr.open('POST', 'validator.php', true);
        hr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

        hr.onreadystatechange = function() {
            if ( hr.readyState == 4 && hr.status == 200 ) {
                document.getElementById('message').innerHTML = hr.responseText;
            }
        }
        hr.send('name=' + name);
    }

    function disable() {
        document.getElementById('message').innerHTML = '';
    }
</script>

HTML:

<div id="message"></div>
Name: <input type="text" id="name /">
<input type="button" onclick="Validate();" value="Validate" />

PHP: 

<?php    
   $name = $_POST['name'];    
   if ( !empty( $name ) ) {
       if ( $name == 'Tom' ) {
           echo "<script>alert('Hello Tom, Welcome Back')</script>";
       } else {
           echo 'You are not Tom';
       }
   } else {
       echo 'Please enter a name.';
   }
?>

Everything works fine except calling the Javascript function inside PHP echo <script>alert()</script>

What I think the problem here is because I declared hr.responseText, as a result, the javascript I want to show has returned into text. But what should I do to solve this problem?

Any help would be appreciated.

share|improve this question
add comment

3 Answers

up vote 0 down vote accepted

Try changing your echo from "<script>alert('Hello Tom, Welcome Back')</script>";

to just 'Hello Tom, Welcome Back';

Then in your javascript you can call alert(hr.responseText);

You will have to change your javascript to check for what is returned so you know to call either the alert or the document.getElementById('message').innerHTML = hr.responseText;

EDIT: I will add all the changed code...

<?php

$name = $_POST['name'];

if(!empty($name)){
  if($name == 'Tom'){
   echo 'Hello Tom, Welcome Back';
}else{
    echo 'You are not Tom';
}
}else{
  echo 'Please enter a name.';
}
 ?>

Javascript

<script type="text/javascript">
function Validate(){
   hr = new XMLHttpRequest();
   name = document.getElementById('name').value;

hr.open('POST', 'validator.php', true);
hr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

hr.onreadystatechange = function(){
  if(hr.readyState == 4 && hr.status == 200){
   response = hr.responseText.replace(/^\s+|\s+$/g,'');  //remove whitespace so you can compare
   if (response == ("You are not Tom") || response == ("Please enter a name."))
     {
     document.getElementById('message').innerHTML = hr.responseText;
     }
     else {  
       alert(hr.responseText);
    }
    }
}
hr.send('name=' + name);
}

function disable(){
   document.getElementById('message').innerHTML = '';
}
</script>
share|improve this answer
 
Thanks! I actually figured it out myself! Instead of response == ('You are not Tom'), I simply echo 'ok' when $name=='Tom' in PHP, then in Javascript if(hr.response == 'ok') then execute alert() –  Thelma Eckman Aug 9 at 3:02
 
very good idea! –  user2250892 Aug 9 at 3:12
add comment
up vote 0 down vote

Try this:

   function do_alert($msg){
            echo '<script type="text/javascript">alert("' . $msg . '"); </script>';
   }
   if(!empty($name)){
         if($name == 'Tom'){
             do_alert("You are tom");
          }else{
             do_alert("You are not tom");
          }
  }else{
         echo 'Please enter a name.';
   }
share|improve this answer
 
This don't work, only 'Please enter a name' has returned when nothing is entered. –  Thelma Eckman Aug 9 at 0:33
 
nothing is entered ? you mean $name is empty? because if that is the case then it will probably echo that because nothing is entered right? –  Leonard Drapeza Aug 9 at 0:36
 
yes, when $name is empty. But when $name == 'Tom' the alert won't show up –  Thelma Eckman Aug 9 at 0:38
 
It's not working for me either. you could try to validate it inside your function validate if you want to. –  Leonard Drapeza Aug 9 at 1:02
add comment
up vote 0 down vote

You didn't tag jQuery, but if you are using it, $.getScript might be what you want.

Aside from that, it might be better to build the script into your original document, and then execute this or that function based on the response text.

share|improve this answer
 
but I would like all validation to be done on server side, since it's more secured? Edited: I believe I didn't use any jQuery here :/? –  Thelma Eckman Aug 9 at 0:35
 
The way I imagine it, it still would be. Your response would be different; the validation would be the same. What happens on the client would be the way you handle the response. –  user2625787 Aug 9 at 0:38
 
OK, forget jQuery. ;-) –  user2625787 Aug 9 at 0:39
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.