如何通过使用jquery ajax点击到php来传递checkbox值

时间:2016-01-25 06:31:25

标签: php html mysql ajax

<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
#prodbrand,#prodname,#prodsize,#prodcolor,#prodtype,#prodminprise,#prodmaxprise
    {
    border: 1px solid #d1caca;
    font-size: 14px;
    background: #f8f4f4;
    margin-top: 3px;
    color: #205a60;
}

#prodnamelist,#prodbrandlist,#prodsizelist {
    font-size: 12px;
}

[type=checkbox]:after {
    content: attr(value);
    margin: -3px 15px;
    vertical-align: top;
    white-space: nowrap;
    display: inline-block;
}
</style>
</head>
<script src="jquery.js"></script>
<script language="javascript">   $("#prodminprise").click(function(){ 
        $("#prodminpriselist").slideToggle();  });

    $("#prodbrand").click(function(){ 
        $("#prodbrandlist").slideToggle();  });



    $("#prodname").click(function(){
        $("#prodnamelist").slideToggle();
    });

    $("#prodsize").click(function(){
        $("#prodsizelist").slideToggle();
    });

    $("#prodcolor").click(function(){
        $("#prodcolorlist").slideToggle('400');
    });

    $("#prodtype").click(function(){
        $("#prodtypelist").slideToggle('400');
    });
    </script>
<script language="javascript"
    src="https://code.jquery.com/jquery-1.11.1.min.js"
    type="text/javascript"></script>

<script language="javascript" type="text/javascript">


    $('#.manufactureBy').click(function(){
                var value= $(this).val();
                $.ajax({
                    url: 'deleteProduct.php',
                    type: 'POST',
                    data: {check:value},

                    success: function(data){
                        alert(data);
                    }
                });


            });



            </script>
<body width="200">



    <?php
    if(isset($_POST['key'] )){

        if($_POST['key']=="all"){
            $_POST['key']=null;
        }
        $key1 = trim($_POST['key']); //        if($key1.length> 1){
        $con = mysql_connect("localhost","root","1234");
        if (!$con) {
            die('Could not connect: ' . mysql_error());
        }
        mysql_select_db("productdetails", $con);

        $sql= ("SELECT   upper(pname), upper(manufacturBy), upper(psize),upper(pcolor),upper(pType)  FROM proddetail where shortSearch like '%".$key1."%' or pcolor like '".$key1."%' or pType like '".$key1."%' or psize like '".$key1."%'");
        $query = mysql_query($sql);
        $sqlp=("select min(saleprize),max(saleprize) from proddetail where shortSearch like '%".$key1."%' or pcolor like '".$key1."%' or pType like '".$key1."%'");
        $queryp = mysql_query($sqlp);
        while($rowp = mysql_fetch_array($queryp)){

            $MinPraise= $rowp['min(saleprize)'];
            $MaxPraise =$rowp['max(saleprize)'];

        }    while($row = mysql_fetch_array($query)){

            $manufactur[] = $row['upper(manufacturBy)'];
            $productnam[] = $row['upper(pname)'];
            $productsiz[] = $row['upper(psize)'];
            $productcolor[] = $row['upper(pcolor)'];
            $productmaxpris[] = $row['max(saleprize)'];
            $producttyp[] = $row['upper(pType)'];
        }

        $manufacture = array_unique($manufactur);
        $productname = array_unique($productnam);
        $productsize = array_unique($productsiz);
        $productcolors = array_unique($productcolor);
        $producttype = array_unique($producttyp);

        ?>
    <div id="prodminprise">
        <span>prise</span>
    </div>
    <div id="prodminpriselist">
        <?php
        echo 'Min : '. $MinPraise;
        echo '<br>Max : '. $MaxPraise;  ?>
    </div>

    <!--</div>-->
    <div id="leftFilters">
        <div id="prodbrand">
            <span id="plus"></span><span>Brand</span>
        </div>
        <div id="prodbrandlist">
            <?php            
            foreach ($manufacture as $brand) {
                ?>
            <input name="select[<?php echo $brand; ?>]" type="checkbox"
                class="manufactureBy" id="click_checkbox"
                value="<?php echo $brand; ?>">
            <?php // echo $brand; ?>
            </label> <br>
            <?php } ?>
        </div>
        <div id="prodname">
            <span>Prod. Name</span>
        </div>
        <div id='prodnamelist'>
            <?php  foreach ($productname as $proname) {     
                ?>
            <input type="checkbox" class="productname"
                value="<?php echo $proname; ?>">
            <?php // echo $proname; ?>
            <br>
            <?php  } ?>
        </div>
        <div id="prodsize">
            <span>Size</span>
        </div>
        <div id="prodsizelist">
            <?php   foreach ($productsize as $prosize) {      
                ?>
            <input type="checkbox" class="productsize"
                value="<?php echo $prosize; ?>" onclick="doit()">
            <?php // echo $prosize; ?>
            <br>
            <?php }  ?>
        </div>
        <div id="prodcolor">
            <span>Color</span>
        </div>
        <div id="prodcolorlist">
            <?php   foreach ($productcolors as $procolor) {      
                ?>
            <input type="checkbox" class="productcolor"
                value="<?php echo $procolor; ?>" onclick="doit()">
            <?php // echo $procolor; ?>
            <br>
            <?php }  ?>
        </div>
        <div id="prodtype">
            <span>Products/Type</span>
        </div>
        <div id="prodtypelist">
            <?php   foreach ($producttype as $protype) {      
                ?>
            <input type="checkbox" class="producttype"
                value="<?php echo $protype; ?>" onclick="doit()">
            <?php // echo $protype; ?>
            <br>
            <?php }  ?>
        </div>
    </div>
    <?php } ?>

</body>
</html>

1 个答案:

答案 0 :(得分:1)

您只需将jQuery中的选择更改为:

$('.manufactureBy').click(function(){
   var value= $(this).val();
console.log(value); // checkbocx value
..........
});

你不能那样使用:

$('#.manufactureBy')

因为您使用manufactureBy作为checkboc输入字段的类名。要使用类名获取输入值,只需使用$('.yourClassName')

当您想使用ID属性获取输入值时,您只需将其更改为: $('#yourIDName')