2016-04-11 16 views
0

私は無料でダウンロードした "Ustora"テンプレート(eコマース用のhtmlテーマ)で作業しています。同じ商品では、単一商品ページの[カートに追加]ボタンを使用して作業しています。クリックすると、製品データをデータベースのカートテーブルに挿入するajax関数が起動します。しかし、これは動作していません。ajaxがショッピングカートでクリックしていない

私はこれを電子商取引のウェブサイトを作る方法を学ぶために働いています。私のコードは以下の通りです。

シングル製品-page.php

   <?php 
       $row = mysql_fetch_row(mysql_query("SELECT * FROM `products` where pid='".$_GET['proid']."' ")); 
       echo '<div class="row"> 
        <div class="col-sm-6"> 
         <div class="product-images"> 
          <div class="product-main-img"> 
           <img src="'.$row[5].'" alt="'.$row[2].'"> 
          </div> 

          <div class="product-gallery"> 
           <img src="'.$row[5].'" alt="'.$row[2].'"> 
           <img src="'.$row[5].'" alt="'.$row[2].'"> 
           <img src="'.$row[5].'" alt="'.$row[2].'"> 
          </div> 
         </div> 
        </div> 

        <div class="col-sm-6"> 
         <div class="product-inner"> 
          <h2 class="product-name">'.$row[2].'</h2> 
          <div class="product-inner-price"> 
           <ins>'.$row[3].'/- INR</ins> <del>'.$row[3].'/- INR</del> 
          </div>  

          <form method="post"> 
           <div class="quantity"> 
            <input type="number" size="4" class="input-text qty text" title="Qty" value="1" name="quantity" id="qty" min="1" step="1" max='.$row[6].'> 
           </div> 
           <button class="add_to_cart_button" onclick="addtocart('.$row[1].','.$row[2].','.$row[3].','.$buid.');"> 
            Add to cart 
           </button> 
          </form> 

          <div class="product-inner-category"> 
           <p>Category: <a href="">Summer</a>. Tags: <a href="">awesome</a>, <a href="">best</a>, <a href="">sale</a>, <a href="">shoes</a>. </p> 
          </div> 

          <div role="tabpanel"> 
           <ul class="product-tab" role="tablist"> 
            <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Description</a></li> 
            <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Reviews</a></li> 
           </ul> 
           <div class="tab-content"> 
            <div role="tabpanel" class="tab-pane fade in active" id="home"> 
             <h2>Product Description</h2> 
             '.$row[4].' 
             </div> 
            <div role="tabpanel" class="tab-pane fade" id="profile"> 
             <h2>Reviews</h2> 
             <div class="submit-review"> 
              <p><label for="name">Name</label> <input name="name" type="text"></p> 
              <p><label for="email">Email</label> <input name="email" type="email"></p> 
              <div class="rating-chooser"> 
               <p>Your rating</p> 

               <div class="rating-wrap-post"> 
                <i class="fa fa-star"></i> 
                <i class="fa fa-star"></i> 
                <i class="fa fa-star"></i> 
                <i class="fa fa-star"></i> 
                <i class="fa fa-star"></i> 
               </div> 
              </div> 
              <p><label for="review">Your review</label> <textarea name="review" id="" cols="30" rows="10"></textarea></p> 
              <p><input type="submit" value="Submit"></p> 
             </div> 
            </div> 
           </div> 
          </div> 

         </div> 
        </div> 


       </div>'; 

       ?> 

header.phpの

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Product Page - Ustora Demo</title> 

    <!-- Google Fonts --> 
    <link href='http://fonts.googleapis.com/css?family=Titillium+Web:400,200,300,700,600' rel='stylesheet' type='text/css'> 
    <link href='http://fonts.googleapis.com/css?family=Roboto+Condensed:400,700,300' rel='stylesheet' type='text/css'> 
    <link href='http://fonts.googleapis.com/css?family=Raleway:400,100' rel='stylesheet' type='text/css'> 
    <script src="jquery.js"></script> 


    <script type="text/javascript"> 
    function addtocart(pid,name,price,buid) 
    { 
     alert("addToCart function working"); 
    var pid = pid; 
    var pname = name; 
    var pprice = price; 
    var pqty = document.getElementById("qty").value; //$(#qty).val(); 
    var buid = buid; 

    //var cstid = $(#).val(); 
    $.ajax({ 
      type:"POST", 
      url:"http://localhost/phpsales/insert-cart.php", 
      data:{pid,pname,pprice,pqty,buid}, 
      cache:false, 
      success:alert("Product Added Successfully") 
      //error:function fail(){alert("Some technical error occured dufine product add to cart. Please try after some time.");} 
     }); 
    } 
    </script> 


    <!-- Bootstrap --> 
    <link rel="stylesheet" href="css/bootstrap.min.css"> 

    <!-- Font Awesome --> 
    <link rel="stylesheet" href="css/font-awesome.min.css"> 

    <!-- Custom CSS --> 
    <link rel="stylesheet" href="css/owl.carousel.css"> 
    <link rel="stylesheet" href="style.css"> 
    <link rel="stylesheet" href="css/responsive.css"> 

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
    <!--[if lt IE 9]> 
     <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> 
     <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
    <![endif]--> 
    </head> 
    <body> 

私は「カートに入れるにaddtocart()関数を起動します"ボタンをクリックした後、ショッピングカートにデータを挿入します。事前に

おかげで

+1

コンソールエラーをチェックしましたか? – uzaif

+0

アラート「addToCart function working」を取得しているかどうかを確認しますか? –

+0

いいえアラート(「addToCart function working」)メッセージが表示されません。 – Web7

答えて

0

は、私はこの問題は、あなたが

function addtocart(pid,name,price,buid) 
    { 
    alert("addToCart function working"); 
    var pid = pid; 
    var pname = name; 
    var pprice = price; 
    var pqty = document.getElementById("qty").value; //$(#qty).val(); 
    var buid = buid; 

    //var cstid = $(#).val(); 
    $.ajax({ 
      type:"POST", 
      url:"http://localhost/phpsales/insert-cart.php", 
      data:{pid,pname,pprice,pqty,buid},//here is the problem 
      data:{pid:pid,pname:pname,pprice:pprice,pqty:pqty,buid:build},//this must be like this 
      cache:false, 
      success:alert("Product Added Successfully") 
      //error:function fail(){alert("Some technical error occured dufine product add to cart. Please try after some time.");} 
     }); 
    } 
+0

しかし、これは最初のメッセージアラート( "addToCart function working");を警告していません。 – Web7

+0

あなたのパラメータ値を引用すると、@ Vickyが指摘したものを修正する必要があります。 –

0

は、私はあなたがそうのようなaddToCard()関数を呼び出し、あなたの引数を囲む引用符を配置する必要があると思う新しいページにデータを送信しているデータであると思います: onclick="addtocart(/''.$row[1].'/',/''.$row[2]./'',/''.$row[3].'/',/''.$buid.'/');"

+0

ありがとうございますが、このテクニックは動作していません。 – Web7

+0

inspect要素(chromeブラウザ)のaddtocart()関数はデータを表示します。このようにonclick = "addtocart(10001、Samsung Galaxy s5- 2015,2400,8kufj1umpgn3537n8qmh0hr1e3);" – Web7

+0

私は今それは良いと思う、ちょうど値の周りに引用符を入れて、それらを正しくエスケープしようとする –

関連する問題