Databases
StackOverflow2013
Postsdbo
POclick counter in php using jquery
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POclick counter in php using jquery
    text
    copied!<p>I am new to JQuery and trying to create a counter which counts the number of clicks and updates the counter in the database by one. I have created a button, on click of that i am sending the counter's value to the database. and trying to get the updated count at my first page.</p> <p>my code is - </p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt; &lt;title&gt;Implementing counter&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"&gt; &lt;/script&gt; &lt;? session_start()?&gt; &lt;? ob_start()?&gt; &lt;? if($_SERVER['HTTP_HOST']=='localhost'){ $host="localhost"; $user="root"; $pass=""; $dbas="db_name"; mysql_connect($host,$user,$pass,$dbas); mysql_select_db($dbas); } ?&gt; &lt;script&gt; $(document).ready(function(){ $("#count").click(function(){ saveData(); $("#counter").load(); }); function saveData(){ $.ajax({ type: "POST", url: "counter.php", data: { count: "1"} }) .done(function( count ) { alert( "Counter Plus: " + count ); }) .fail(function() { alert( "error" ); }); } }); &lt;/script&gt; &lt;br /&gt; &lt;button id="count"&gt;Add Counter&lt;/button&gt;&lt;br&gt; &lt;div id="counter"&gt; &lt;? $fetch1=mysql_query("select `count` from user"); $fetch2=mysql_fetch_array($fetch1); $counter=$fetch2['count']; echo "You have ".$counter." Clicks"; ?&gt; &lt;/div&gt;&lt;br&gt;&lt;br&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>My <code>counter.php</code> looks like -</p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt; &lt;title&gt;Counter&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;? session_start()?&gt; &lt;? ob_start()?&gt; &lt;? if($_SERVER['HTTP_HOST']=='localhost'){ $host="localhost"; $user="root"; $pass=""; $dbas="db_name"; mysql_connect($host,$user,$pass,$dbas); mysql_select_db($dbas); } ?&gt; &lt;? if (isset($_POST['count'])) { // Form has been submitted. $count = $_POST['count']; $n=0; $fetch1=mysql_query("select `count` from user"); $fetch2=mysql_fetch_array($fetch1); $n1=$fetch2['count']; $n=$n1+$count; // INSERT THE DATA $query = "UPDATE user SET `count`='{$n}'"; // Confirm if the query is successful. $result = mysql_query($query); echo "Counter Updated by 1"; } ?&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>when i click the button, the counter.php is called, counter is updated, but my <code>&lt; div &gt;</code> is not updated. the counter.php page is shown as a dialog over my screen.</p> <p>My first page &amp; when i click the button, it looks like this - </p> <p><img src="https://i.stack.imgur.com/RYMBl.jpg" alt="first page looks like this"></p> <p><img src="https://i.stack.imgur.com/Owmpo.jpg" alt="when i click the button, it looks like this - "></p> <p>Tell me what is going wrong??</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