Jquery,ajax不会提醒某些消息

时间:2014-02-15 13:03:02

标签: javascript php jquery ajax codeigniter

所以我在购物车网站上,在后端使用CodeIgniter 这是捕获,我循环产品列表,在表单标记内添加“添加到购物车”按钮。 所以说,我有5个产品要展示,将有5个表格标签:

<?php foreach ($products as $vid):?>

<form id='cart' method='post' action='<?php echo base_url();?>cart/add'>
<input type='hidden' id='vid' name='vid' value='<?php echo $vid['id'];?>'/>
<div class="video_box">
      <div class="video">
      <a href="#<?php echo $vid['id'];?>" name='modal'>
     <img src="<?php echo base_url(); ?>assets/images/<?php echo $vid['video_thumbnail'];?>" alt="<?php echo $vid['title'];?>" border="0" height='150' width='100' />
     </a>
      </div>                        
      <div class="video_checkbox">
    <?php if($this->session->userdata('nric')===FALSE ) {
     echo "Please Login to Rent/Purchase"; } else { ?>
     <input type='image' id='btn-add' src="<?php echo base_url(); ?>assets/images/rent_btn.png" alt="Rent" border="0" />
     <?php } ?>
     </div>
</form>
 <?php endforeach;?>

我的javascript / jquery脚本:

<script type="text/javascript">
$(document).ready(function() {

$("#btn-add").click(function() {
   var action = $("#cart").attr('action');
   var form_data = {
       vid : $("#vid").val(),
       is_ajax  : 1
   };
   $.ajax({
   type: "POST",
   url: action,
   data: form_data,
   success: function(response)
     {
       if(response == 'exists')
       { alert("This item is in your cart already! You can only add 1 same item once");
       }
       if(response == 'newses')
       {    alert("This item has been added succesfully!");
            document.location.reload(true);
       }
        if(response == 'new_added')
        {
            alert("This item has been added succesfully1!");
            document.location.reload(true);
        }
   }
  });
 return false;
   });
 });
    </script>

作为我的控制器(在表单操作中)localhost / site / cart / add:

public function add() {
    $vid=$_POST['vid'];

    if($this->session->userdata('shoppingCart')===FALSE)
    {   

        $shoppingCart = array (
                            $vid => 1
                        );
        $this->session->set_userdata('shoppingCart',$shoppingCart);
         echo 'newses';


    } else {    

        $tmp = $this->session->userdata('shoppingCart');
        if(array_key_exists($vid, $tmp)) {
            //only allow user to add qty:1 to the same product
            echo 'exists';

        } else {            
            $tmp[$vid]= 1;
            $this->session->set_userdata('shoppingCart',$tmp);
            echo 'new_added';


        }
    }

}

所以问题现在,我可以将产品添加到我的购物车中没有问题,购物车/添加控制器内的所有东西运行正常,输出是预期的。 但我需要提醒客户产品是否已添加或失败(如我的jquery代码所示)。 问题是,脚本只对第一次创建运行正常。 意思是,如果有5个产品,它将循环并创建5个form-tag,只有第一个form-tag才能成功运行脚本(点击按钮后)。第2至第5个表单将重定向到其他空白页面,回显结果(例如“newses”,“new_added”,“exists”),不按脚本中的说明警告用户(但购物车功能正常工作)。 / p>

我做错了什么?

1 个答案:

答案 0 :(得分:0)

试试这个

<?php foreach ($products as $vid):?>

<form id='cart' method='post' action='<?php echo base_url();?>cart/add'>
<input type='hidden' class='vid' name='vid' value='<?php echo $vid['id'];?>'/>
<div class="video_box">
      <div class="video">
      <a href="#<?php echo $vid['id'];?>" name='modal'>
     <img src="<?php echo base_url(); ?>assets/images/<?php echo $vid['video_thumbnail'];?>" alt="<?php echo $vid['title'];?>" border="0" height='150' width='100' />
     </a>
      </div>                        
      <div class="video_checkbox">
    <?php if($this->session->userdata('nric')===FALSE ) {
     echo "Please Login to Rent/Purchase"; } else { ?>
     <input type='image' class='btn-add' src="<?php echo base_url(); ?>assets/images/rent_btn.png" alt="Rent" border="0" />
     <?php } ?>
     </div>
</form>
 <?php endforeach;?>

Jquery的

$(document).ready(function() {
    $(".btn-add").click(function() {
        var $this = $(this);
        var $form = $this.parents('form');
        var action = $form.attr('action');
        var vid = $form.find('input.vid').val();
        var form_data = {
            vid : vid,
            is_ajax : 1
        };
        $.ajax({
            type : "POST",
            url : action,
            data : form_data,
            success : function(response) {
                if (response == 'exists') {
                    alert("This item is in your cart already! You can only add 1 same item once");
                }
                if (response == 'newses') {
                    alert("This item has been added succesfully!");
                    document.location.reload(true);
                }
                if (response == 'new_added') {
                    alert("This item has been added succesfully1!");
                    document.location.reload(true);
                }
            }
        });
        return false;
    });
});