我已经编辑了我的原始问题,因为我已经改进了我的代码,这使我处于更好的位置来定义更好的错误
您好我正在创建一个链式选择框,一旦选择了客户端,就会找到客户项目。
ajax正在完成它的工作,它知道选择了哪个客户端,我的控制台告诉我以下内容:
Failed to load resource: the server responded with a status of 500 (Internal Server Error) http://itempus.dev/task/clientsprojects?option=5
上面的选项值是指我想要传递给项目数据库并找到客户端项目的客户端ID。我不确定我做错了什么,并希望在一个有点复杂的新手任务中得到一些帮助。
public function create()
{
$tasks = Auth::user()->tasks;
$client_options = DB::table('clients')->orderBy('client_name', 'asc')->lists('client_name','id');
$team_options = DB::table('teams')->orderBy('team_member_name', 'asc')->lists('team_member_name','id', 'team_member_category');
return View::make('tasks.create', array('project_options' => $project_options, 'team_options' => $team_options, 'client_options' => $client_options));
}
public function clientsprojects() {
$input = Input::get('option');
$client_id = Project::find($input);
$projects = DB::table('projects')->where('client_id', $client_id->id)
->orderBy('project_name')
->lists('id','project_name');
$models = $project->projects();
return Response::eloquent($models->get(array('id','project_name')));
}
{{ Form::open(array('action' => 'TaskController@store', 'id' => 'createuser')) }}
<div class="form-group">
@if(count($client_options)>0)
{{ Form::label('select_client', 'Assign to Client', array('class' => 'awesome client_option')); }}
{{ Form::select('client', $client_options , Input::old('client'), array('class' => 'tempus_select client_option', 'id' => 'select_client')) }}
@endif
</div>
<div class="form-group deletegates">
{{ Form::label('select_client', 'Assign to Project', array('class' => 'awesome')); }}
{{ Form::select('project', array_merge(array('default' => 'Please Select')), 'default', array('class' => 'tempus_select', 'id' => 'project_select')) }}
</div>
{{ Form::submit('Create the task!', array('class' => 'btn btn-primary')) }}
{{ Form::close() }}
<script>
$(document).ready(function($){
$('#select_client').change(function(){
$.get("{{ url('task/clientsprojects')}}",
{ option: $(this).val() },
function(data) {
var model = $('#project_select');
model.empty();
$.each(data, function(index, element) {
model.append("<option value='"+ element.id +"'>" + element.name + "</option>");
});
});
});
});
</script>
Route.php
我也定义了我的路线:
Route::get('task/clientsprojects', function(){
$input = Input::get('option');
$client_id = Project::find($input);
$projects = DB::table('projects')->where('client_id', $client_id->id)
->orderBy('project_name')
->lists('id','project_name');
$models = $project->projects();
return Response::eloquent($models->get(array('id','project_name')));
});
答案 0 :(得分:2)
我假设 TaskController 中的创建功能正常工作,并为客户端创建第一个下拉菜单。
当此下拉列表更改值时,会向服务器发送ajax get请求但您收到 500(内部服务器错误),因为您的查询出现问题。
所以我们试着解决这个问题。
Route::get('task/clientsprojects', function(){
// Get the option value which is the client_id
$client_id = Input::get('option');
// Get all projects that have client_id = $client_id
$projects = DB::table('projects')
->where('client_id', $client_id)
->orderBy('project_name')
->lists('id','project_name');
//Return the response to the client
return Response::json($projects);
});
现在响应回到了客户端。用以下内容替换您的JavaScript。
$(document).ready(function($){
$('#select_client').change(function(){
$.get("{{ url('task/clientsprojects')}}", { option: $(this).val() },
function(data) {
var projects = $('#project_select');
projects.empty();
$.each(data, function(key, value) {
projects
.append($("<option></option>")
.attr("value",key)
.text(value));
});
});
});
});
你很高兴。
答案 1 :(得分:1)
你需要一些JavaScript (AJAX)
来实现这一点,基本上,一个select元素有一个change
事件,在更改任何值时触发,我的意思是,如果用户选择了一个项目,那么change
事件触发,您必须在change
为JavaScript
client
元素声明combo/select
事件处理程序。有很多方法可以使用事件处理程序,例如(你的select应该包含一个id为id='select_client'
):
window.onload = function(){
document.getElementById('select_client').onchange = function(){
// ...
};
};
或者您可以使用addEventListener,如果您使用jQuery
之类的库,那么您可以使用以下内容进行操作:
$(function(){
$( "#select_client" ).change(function(e) { // i.e. '/get_progects/{clientId}'
e.preventDefault();
var clients = $(this);
$.getJson('yuordomain/get_projects/' + clients.val(), function(response){
// id = 'projects' for projects combo.select
var projects = $('#projects');
projects.empty();
$.each('response.projects', function(k, v){
var option = $('<option/>', {'id':v.id, 'text':v.projectName});
projects.append(option);
});
});
});
});
当用户选择client
下拉框时,这将简单地从服务器获取数据(项目取决于所选客户端),并且要使这项工作需要声明用于获取项目dasta的路由,例如:
Route::get('/get_progects', function($client_id){
// I'm using a closure here but you should use a class method
$projects = Project::where('client_id', $client_id)
->orderBy('project_name')
->lists('id','project_name');
return Response::json(compact('projects'));
});
这是非常基本的想法,希望您现在可以在项目中实施它。