StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>As some of the answers say, you could avoid using a form.</p> <p>Here's an approach to achieve what you want, by responding JSON from the server.</p> <p>The HTML:</p> <pre><code><div id="myform" name="myform"> Name : <input type="text" name="name" id="name"/> <br /> Suffix : <input type="text" name="suffix" id="suffix"/> <br /> <button id="Submit" type="button">thanks</button> </div> </code></pre> <p>I turned the <code>form</code> tag into a <code>div</code>, and the <code>submit</code> tag into a <code>button</code>.</p> <p>The Javascript:</p> <pre><code><script> $(function() { // The url where the data will be submitted to var url = '/submit/url'; $('#Submit').on('click', function() { $.ajax({ url: url, // Take values from form inputs data: { name: $('#name').val(), suffix: $('#suffix').val() } }).done(function(r){ if (r.success) { // success. // hide form container, alert email. $('#myform').hide(); alert(r.email); } else { // else, there was an error alert(r.error); } }); } }); </script> </code></pre> <p>Upon clicking the button, an Ajax request will be executed and when done, the JSON response will be analyzed.</p> <p>Finally, the PHP:</p> <pre><code><?php require_once("config.php"); // db connection $name = $_POST['name']; $suffix = $_POST['suffix']; if (empty($suffix) || empty($name)) { $resp = array('error' => "All input are needed"); // this error } elseif ($name == 'john') { $resp = array('error' => "sorry john not here"); // this error } else { $qry="select * from users where username='$name'"; $result=mysql_query($qry) or die($qry); $line=mysql_fetch_array($result); // this success $resp = array( 'success' => true, 'email' => $line['email'] ); } // Set content type to JSON and output the array, JSON-encoded. header('Content-type: application/json'); echo json_encode($resp); </code></pre> <p>The request will output a JSON object that can contain as much data as you want, that can be easily analyzed in Javascript.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload