Question

我搜索了同一问题的先前答案，但没有一个帮助我创建一个新问题

我正在尝试根据第一个下拉列表的值

填充第二个下拉列表

下面是我的代码

控制器

<?php

class ExprResultsController extends BaseController {

    /*
    |--------------------------------------------------------------------------
    | Default Home Controller
    |--------------------------------------------------------------------------
    |
    | You may wish to use controllers instead of, or in addition to, Closure
    | based routes. That's great! Here is an example controller method to
    | get you started. To route to this controller, just add the route:
    |
    |   Route::get('/', 'HomeController@showWelcome');
    |
    */

    public function bartExperRsltDwnld()
    {
        return View::make('hello');
    }

        public function soExperRsltDwnldPg()
    {
            $tasks = Tasks::lists('taskname', 'id');
            return View::make('dashboard.admin.exprRslts.exprRsltsSo')
                    ->with('tasks', $tasks);
    }

        public function getExprIds($id) {

        $exprs = Experiments::where('expertype', '=', $id)->lists('expername', 'id');
        /*$options = array();

        foreach ($exprs as $expr) {
            $options += array($expr->id => $expr->expername);
        }*/
        //Response::eloquent($exprs->get(array('id','name')));
        //return Response::json($options);
        return $exprs;

    }

}

路线

Route::get('dropdowns/exprs/{id}', 'ExprResultsController@getExprIds');

Blade页面：

@extends('dashboard.dashboard_admin')

@section('page-content') 
<div class="row">
    <div class="col-lg-12">
        <h1 class="page-header"><i class="fa fa-archive fa-fw"></i> Download Experiment's Data</h1>
    </div> 
    <div class="col-lg-12">
    {{ Form::open(array('url' => 'foo/bar')) }}

        <div class="form-group">
            {{ Form::label('taskname', 'Tool/Task Name:') }}            
            {{ Form::select('expertype',array('default' => 'Please select one option') + $tasks,'default', array('id' => 'expertype')) }}
        </div>
        <div class="form-group">
            {{ Form::label('expername', 'Experiment Name:') }} 
            <select class="form-control" id="exprid" name="exprid" ></select>

        </div>
        <div class="checkbox">
            <label>
                <input type="checkbox">Disabled Checkbox
            </label>
        </div>
        <div class="form-group">
            {{ Form::submit('Submit', array('class' => 'btn btn-success')) }}
            <a href="{{URL::to('dashboard')}}" class="btn btn-danger">Cancel</a>
        </div>

    {{ Form::close() }}
   </div> 
    <!-- /.col-lg-12 -->
</div>
<br>
    <div class="panel panel-default">
        <div class="panel-heading">
            <i class="fa fa-bell fa-fw"></i> Note
        </div>
        <!-- /.panel-heading -->
        <div class="panel-body">
            <p>Current version only supports capability to download experiment data via excel spread
            sheet. To download first select task type and then corresponding experiment.
            Future versions will support advanced reporting framework.</p>
        </div>
        <!-- /.panel-body -->
    </div>
    <!-- /.panel -->

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

        $("#expertype").change(function() {

            $.getJSON("/dropdowns/exprs/",{ id : $("#expertype").val()}, function(data) {

                var $exprid = $("#exprid");
                $exprid.empty();

                $.each(data, function(id, expername) {                    
                    $exprid.append('<option value="' + id +'">' + expername + '</option>');
                });
            $("#exprid").trigger("change"); /* trigger next drop down list not in the example */
            });
        });
    });
</script>

@stop

请帮我找出问题所在。当我在浏览器中键入路径时，它会在DB中显示这样的值 {＆＃34; rbFkbjdmSt＆＃34;：＆＃34;表达式1＆＃34;}

我试图在$（＆＃34;＃expertype＆＃34;）中设置警报。更改（function（）并且它可以工作。但是当我在$ .getJSON中放入警报时（＆＃34; / dropdowns / exprs） /＆＃34;，{id：$（＆＃34;＃expertype＆＃34;）。val（）}，function（data）{ 没有回应。

提前谢谢！

Answer 1

ajax调用失败，因为它请求的url不正确。您的路由被定义为将id作为url段查找，但是您的ajax调用将id作为查询参数传递。因此，您的ajax调用不是请求dropdowns/exprs/{id}，而是请求dropdowns/exprs/?id={id}。反过来，这将返回404，并且不会调用您的成功回调。

试试这个：

$.getJSON("/dropdowns/exprs/"+$("#expertype").val(), {}, function(data) {
    console.log(data);
});

Answer 2

1）第一期 - 控制器方法：

你应该在方法中的HTTP动词之后放置一个大写字母：

错误： public function getExprIds($id) {

正确： public function getExprids($id) {

2）您需要JSON数据，生成JSON数据：

public function getExprIds($id) {

    $exprs = Experiments::where('expertype', '=', $id)->lists('expername', 'id');
   //Convert Illuminate collection to JSON
    echo $exprs->toJson();

}

3）您获得JSON数据，使用JSON数据：

$(document).ready(function() {

    $("#expertype").on('change',function() {
        //Expecting an id after '/exprs', as per your route configuration
        $.getJSON("/dropdowns/exprs/"+$("#expertype").val(), function(data) {

            var $exprid = $("#exprid");
            $exprid.empty();
            //We loop through rows of data
            $.each(data, function(index, itemData) {
                //Access to columns is as follows: itemData.ColumnName                    
                $exprid.append('<option value="' + itemData.id +'">' + itemData.expername + '</option>');
            });
        $("#exprid").trigger("change"); /* trigger next drop down list not in the example */
        });
    });
});

动态人口选择下拉列表

2 个答案: