使用触发器获取值

时间:2013-05-30 15:17:47

标签: php jquery

我在选择更改时尝试通过AJAX获取数据,这就是我使用.trigger()的原因。

然而,它似乎没有起作用。我可以从数据库中顺利地获取数据,然后通过AJAX将其传递给item-type。

在这里。

HTML

<!doctype>

<html>
    <head>
        <title>Coupon Protoype</title>
        <link rel="stylesheet" type="text/css" href="css/coupon.css">
    </head>
    <body>
        <div class="body-wrap">

            <section class="wrap-form">
                <label for="item-types">Item Types</label><select id="item-types"></select>
                <label for="item-list">Items</label><select id="item-list"></select>

                <input type="text" placeholder="Check Code" id="input-code"/>
                <input type="button" id="button-check" value="Check"/>
            </section>

            <section class="output-wrap">
                <label>Coupon Code:</label> <label id="coupon-code"></label>

            </section>

        </div>
    </body>
    <script type="text/javascript" src="javascript/jquery-1.10.0.min.js"></script>
    <script type="text/javascript" src="javascript/coupon.js"></script>
</html>

的Javascript

$(document).ready(function(){


    function get_items_type(){

        $.ajax({
                type:'POST',
                url:'coupon-functions.php',
                dataType:'json',
                data:{'switch-num':'1'},
            success:function(data){

                if(data.error){

                    alert(data.error);
                }
                    var html = '';
                  $.each(data, function(i, item) {       
                            html += "<option value="+data[i].item_type_id+">"+data[i].item_type+"</option>";
                    });

                   $('#item-types').append(html);
            }
        })
    }

/这一行是我说的$(“#item-types”)。on(“change”,function(){

        var item_type_id = $(this).val();

        $.ajax({
                type:'POST',
                url:'coupon-functions.php',
                dataType:'json',
                data:{'switch-num':'2','item_type_id':item_type_id},
            success:function(data){

                if(data.error){

                    alert(data.error);
                }
                    var items = '';

                     $('#item-list').html("");

                  $.each(data, function(i, item) {       
                            items += "<option value="+data[i].item_id+">"+data[i].item_name+"</option>";
                    });

                   $('#item-list').append(items);
            }
        })


    });

    $("#item-types").trigger("change");


    get_items_type();


});

PHP

<?php
    include_once('db_connect.php');

    $switch_number = $_POST["switch-num"];

    switch ($switch_number) {
        case '1':
            get_item_list();
            break;

        case '2':
            get_item();
            break;
    }

    function get_item_list(){

        $get_items = "SELECT * FROM item_type_info";

        $query_get_items = mysql_query($get_items);

        $data = array();

        if(!$query_get_items){


            $data['error'] = die(mysql_error());
        }

        while($row = mysql_fetch_array($query_get_items)){

            $data[] = array( 'item_type_id' => $row['item_type_id'],
                             'item_type' => $row['item_type'] );
        }

        echo json_encode($data);

    }

    function get_item(){
        $item_type_id = $_POST['item_type_id'];

        $get_items = "SELECT * FROM item_info a 
                                LEFT JOIN item_type_info b 
                                ON(a.item_type_id = b.item_type_id) 
                                WHERE a.item_type_id = '$item_type_id' ";

        $query_get_item = mysql_query($get_items);

        $item = array();

        if(!$query_get_item){

            $item['error']=die(mysql_error()); 
        }

        while($row = mysql_fetch_array($query_get_item)){

            $item[] = array( 'item_id' => $row['item_id'],
                             'item_name' => $row['item_name']);
        }

        echo json_encode($item);

    }


?>

我使用.on()代替.live()。我只需要在页面加载时使其工作,触发器将在选择列表中进行更改。

1 个答案:

答案 0 :(得分:0)

我相信您对trigger()功能的理解是手头的问题。 trigger()的使用用于手动触发事件,您似乎希望在更改选择框时触发您的函数。

  

使用.on()或其快捷方法之一附加的任何事件处理程序   在相应事件发生时触发。他们可以解雇   但是,使用.trigger()方法手动。调用.trigger()   以与事件相同的顺序执行处理程序   由用户自然触发:

替换:

$("#item-types").trigger("change");


get_items_type();

使用:

$("#item-types").on("change", function(){
    get_items_type();
});

工作演示:http://jsfiddle.net/pQDjy/