2012-04-22 11 views
0

INPUTの値が変更されると、コンテンツはスピナーと「Please Wait ...」メッセージに置き換えられ、GETから応答を受け取ると、スピナー/メッセージを新しいHTMLが返されましたが、返される新しいHTMLはスピナー/メッセージを置き換えるものではありません。AJAX GETの呼び出し後にJQueryがコンテンツを置き換えない

(動的PHP)HTMLは以下のとおりです。

<script type="text/javascript"> 

    $(document).ready(function() { 
     $('#submit').click(function(e) { 
      e.preventDefault(); 

     }); 
    }); 

</script> 

<script type="text/javascript"> 

    $(document).ready(function() { 
     $('.basket-item').children(0).children(1).change(function(e) { 
      e.preventDefault(); 

      var q = $(this).val(); 
      var id = $(this).parent().children(0).val(); 

      var elem = $(this); // var content = elem.parent().parent().parent().html(); 

      elem.parent().parent().parent().html('<div class="basket-item item-border" style="width:896px;text-align:center;"><p class="para"><img src="<?php echo $this -> get('__baseuri'); ?>/media/images/spinner.gif" />Please wait...</p></div>'); 

      var url = '<?php echo $this -> get('__baseuri'); ?>shop/adjust/' + id + '/?quantity=' + q; 

      $.get(url, function(data) { 
       elem.parent().parent().parent().html(data); 

      }); 




     }); 
    }); 

</script> 

<h1>Shopping Basket</h1> 

<div> 
    <div class="basket-item" style="width:512px;text-align:left;"><p>Product/Item</p></div> 
    <div class="basket-item"><p>Quantity</p></div> 
    <div class="basket-item"><p>Price &pound;</p></div> 
    <div class="basket-item"><p>Total &pound;</p></div> 
</div> 

<?php if($this -> has('records')): ?> 
<form 
    method="post" 
    action="#" 
    accept-charset="utf-8"> 

<?php foreach($this -> get('records') as $record): ?> 
    <div> 
     <div class="basket-item item-border" style="width:512px;text-align:left;"> 
      <p class="para"> 
       <img 
        width="48" 
        height="48" 
        alt="<?php echo $record -> get('name'); ?> (&pound;<?php echo $record -> get('price'); ?>)" 
        src="<?php echo $this -> get('__baseuri'); ?>media/images/products/generic/<?php echo $record -> get('image'); ?>.jpg" /> 
      <a href="<?php echo $this -> get('__baseuri'); ?>products/<?php echo $record -> get('tainted'); ?>/"><?php echo $record -> get('name'); ?></a></p> 
     </div> 
     <div class="basket-item item-border"> 
      <p> 
       <input type="hidden" name="product" value="<?php echo $record -> get('tainted'); ?>" /> 
       <input type="text" name="quantity" size="3" maxlength="3" value="<?php echo $record -> get('quantity'); ?>" /> 
      </p> 
     </div> 
     <div class="basket-item item-border"><p><?php echo $record -> get('price'); ?></p></div> 
     <div class="basket-item item-border"><p>&nbsp;</p></div> 
    </div> 
<?php endforeach; ?><div style="clear:both;"></div> 
<div> 
    <div class="basket-item item-border" style="width:768px;text-align:right;"><p>Grant Total &pound;&nbsp;</p></div> 
    <div class="basket-item item-border" style="width:128px;text-align:center;"><p>14.91</p></div> 
</div> 
<div> 
    <div style="margin:0%;padding:16px 0%;width:896px;text-align:left;"><p> 
     <input id="submit" type="submit" value="Checkout&nbsp>>" /> 
    </p></div> 
</div> 
</form> 
<?php else: ?> 
    <div> 
     <div class="basket-item" style="width:896px;text-align:center;"><p>Please add one or more items to your shopping basket.</p></div> 
    </div> 
<?php endif; ?> 
+1

あなたはfirebugやchromeの開発ツールを使って簡単なデバッグを行うことでこの問題を突き止めることができます。あなたのjquery関数は、第三者の目のためにちょっと汚いです。 –

+0

javascriptが幾分汚れているのを知っていますが、この時点でデバッガの問題を理解できません:( – ElizabethQ

+0

'' console.log $ .get'を実行して何が得られるかを確認してください。また、コンソールにエラーが表示されていますか? –

答えて

0

あなたのURLが正しく構築されていません。

var url = '<?php echo $this -> get('__baseuri'); ?>shop/adjust/' + id + '/?quantity=' + q; 

おそらく必要があります。

var base_uri = "<?php echo $this->get('__baseuri') ?>"; 
var url = base_uri+'shop/adjust/' + id + '/?quantity=' + q; 

URLは、そこには問題は、また、サーバは問題はクライアント側だけで期待通りにコンテンツを返しませんので、一度サーバによって解析され、非常に許容可能かつ適切です。

関連する問題