Question

我有一个选择，用户可以选择一些区域。

选择此区域后，我想用主题填充新选择。

1区域有n个科目。

但是我在控制器上传递了数据，在更改我的选择后我不知道如何从数据库中获取这些主题，而不提交表单。

在我的控制器中，我有这种方法来传递区域：

$areas = Areas::all();
    $vars = array(
            'url'=>$this->url,
            'areas'=>$areas->pluck('name','idArea'),
        );
    return view($this->viewRoute.'.create')->with($vars);

我的模型中有关系subject（），它返回：

public function subjects(){
        return $this->hasMany(Subjects::class);
    }

这是我的观点：

<div class="form-group">
    @if( !empty($areas['name']))
        {{Form::label('select_area', $areas->name, array('class' => 'awesome')) }}
        {{Form::hidden('areaId',$areas->idArea)}}
    @else
        {{Form::label('select_area', 'Selecionar Area', array('class' => 'awesome')) }}
        {{Form::select('areaId',$areas,null,array('id'=>'select_area'))}}
    @endif
</div>

这是填充新选择

的jquery

<script>
    jQuery(document).ready(function($){
        $('#select_area').change(function(){
            alert(this.value);
        });
    });
</script>

我无法使用js函数中的值从数据库中获取数据，那么从我的数据库中获取主题的方法是什么？

感谢您的帮助

Answer 1

根据您的喜好，有几种方法。

AJAX

这需要您创建一个新路线，该路线将占用一个区域并返回一系列主题。什么控制器/方法对此做出响应取决于你。

Route::post('getSubjects', ['uses' => 'SomeController@someMethod']);

然后在someMethod函数中，你想获取主题列表并将它们作为json返回，以便你可以用javascript解析它。

public function someMethod(Request $request)
{
    $area = App\Area::with('subjects')->find($request->get('id'));

    return response()->json($area->subjects);
}

然后你的javascript中有alert，你想使用jquery的ajax方法来获取这些数据......

$.ajax({
    method: 'post',
    url: '/getSubjects',
    data: {
        id: $('#select_area').find('option:selected').val()
    },
    success: function(response) {
        // First we should clear out all the current subjects, otherwise we will just keep appending them.
        $('#select_subject').find('option').remove();
        $.each(response, function(i, subject) {  // This loops through the areas json returned from your controller
            $('#select_subject').append(  // This is jquery speak for adding a new child element to your subject dropdown.  (I guessed the select_subject id.)
                $('<option />').val(subject.id).text(subject.name)  // This is jquery speak for creating a new option element.  (I guessed your id column for the subject and the name column for the subject.  These depends on your database columns)
            );
        });
    }
});

非AJAX

这种方式在性能上可能更容易，因为一切都是事先完成的。

在你的控制器中，不是返回区域列表，而是返回带有主题的区域列表，将其转换为JSON，然后将其放入元元素中。

$areas = Area::with('subjects')->get();

然后在您的视图中，添加带有区域的元标记...

<meta name="areas" content="{{ $areas->toJson() }}" />

现在页面包含所有数据，因此不需要其他查询。我们只需要根据区域ID获取正确的主题。

var areas = $.parseJSON( $('meta[name="areas"]').attr('content') );
var subjects = areas[ $('#select_area').val() ];

$.each(subjects, function(i, subject) {
     .... // same code as last each loop in ajax section.
});

选择另一个选择后填充新选择

1 个答案:

AJAX

非AJAX