0

私の限界。これを機能させることができません：データベースからデータを入力するためにjqueryとJSONを使用して動的選択リストを作成したいです。firebugコンソールでデータをフェッチしますが、選択ボックスに入力されません。これが私の見解です：

<div class="control-group">
            <label class="control-label" for="inputPassword">Grad</label>
            <div class="controls">
                <select name="city" id="city" class="update">
                    <option value="">Odaberi</option>
                    <?php if (!empty($results)) { ?>
                    <?php foreach($results as $row) { ?>
                    <option value="<?php echo $row->city_id; ?>">
                        <?php echo $row->city_name; ?>
                    </option>
                    <?php } ?>
                    <?php } ?>
                </select>
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="inputPassword">Deo grada</label>
            <div class="controls">
            <select name="category" id="category" class="update"
        disabled="disabled">
        <option value="">----</option>
    </select>
            </div>
        </div>

これが私のモデルと呼ばれる私のコントローラーです：

関数update_list（）{$ this-> marea-> update_list（）;

そして、ついに私のモデル

function update_list(){
    if (!empty($_GET['id']) && !empty($_GET['value'])) {
        $id = $_GET['id'];
        $value = $_GET['value'];

        try {
            $objDb = new PDO('mysql:host=localhost;dbname=isport', 'root', '');
            $objDb->exec('SET CHARACTER SET utf8');

            $sql = "SELECT *
            FROM `area`
            WHERE `city_id` = ?";
            $statement = $objDb->prepare($sql);
            $statement->execute(array($value));
            $list = $statement->fetchAll(PDO::FETCH_ASSOC);

            if (!empty($list)) {
                $out = array('<option value="">Odaberi</option>');

                foreach($list as $row) {
                    $out[] = '<option value="'.$row['area_id'].'">'.$row['area_name'].'</option>';
                }

                echo json_encode(array('error' => false, 'list' => implode('', $out)));
            } else {
                echo json_encode(array('error' => true));
            }
        } catch(PDOException $e) {
            echo json_encode(array('error' => true));
        }
    } else {
        echo json_encode(array('error' => true));
    }
}

ここに私のajax：

var formObject = {
    run : function(obj) {
        if (obj.val() === '') {
            obj.nextAll('.update').html('<option value="">----</option>').attr('disabled', true);
        } else {
            var id = obj.attr('id');
            var v = obj.val();
            jQuery.getJSON(SITE +'users/update_list', { id : id, value : v }, function(data) {
                if (!data.error) {
                    obj.next('.update').html(data.list).removeAttr('disabled');
                    return;
                } else {
                    obj.nextAll('.update').html('<option value="">----</option>').attr('disabled', true);
                }
            });
        }
    }
};
$(function() {
    $('.update').live('change', function() {
        formObject.run($(this));
    });
});
4

1 に答える 1

0

あなたの問題はjQuerynext関数の使用です。

DOM要素のセットを表すjQueryオブジェクトが与えられた場合、.next（）メソッドを使用すると、DOMツリー内のこれらの要素の直後の兄弟を検索し、一致する要素から新しいjQueryオブジェクトを構築できます。

選択ボックスが同じセットにないため、次は未定義を返し、何も更新されません。この特定の場所でこのコードを1回だけ使用する必要がある場合は、別のクラスまたはIDを2番目のセレクターに追加して指定できます。

var formObject = {
 run : function(obj) {
    if (obj.val() === '') {
        obj.nextAll('.update').html('<option value="">----</option>').attr('disabled', true);
    } else {
        var id = obj.attr('id');
        var v = obj.val();
        jQuery.getJSON(SITE +'users/update_list', { id : id, value : v }, function(data) {
            if(!data.error) {
                $('#secondSelect').html(data.list).removeAttr('disabled');
            } else {
                $('#secondSelect').html('<option value="">----</option>').attr('disabled', true);
            }
        });
    }
}  };
于 2013-02-07T03:25:26.147 に答える