sent data from php to HTML page

Question

I've designed an HTML form to find the GPA , I want to ask the user to enter the mark, and pushing on "submit" button which sending marks to php Class in other page in the same project, the class should process the mark and find GPA , and then send GPA to the same HTML form and print it in a text box ;

i used submit button to go to PHP class.

this is the form's tag which i used

<form method="post" action="GPA.PHP">

After processing the data in php class, i want to send the result to html and put them into a text, this text :

<input type="text" style="text-align:center;" value="0.0" name="GPA" /> 

how can i do this ??

Answer 1

First, give an id to the input, eg :

<input type="text" style="text-align:center;" value="0.0" name="GPA" id="result" /> 

Second, make sure that the form isn't submitted with its regular behaviour, by returning false on submit:

<form method="post" action="GPA.PHP" onSubmit="return false;">

And third, you may call the following javascript code when the submit button is clicked or whe the form is submitted:

$.ajax({
  type: "POST",
  url: "gpa.php",
  data: { mark: "50" }
}).done(function( msg ) {
  $('#result').val(msg);
});

I hope it works :)

Answer 2

I think I understand what you're saying. What you want to do is use ajax: http://api.jquery.com/jQuery.ajax/

$.ajax({
  type: "POST",
  url: "gpa.php",
  data: { mark: "50" }
}).done(function( msg ) {
  $('div.gpa').html(msg);
});

So Post the students score (lets say they got 50 for this example) to gpa.php. On the gpa.php you would have you code to calculate the gpa and the send it back as msg. This would then output the gpa to the div id of gpa.