7 replies
Ho do I submit a form using POST without a page refresh. I only know how to send variables to a new page. I just want a user to select their desired shirt color and have the prices for their selected shirt be outputted without a page refresh. Is there a good jquery plugin I could use? Thanks in advance.

PHP Code:
<form method="post" >
                      <
select name="color">
                      <
option value="" selected>Desired Shirt Color</option>
                        <
option value="blue">Bad Condition</option>
                        <
option value="green">Good Condition</option>
                      </
select><br><a href="#">Get Your Shirt Now!</a
                    </
form>

$shirt_color $_POST["color"];
   switch (
$shirt_color){
    case 
"blue":
        
$price_small "$100";
        
$price_large "$200";
        break;
   case 
"green":
        
$price_small "$120";
        
$price_large "$220";
        break;

#php
  • Profile picture of the author automaton
    What is missing is the submit button

    Code:
    <input type="submit" name="mysubmit" value="Click!" />
    and the destination script to where the POST variables are sent:

    Code:
    <form name="input" action="script_here.php" method="post">
    {{ DiscussionBoard.errors[5461458].message }}
    • Profile picture of the author brandon2664
      If I already included script_here.php into the top of the page like this
      PHP Code:
      include 'script_here.php'
      Would it still be necessary to set the action to
      PHP Code:
      action="script_here.php" 
      {{ DiscussionBoard.errors[5462863].message }}
  • Profile picture of the author xrvel
    You should use AJAX. I suggest you to take a look on jquery documentation.
    {{ DiscussionBoard.errors[5462363].message }}
  • Profile picture of the author developeroncall
    Yes. Absolutely. The 'action' tells the browser where to send the form values. You could leave the action blank and it would submit the values to the form (script) that the form is on (that page) so - including the file at the beginning of the form script you could get to work properly - but the simplest thing to do is set the action value to the script you want to process the form with.

    D
    {{ DiscussionBoard.errors[5463246].message }}
  • Profile picture of the author SteveJohnson
    JQuery has a lot of AJAX tools built-in, and it's relatively easy to use. This: Ajax – jQuery API is the best place to start learning how.

    In a nutshell, your script 'listens' (through a jQuery event handler) for a change to a specific form field, gathers the data and sends it to a web address. It then puts the results in a specific container in the web page.

    It really is pretty easy once you grasp the basic concepts of how it works.
    Signature

    The 2nd Amendment, 1789 - The Original Homeland Security.

    Gun control means never having to say, "I missed you."

    {{ DiscussionBoard.errors[5463727].message }}
  • Profile picture of the author Tkato
    load jquery into your HTML and then read this page
    api.jquery.com/jQuery.post

    There's an example in the bottom, the idea is that you submit data to an script and then the script returns a response that is handled by jquery allowing not to abandone the current page
    {{ DiscussionBoard.errors[5464088].message }}
  • Profile picture of the author Tousen
    Use AJAX, it helped me.
    {{ DiscussionBoard.errors[5464715].message }}

Trending Topics