Question

我正在尝试创建一个依赖的下拉列表，但我不太清楚该怎么做，所以一点帮助就会非常感激。这段代码显示错误＆＃34;未定义的变量：输入＆＃34 ; 。对于第一次下拉，我有3个静态选项。

 <option value="business">Business</option>
 <option value="branch">Branch</option>
 <option value="offer">Offer</option>

对于第二次下拉，我需要根据首先选择的内容进行选择。例如，如果用户选择Business 在第二次下拉时，他需要从列表中选择一个特定的业务

 @foreach($businesses as $business)
 <option value="{{$business->id}}">{{$business->name}}</option>
 @endforeach

依此类推，所以如果他选择Offer我需要一份所有优惠清单我正在关注ajax的教程，但现在我陷入其中。这是我的观点

<div class="form-group">
    <label class="control-label col-lg-12">Type <span class="text-danger">*</span></label>
    <div class="col-lg-12">
        {{ Form::open() }}
        <select rows="5" cols="5" name="type_id" id="type_id" class="form-control" required="required" placeholder="Default textarea">
            <option value="business">Business</option>
            <option value="branch">Branch</option>
            <option value="offer">Offer</option>
        </select>
    </div>
</div>

<div class="form-group">
    <label class="control-label col-lg-12">Offer <span class="text-danger">*</span></label>
    <div class="col-lg-12">

        <select id="series" name="series">
            @if($input=='business')
                @foreach($businesses as $business)

                    <option value="{{$business->id}}">{{$business->name}}</option>
                @endforeach


                @elseif($input=='branch')
                    @foreach($branches as $branch)

                        <option value="{{$branch->id}}">{{$branch->name}}</option>
                    @endforeach

                @else
                @foreach($offers as $offer)

                    <option value="{{$offer->id}}">{{$offer->title}}</option>
                @endforeach
                @endif
        </select>
        {{ Form::close()}}
    </div>

脚本

 <script>

    $(document).ready(function($){

        $('#type_id').change(function(){

            $.get("{{ url('api/repairdropdown')}}", { option: $(this).val() },

                    function(data) {

                        var numbers = $('#series');

                        numbers.empty();

                        $.each(data, function(key, value) {

                            numbers
                                    .append($("<option></option>")
                                    .attr("value",key)
                                    .text(value));
                        });

                    });

        });

    });
</script>

和我的控制器

    public function dropdown()
{

    $input = Input::get('option');
    $offers = Offers::where([
        'visible' => 'yes',
        'delete' => 'no'
    ])->orderBy('id', 'DESC')
        ->get();

    $businesses = Offers::where([
        'visible' => 'yes',
        'delete' => 'no'
    ])->orderBy('id', 'DESC')
        ->get();

    $branches = Branches::where([
        'visible' => 'yes',
        'delete' => 'no'
    ])->orderBy('id', 'DESC')
        ->get();
    return Response::json($offers,$businesses,$branches,$input);

}

谢谢你，如果你停下来！

Answer 1

试试这个：

<强>控制器

public function dropdown()

{

$input = Input::get('option');
$offers = Offers::where([
    'visible' => 'yes',
    'delete' => 'no'
])->orderBy('id', 'DESC')
    ->get();

$businesses = Offers::where([
    'visible' => 'yes',
    'delete' => 'no'
])->orderBy('id', 'DESC')
    ->get();

$branches = Branches::where([
    'visible' => 'yes',
    'delete' => 'no'
])->orderBy('id', 'DESC')
    ->get();
if($input == 'Business'){ 
   $dropdownData =  $businesses;
}elseif($input == 'Branches'){
    $dropdownData = $branches;
}

$output = '';
foreach($dropdownData as $value){
    $output.="<option value='".$value->id."'>".$value->business_name."</option>"
}
echo $output;

}

Javascript代码

<script>

$(document).ready(function($){

    $('#type_id').change(function(){

        $.get("{{ url('api/repairdropdown')}}", { option: $(this).val() },

                function(data) {

                    $('your_select_id').append(data);


                });

    });

});

依赖下拉列表列出3个不同的表

1 个答案: