0

まず第一に、タイトルがより良いタイトルを見つけることができなかったことをお詫びしたいと思います.

私は ajax が初めてで、jquery を ajax に変更したいと考えています。同じjqueryでやりたかったのですが、使用しているjqueryにはすでに があり、同時にurl2つを使用できるとは思いません。url

私の現在のjquery はこれでうまくいきます。これを理解すれば、私が何をしたいのか理解できるはずです

$(document).ready(function(){
    $('#selected').hide();
    $('#button').click(function(){
        var pid = $('#pid').val();
        var length = $('#length').val();
        var Category = $('#Category').val();
        var Qty = $('#Qty').val();
        var qty = $('#Qty').val();
        var price = '\u00A3' + parseInt($('#pricetag').text().replace(/^\D/, ''), 10) * qty;
        var category = $('#Category').text();
        var length = $('#length').val();
        if (!/^[1-9]\d?$/.test(Qty)){
            alert('Quantity should not be below 1 or null');
            return false; // don't continue
        }
        else {
        $('#sprice').text(price);
        $('#scategory').text(category);
        $('#slength').text(length);
        $('#selected').slideDown();
        }
        $.ajax({
            url: 'cart.php',
            type: 'POST',
            data: { pid:pid, 
            length:length, 
            Qty:Qty, 
            Category:Category },
            success: function(data)
            {

            }
        });
    });
});

お気づきの場合は、div呼び出されselectedた . これは正しい方法ではありません。

私の選択したdiv

         <div class="slidingDiv" id='selected'>
    <table class="tableclass">
        <tr>
            <td>Price:</td>
            <td id='sprice'></td>
        </tr>
        <tr>
            <td>Category:</td>
            <td id='scategory'></td>
        </tr>
        <tr>
            <td>Length:</td>
            <td id='slength'></td>
        </tr>
    </table>
</div>

w3school で見つけたこの ajax コードを試します

function showitem(str)
{
var xmlhttp;
if (str.length==0)
  { 
  document.getElementById("showtxt").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("showtxt").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","showitem.php?pid="+str,true);
xmlhttp.send();
}

しかし、私は経験が浅いのでうまくいきません。

やりたい

selectedJavaScriptを無効にすると表示されるため、非表示にしたくありません。

やろうとしていること。ajaxを使用して追加ボタンをクリックするonclickと、長さ、pid、カテゴリ、および数量が送信さshowitem.phpれ、このshowitem.phpで価格*数量を乗算して計算し、エコーアウトします 

<table class="tableclass">
        <tr>
            <td>Price:</td>
            <td id='sprice'></td>
        </tr>
        <tr>
            <td>Category:</td>
            <td id='scategory'></td>
        </tr>
        <tr>
            <td>Length:</td>
            <td id='slength'></td>
        </tr>
    </table>

showitem.php

<?php
include('global.php');
    dbconnect();
$id=$_POST["pid"];
$Category=$_POST["Category"];
$length=$_POST["length"];
$qty=$_POST["Qty"];
$stmt2 = $conn->prepare("
SELECT Product.Name as ProductName, Category.Name, Category.CatID, Length, Price
FROM Itemised_Product, Product, Category
WHERE Itemised_Product.ppid =:item_id
AND Hair_Length = :length  AND Category.Name = :Category Limit  1");
$stmt2->bindParam('id',$id);
$stmt2->bindParam('length',$length);  
$stmt2->bindParam('Category',$length);  
$stmt2->bindParam('length',$length);  
$stmt2->execute();
$price = $row["Price"];
foreach ($_SESSION["item_price"]as $each_item) {
$pricetotal = $price * $each_item['Qty'];
$i = 0;
$rows2 = $stmt2->fetchAll(PDO::FETCH_ASSOC); 
        foreach ($rows2 as $row2) {
            if ($i == 0) {  
        echo '<table class="tableclass">
        <tr>
            <td>Price:</td>
            <td id='sprice'>' . $totalprice . '</td>
        </tr>
        <tr>
            <td>Category:</td>
            <td id='scategory'>' . $Category . '</td>
        </tr>
        <tr>
            <td>Length:</td>
            <td id='slength'>'.$length.'</td>
        </tr>
    </table>';
            }
        }
        }
?>

私を助けてください。質問が理解できない場合は、コメントを残してください。詳しく説明します。

4

1 に答える 1

0

Jquery を使用して、完成したすべての Ajax を処理する必要があります。これはサンプルの Jquery Ajax コードです。

var price = $('#sprice').html();
var length = $('#scategory').html();
var category = $('#slength').html();
$.ajax({
            //this is the php file that processes the data
            url: "showitem.php",

            //GET method is used
            type: "GET",

            //pass the data
            data: '&price='+price+'&category'+category+'&length='+length,
            //Do not cache the page
            cache: false,

             beforeSend: function(){
            //do something before data is sent  

            },
             complete: function(html){
             //do soemthing after data has been sent
             },


            //success
            success: function (html) {
            //do something with the result
            },

            error : function ()
            {
            //something went wrong
            }


        });
于 2013-07-28T12:40:59.743 に答える