2017-12-13 16 views
2

私はショッピングカートを構築中です。私は基本的に各商品ごとにitem_idを使用して各ショッピングカートの値を保存します。 新しいindex.phpを呼び出すので、カートからアイテムを追加/削除するたびに常にページの上部に移動します。PHPコードでページを更新できない場合

私は変数としてスクロール位置を保存し、前のscrollPosに画面を移動しようとしましたが、動作しませんでした(#namesを呼び出すこともありません)。

誰かがこの問題を修正するページを更新しない方法を知っていますか?

は、ここに私のコード

<?php 

session_start(); 

$page = 'index.php'; 
$con = mysqli_connect('localhost','root','0801','mystore') ; 
mysqli_select_db($con,'mystore') ; 

#for adding, removing, deleting the products from the cart 
if(isset($_GET["add"])){ //same name with cart.php?add <-- 
$_SESSION['cart_'.(int)$_GET["add"]] += 1; 
echo '<script>window.location="index.php"; window.scrollTo(0,1200);</script>'; 
} 

if(isset($_GET['remove'])){ 
    $_SESSION['cart_'.(int)$_GET['remove']] -- ; 
    header("Location: ".$page); 
} 

if(isset($_GET['delete'])){ 
    $_SESSION['cart_'.(int)$_GET['delete']] = 0 ; 
    header('Location: '.$page); 
} 

#function for displaying products 
function product(){ 
    global $con; 
    $get = mysqli_query($con, 'SELECT * FROM inventory ORDER BY id ASC'); 

    if (mysqli_num_rows($get) == 0){ 
    echo("There are no products to display"); 
    } else { 
    while ($get_row = mysqli_fetch_assoc($get)){ 
    echo '<br /><img src="images/products/'.$get_row['image'].'" width=100px;>'; 
    echo '<br>'.$get_row['name'].'<br /> &dollar;'.number_format($get_row['price'],2); 

echo '<br> <a href="cart.php?add='.$get_row['id'].'">Add To Cart</a> 
    } 
    } 
} #end of function 


# function for display cart 
function cart(){ 
    foreach ($_SESSION as $key => $value) { 
    if ($value > 0){ 
     if(substr($key, 0 , 5) =='cart_'){ 
     global $con; //DON'T FORGET TO ADD THIS!!! 
     $id = substr($key, 5, (strlen($key)-5)); //take out the string part 
     $partid = mysqli_real_escape_string($con, $id); 
     $get = mysqli_query($con,'SELECT * FROM inventory WHERE id='.(int)$partid); 

     while($get_row = mysqli_fetch_assoc($get)){ 
      $subTotal = $get_row['price'] * $value; 
      echo '<br /><img src="images/products/'.$get_row['image'].'" width=30px;>'; 
      echo $get_row['name'].' x '.$value.' @ &dollar;'.number_format($get_row['price'], 2); 
      echo ' = &dollar;'.number_format($subTotal,2); 
      echo '<a href="cart.php?remove='.$id.'"> [-] </a> <a href="cart.php?add='.$id.'">[+]</a> <a href="cart.php?delete='.$id.'"> [delete] </a><br />'; 
     } 
     } 
     $total += $subTotal; 
    } 
    } 
    if ($total ==0){ 
     echo "Your cart is empty"; 
    } else { 
     echo '<p /> TOTAL: &dollar;'.number_format($total, 2); 
    } 
} 

print_r($_SESSION); 

?> 

答えて

0

/カートからアイテムを削除するjQuery Ajaxコールの使用を検討しています。そうすることで、ページをリロードする必要はありません。

0

あなたはこのように、裏ページがリロードされる位置に取得し、その後の位置を格納するためのセッションストレージを使用することができます。

のjQuery:

$(window).scroll(function() { 
    sessionStorage.scrollTop = $(this).scrollTop(); 
}); 

$(document).ready(function() { 
    if (sessionStorage.scrollTop != "undefined") { 
    $(window).scrollTop(sessionStorage.scrollTop); 
    } 
}); 

かを使用したJavaScriptのコードクッキーのような:

はJavaScript:

<script> 
    cookieName="page_scroll" 
    expdays=365 

    function setCookie(name, value, expires, path, domain, secure){ 
    if (!expires){expires = new Date()} 
    document.cookie = name + "=" + escape(value) + 
    ((expires == null) ? "" : "; expires=" + expires.toGMTString()) + 
    ((path == null) ? "" : "; path=" + path) + 
    ((domain == null) ? "" : "; domain=" + domain) + 
    ((secure == null) ? "" : "; secure") 
    } 

    function getCookie(name) { 
    var arg = name + "=" 
    var alen = arg.length 
    var clen = document.cookie.length 
    var i = 0 
    while (i < clen) { 
    var j = i + alen 
    if (document.cookie.substring(i, j) == arg){ 
    return getCookieVal(j) 
    } 
    i = document.cookie.indexOf(" ", i) + 1 
    if (i == 0) break 
    } 
    return null 
    } 

    function getCookieVal(offset){ 
    var endstr = document.cookie.indexOf (";", offset) 
    if (endstr == -1) 
    endstr = document.cookie.length 
    return unescape(document.cookie.substring(offset, endstr)) 
    } 

    function deleteCookie(name,path,domain){ 
    document.cookie = name + "=" + 
    ((path == null) ? "" : "; path=" + path) + 
    ((domain == null) ? "" : "; domain=" + domain) + 
    "; expires=Thu, 01-Jan-00 00:00:01 GMT" 
    } 

    function saveScroll(){ // added function 
    var expdate = new Date() 
    expdate.setTime (expdate.getTime() + (expdays*24*60*60*1000)); // expiry date 

    var x = (document.pageXOffset?document.pageXOffset:document.body.scrollLeft) 
    var y = (document.pageYOffset?document.pageYOffset:document.body.scrollTop) 
    Data=x + "_" + y 
    setCookie(cookieName,Data,expdate) 
    } 

    function loadScroll(){ // added function 
    inf=getCookie(cookieName) 
    if(!inf){return} 
    var ar = inf.split("_") 
    if(ar.length == 2){ 
    window.scrollTo(parseInt(ar[0]), parseInt(ar[1])) 
    } 
    } 
<script> 

HTML:

<body onload="loadScroll()" onunload="saveScroll()" > 
関連する問題