Skip to main content
safo2000
safo2000
Participant
March 22, 2019
Question

Question PHP and coldfusion

  • March 22, 2019
  • 1 reply
  • 1540 views

hi guys,

quick question,

if i call a php file from ajax within javascript in coldfusion will it work without installing anything?

if yes, how come the below is giving me "method not allowed"

test.cfm

<!doctype html>

<html>

<head>

</head>

<body>

<h1>Take screenshot of webpage with html2canvas</h1>

<input type='button' id='but_screenshot' value='save screenshot' onclick='exportAndSaveCanvas();'><br/>

<script type="text/javascript" src="SCRIPTS/jquery-2.1.0.min.js"></script>

<!-- Script -->

<script type='text/javascript'>

function exportAndSaveCanvas() {

try

{

// AJAX request

$.ajax({

type: 'POST',

url: 'export.php',

success: function(data){

alert('Upload successfully');

},

error: function(XMLHttpRequest, textStatus, errorThrown) {

alert("Status: " + textStatus+ "\nError: " + errorThrown);

}

}); //ajax

}

catch(err)

{

alert(err.message);

return 'err';

}

} // End exportAndSaveCanvas()

</script>

</body>

</html>

export.php

<?php

$message = "in php";

echo "<script type='text/javascript'>alert('$message');</script>";

?>

This topic has been closed for replies.

1 reply

sinious
sinious
Legend
March 28, 2019

There are a number of JavaScript issues going on here but I'm assuming you are excluding a bunch of code for brevity.

Aside all the missing code, the two items that stand out here are the response export.php is sending along with not setting any headers for the content type you are handling, sending or receiving.

Sticking with the receiving part since you are not sending any data, export.php is sending back a <script> trying to alert a value. It could just as easily send the value and the .success() portion of the AJAX request could handle that. e.g.:

export.php

header("Content-Type: text/plain");

echo "in php";

The POST request will receive that header and know how to handle the data:

test.cfm

var request = $.ajax( "export.php" );

request.done(function(data) { alert(data); }); // success, compatible with jQ 3.x+

request.fail(function( jqXHR, statusText ) { alert('Error: ' + statusText); }); // error, compatible with jQ 3.x+

Finally your try/catch has a return on the catch, "return err;". It's not inside a function so it has no place to return anything. You're also going after err.message which it's more useful to just alert(err) and not a specific property.

Overall to get better feedback on what is going on, open your browsers developer panel (different way in each browser but for example in Chrome it's Triple Dot->More Tools->Developer Tools or CTRL+SHIFT+i on Windows for example). Inside this panel you can easily inspect values, better than alert(). There are a bunch of tabs across the top of the panel with different tools such as Elements, Sources, Console (where I'm referring to), etc..

If you open up Developer Tools and select the Console option, using the JS function console.log(anything) will output whatever you drop inside it into your console. Much better, complex objects, properties and values can be examined far easier than alert(). You can also type code directly in the console to give it a try, e.g. console.log(window);

Try to use that on all the errors, data returned, data being sent, etc. It should help you diagnose things far easier.

safo2000
safo2000Author
Participant
March 29, 2019

hello again,

your tips were great , i stripped down the code even further, but i am still having an error

(i am using CF8, ie11)

export.php

<?php

header("Content-Type: text/plain");

echo "in php";

?>

test.cfm

<!doctype html>

<html>

<head>

</head>

<body>

  <h1>hello world</h1>

  <input type='button' id='but_screenshot' value='save screenshot' onclick='exportAndSaveCanvas();'><br/>

    <script type="text/javascript" src="SCRIPTS/jquery-2.1.0.min.js"></script>

  <!-- Script -->

  <script type='text/javascript'>

 

  function exportAndSaveCanvas()  {

   

         // AJAX request

         var request = $.ajax( "export.php" );

request.done(function(data) { alert(data); }); // success, compatible with jQ 3.x+

request.fail(function( jqXHR, statusText ) { alert('Ajax Error: ' + statusText); }); // error, compatible with jQ 3.x+//ajax

    } // End exportAndSaveCanvas()

  </script>

</body>

</html>

sinious
sinious
Legend
March 29, 2019

Are you getting the same error?

Use the "Network" panel inside the Developer Tools. It might seem a little complicated at first but it's straight forward. Find your AJAX request and examine the request and response. Since this is on the same domain (that I know of) there probably won't be a call for "OPTIONS" which returns the available request types (GET, POST, PUT, DELETE, etc).

Try changing the method you're using to GET and see if you get that error. e.g:

// GET request

$.get("export.php", function( data ) {

     alert( 'success: ' + data );

     console.log( 'success: ' + data ); // please also do this and examine it

})

.fail( function( err ) {

     alert( 'err: ' + err )

     console.log( 'err ' + err ); // please also do this and examine it especially

});

The alert() function may receive a complex object and it's not able to display it. If it is a simple success then you have no further investigation to do. If not, checking headers like mentioned above and also looking at the value in the console will give you better debugging tools to find the problem here.

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices