最新消息:Welcome to the puzzle paradise for programmers! Here, a well-designed puzzle awaits you. From code logic puzzles to algorithmic challenges, each level is closely centered on the programmer's expertise and skills. Whether you're a novice programmer or an experienced tech guru, you'll find your own challenges on this site. In the process of solving puzzles, you can not only exercise your thinking skills, but also deepen your understanding and application of programming knowledge. Come to start this puzzle journey full of wisdom and challenges, with many programmers to compete with each other and show your programming wisdom! Translated with DeepL.com (free version)

javascript - How to get and pass data from html to php using ajax - Stack Overflow

matteradmin4PV0评论

Hi I would love to know how can I pass the strings from a form to a php that will test if there is something in it and then post an alert message using this form to try and get data from it and then show if it was passed correctly.

HTML code:

<form action='' method=''>
Name:<input type='text' name='name' id='name'>
Age:<input type='text' name='age' id='age'>
message:<textarea name='message' id='message'></textarea>
<input type='submit' value='Send'>
</form>

Output:

<?php
if(isset($_POST['name']) && isset($_POST['age']) && isset($_POST['message'])){

$a = $_POST['name'];
$b = $_POST['age'];
$c = $_POST['message'];

   if($a != NULL && $b != NULL && $c != NULL)
       {
         echo "
                <script type='text/javascript'>
                window.alert('Success'+ a + b + c)
                </script>
              ";
        }


};?>

While still in the same page from before but shows what I have typed in there into the alert box.

I would also appreciate if it es with instruction on how to use it with get and post functions and also with links if it can be done?

Hi I would love to know how can I pass the strings from a form to a php that will test if there is something in it and then post an alert message using this form to try and get data from it and then show if it was passed correctly.

HTML code:

<form action='' method=''>
Name:<input type='text' name='name' id='name'>
Age:<input type='text' name='age' id='age'>
message:<textarea name='message' id='message'></textarea>
<input type='submit' value='Send'>
</form>

Output:

<?php
if(isset($_POST['name']) && isset($_POST['age']) && isset($_POST['message'])){

$a = $_POST['name'];
$b = $_POST['age'];
$c = $_POST['message'];

   if($a != NULL && $b != NULL && $c != NULL)
       {
         echo "
                <script type='text/javascript'>
                window.alert('Success'+ a + b + c)
                </script>
              ";
        }


};?>

While still in the same page from before but shows what I have typed in there into the alert box.

I would also appreciate if it es with instruction on how to use it with get and post functions and also with links if it can be done?

Share Improve this question edited Mar 7, 2013 at 5:42 rptwsthi 10.2k10 gold badges72 silver badges112 bronze badges asked Mar 7, 2013 at 5:40 user1868185user1868185 8993 gold badges9 silver badges25 bronze badges
Add a ment  | 

3 Answers 3

Reset to default 2

For an easy way you can Make following changes to your code:

HTML:

<form action='' method='' id="myform">
Name:<input type='text' name='name' id='name'>
Age:<input type='text' name='age' id='age'>
message:<textarea name='message' id='message'></textarea>
<input type='submit' value='Send'>
</form>

PHP:

(your_page_with_php_script)

<?php
if(isset($_POST['name']) && isset($_POST['age']) && isset($_POST['message'])){

$a = $_POST['name'];
$b = $_POST['age'];
$c = $_POST['message'];

   if($a != NULL && $b != NULL && $c != NULL)
   {
      echo "Success ".a." ".b." ".c;
   }


};
?>

Script: (Include jquery first)

$('#myform').submit(function(){

var name = $('#name').val();
var age = $('#age').val();
var message = $('#message').val();


$.ajax({
  type: "POST",
  url: "your_page_with_php_script.php",
  data: "name="+name+"&age="+age+"&message="+message,
}).done(function( msg ) {
  alert( "Data Saved: " + msg );
});

});

edit the following according to the need:

$.ajax({
  type: 'POST',
  url: 'your_php_page.php',
  data: { postVar1: 'theValue1', postVar2: 'theValue2' },
  beforeSend:function(){
    // this is where we append a loading image
    $('#ajax-panel').html('<div class="loading"><img src="/images/loading.gif" alt="Loading..." /></div>');
  },
  success:function(data){
    // successful request; do something with the data
    $('#ajax-panel').empty();
    $(data).find('item').each(function(i){
      $('#ajax-panel').append('<h4>' + $(this).find('title').text() + '</h4><p>' + $(this).find('link').text() + '</p>');
    });
  },
  error:function(){
    // failed request; give feedback to user
    $('#ajax-panel').html('<p class="error"><strong>Oops!</strong> Try that again in a few moments.</p>');
  }
});

The requesting page should have a div with id="ajax-panel"

You must use Jquery with Ajax...

<script>
$("#submit").click(function()
    {
       var name = $('#name').value();
       var age= $('#age').value();
       var message= $('#message').value();

        $.ajax({ 
            url: "urpage.php",
            data: {name : name, age : age, message : message},
            type: "POST",               
            success: function(output) {

               alert(output); //This will show ur output in an alert box
                   }                }
        })

    });
</script>

Hope this works

Post a comment

comment list (0)

  1. No comments so far