javascript - Refresh SPAN content automatically -

-

i'm stuck in problem here tried google answers , nothing did work out. specially because prefer pure javascript solution if possible... have menu, cart. menu shows like: cart (0) 0 number of items inside cart. items number query sql table 'cart', save users products added cart. don't lose items on cart when session closes. want update menu span everytime add inside cart, without need refresh page. items being added way:

in table products displayed have:

<td id="add'.htmlspecialchars($row['id'], ent_quotes, 'utf-8').'"> <label><a href="javascript:addtocart('.htmlspecialchars($row['id'], ent_quotes, 'utf-8').')"><b><img src="/img/cart.gif" /></b></a></label> </td>

so call javascript:addtocart passing 'id' of product parameter. function does:

function addtocart(id) {     document.getelementbyid('add'+id).innerhtml='<b>on cart!</b>';     load('/index.php?addtocart&id='+id); }

ok, function load does:

function load(url) { var xmlhttp;  if (window.xmlhttprequest) {     // code ie7+, firefox, chrome, opera, safari     xmlhttp = new xmlhttprequest(); } else {     // code ie6, ie5     xmlhttp = new activexobject('microsoft.xmlhttp'); }  xmlhttp.onreadystatechange = function() {     if (xmlhttp.readystate == 4 && xmlhttp.status == 200) {         eval( xmlhttp.responsetext );     } }  xmlhttp.open('get', url, true); xmlhttp.send(); }

ok, have index.php receiving id of product add cart, , on index.php:

if (isset($_get['addtocart']) && isset($_get['id'])) {     $id = mysql_real_escape_string($_get['id']);     mysql_query("insert cart values('$id', '$userid')");            }

this working well, , if refresh page, in menu "your cart (1)"... how refresh automatically when client clicks on table? possible pure javascript function?

//edit index.php content:

<?php     include("./includes/header.php");     include("./includes/db.php"); ?> <html> <head>     <link rel="stylesheet" href="./css/style.css">     <title>myshop</title>     <script type="text/javascript">      function load(url) {     var xmlhttp;      if (window.xmlhttprequest) {         // code ie7+, firefox, chrome, opera, safari         xmlhttp = new xmlhttprequest();     } else {         // code ie6, ie5         xmlhttp = new activexobject('microsoft.xmlhttp');     }      xmlhttp.onreadystatechange = function() {         if (xmlhttp.readystate == 4 && xmlhttp.status == 200) {            document.getelementbyid('cart').innerhtml = xmlhttp.responsetext;         }     }      xmlhttp.open('get', url, true);     xmlhttp.send();     }      function addtocart(id)     {         document.getelementbyid('add'+id).innerhtml='<b>on cart!</b>';         load('/index.php?addtocart&id='+id);     }     </script> </head> <body id="home">     <?php include 'menu.php'; ?>     <div id="container">         <?php              if (isset($_get['news']))             {                 include 'news.php';                      }             else if (isset($_get['orders']))             {                 include 'orders.php';                        }             else if (isset($_get['addtocart']) && isset($_get['id']))             {                 $id = mysql_real_escape_string($_get['id']);                 mysql_query("insert cart values('$id', '$userid')");                        }         ?>     </div> </body> </html>

from index.php page, return number of products inserted current user , use success handler of ajax call update span.

xmlhttp.onreadystatechange = function() {     if (xmlhttp.readystate == 4 && xmlhttp.status == 200) {         // here number of products inserted , display in span         document.getelementbyid('span_id').innerhtml = xmlhttp.responsetext;     } }

edit

do not make ajax call same page. have id sent other page, let's abc.php. keep php related code inside update_cart_ajax.php page.

so addtocart() becomes:

function addtocart(id) {     document.getelementbyid('add'+id).innerhtml='<b>on cart!</b>';     load('/update_cart_ajax.php?addtocart&id='+id); }

update_cart_ajax.php

<?php           include("./includes/db.php"); if (isset($_get['addtocart']) && isset($_get['id'])) {    $id = mysql_real_escape_string($_get['id']);    mysql_query("insert cart values('$id', '$userid')");            } else {     echo 0;     exit; } // number of products added cart current user $total_products_in_cart = <value returned db>; echo $total_products_in_cart; exit;

Comments

Post a Comment

Popular posts from this blog

c++ - OpenCV Error: Assertion failed <scn == 3 ::scn == 4> in unknown function, -

-
i read alot other solution still confused should mine... #include <opencv2/objdetect/objdetect.hpp> #include <opencv2/highgui/highgui.hpp> #include <opencv2/imgproc/imgproc.hpp> #include <iostream> #include <stdio.h> using namespace std; using namespace cv; int main(int argc, const char** argv) { //create cascade classifier object used face detection cascadeclassifier face_cascade; //use haarcascade_frontalface_alt.xml library face_cascade.load("haarcascade_frontalface_alt.xml"); //setup video capture device , link first capture device videocapture capturedevice; capturedevice.open(0); //setup image files used in capture process mat captureframe; mat grayscaleframe; //create window present results namedwindow("outputcapture", 1); //create loop capture , find faces while (true) { //capture new image frame capturedevice >> captureframe; ...
Read more

php - render data via PDO::FETCH_FUNC vs loop -

-
i've been using 2 methods render data. the first one: function name($id,$name){ return '<div id="'.$id.'">'.$name.'</div>'; } echo implode($pdo->query("select id,name user")->fetchall(pdo::fetch_func,'name')); the second one: $users = $pdo->query("select id,name user")->fetchall(pdo::fetch_obj); foreach($users $user){ echo name($user->id,$user->name); } i don't understand how pdo::fetch_func works. tried figure out. however, not well-documented. could please explain fetch mode? , also, 1 performs better? thank you. both methods wrong , have learn how use templates , how separate business logic presentation logic. $users = $pdo->query("select id,name user")->fetchall(pdo::fetch_obj); tpl::assign('users', $users); is code business logic part. then in template <?php foreach $users $row): ?> <div id="<?=$...
Read more

The canvas has been tainted by cross-origin data in chrome only -

-
uncaught securityerror: failed execute 'getimagedata' on 'canvasrenderingcontext2d': canvas has been tainted cross-origin data i getting above error in chrome. code(following) works fine in mozilla. have not corss domain issue. why above error in chrome? var wheel_canvas, wheel_context, can_w, can_h, wheel_grd; var large_radius = 160; var small_radius = 120; var wheel_canvas = document.getelementbyid('wheel_canvas'); var wheel_context = wheel_canvas.getcontext('2d'); var can_w = $(wheel_canvas).width(); var can_h = $(wheel_canvas).height(); var centerx = can_w / 2, centery = can_h / 2; var wheel_grd = null; test('#ff0000'); function test(hex) { $('#clrpicker').css({'left': 210, 'top': 210 }); inverted = hexbw(hex); $('#color_val_show').val(hex); current_color_hex_val_selected = hex; $('#color_val_show').css({'color':inverted,'background':hex}); fillgradient...
Read more