Javascript POST not working – Sending Javascript array to PHP

by

You have a misunderstanding about how ajax works. Although jquery makes it easy, it is still not automatic. You should just find a tutorial about ajax with jquery, but if you want to just send an array to php and see the output on screen, something like this would work:

index.php

<html>
<head>
<title>Test</title>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    //attach to the button a click event
    $('#btn').click(function(){
            //get the value from the textbox
        var txt=$('#txt').val();
            //if txt is blank, alert an error
        if(txt == ''){
            alert("Enter some text");
        } else {
                    //send txt to the server
                    //notice the function at the end. this gets called after the data has been sent
            $.post('catcher.php', {'text':txt}, function(data){
                            //now data is an object, so put the message in the div
                $('#response').text(data.message);
            }, 'json');
        }
    });
});
</script>
</head>
<body>
<input type="text" id="txt">
<input type="button" id="btn">
<pre id="response" style="overflow:auto;width:800px;height:600px;margin:0 auto;border:1px solid black;">&nbsp;</pre>
</body>
</html>

catcher.php:

<?php
//if something was posted
if(!empty($_POST)){
    //start an output var
    $output = array();

    //do any processing here.
    $output['message'] = "Success!";

    //send the output back to the client
    echo json_encode($output);
}

It is better to use 2 files, one for the user to load that initiates the ajax call and one page to handle the ajax call. Sending an array works the same, just replace getting the textbox value with sending an array.

More Related Contents:

  1. How do I post multiple parameters to a URL
  2. Pass data from jQuery to PHP for an ajax post
  3. When do I use PHP_EOL instead of \n and vice-versa ? Ajax/Jquery client problem
  4. Jquery AJAX post to PHP
  5. How do I run ajax request in background continuously?
  6. Tagging systems [closed]
  7. How to use this code my wordpress theme
  8. how to do file upload using jquery serialization
  9. How to get the jQuery $.ajax error response text?
  10. How to upload multiple files using PHP, jQuery and AJAX
  11. Get response from PHP file using AJAX
  12. Ajax LARAVEL 419 POST error
  13. How to populate second dropdown based on selection of first dropdown using jQuery/AJAX and PHP/MySQL?
  14. Jquery/Ajax Form Submission (enctype=”multipart/form-data” ). Why does ‘contentType:False’ cause undefined index in PHP?
  15. Upload Multiple Files with PHP and JQuery
  16. jQuery ajax request with json response, how to?
  17. jQuery AJAX form using mail() PHP script sends email, but POST data from HTML form is undefined
  18. Passing Javascript Variable to PHP using Ajax
  19. Ajax post request in laravel 5 return error 500 (Internal Server Error)
  20. Inserting into MySQL from PHP (jQuery/AJAX)
  21. Retrieve JSON POST data in CodeIgniter
  22. Jquery – Uncaught TypeError: Cannot use ‘in’ operator to search for ‘324’ in
  23. Jquery ajax setTimeout after form succes not redirecting?
  24. Ajax call with contentType: ‘application/json’ not working
  25. jQuery Ajax passing value on php same page
  26. How to rotate image and save the image
  27. Cross Domain Ajax Request with JQuery/PHP
  28. Ajaxify header cart items count in Woocommerce
  29. show progressbar while loading pages using jquery ajax in single page website
  30. How to send the values of an array of checkboxes through Ajax using jQuery?

Leave a Comment