Select Cascade Using jQuery and PHP in Laravel 4 - laravel

Question

I'm trying to populate a select box based on a previous select box value in Laravel 4. Here's what I have so far:
My JS:
var url = document.location.hostname + '/cream/public/list-contacts';
var contacts;
$.ajax({
async: false,
type: 'GET',
url: url,
dataType: 'json',
success : function(data) { contacts = data; }
});
$('#account_id').change(function() {
alert(url);
label = "<label class='control-label'>Contacts</label>";
select = $("<select name='contact_id[]' id='contact_id'>");
console.log(contacts);
for(var i in contacts) {
alert(contacts[i]['account_id']);
if(contacts[i]['account_id'] == $(this).val()) {
select.append('<option value="' + contacts[i]['id'] + '">' + contacts[i]['name'] + '</option>');
}
}
$('.contacts').html(select).prepend(label);
});
My list-contacts route declaration:
Route::get('list-contacts', 'ContactListController#contacts');
My contacts() method in my ContactListController:
public function contacts()
{
return Contact::select('contacts.id', 'contacts.account_id', DB::raw('concat(contacts.first_name," ",contacts.last_name) AS name'))->get()->toArray();
}
The form in my view:
{{ Form::open(array('action' => 'DelegatesController#store', 'class' => 'view-only pull-left form-inline')) }}
{{ Form::label('account_id', 'Account', array('class' => 'control-label')) }}
{{ Form::select('account_id', $accounts) }}
<div class="contacts"></div>
{{ Form::label('delegate_status_id', 'Status', array('class' => 'control-label')) }}
{{ Form::select('delegate_status_id', $delegate_statuses) }}
{{ Form::label('price', 'Price', array('class' => 'control-label')) }}
{{ Form::text('price', '', array('class' => 'input-small')) }}
{{ Form::hidden('event_id', $event->id) }}
{{ Form::submit('Add Delegate', array('class' => 'btn btn-success')) }}
{{ Form::close() }}
EDIT: I've modified my code above. When I visit /list-contacts it gets the correct data I need, it's just not assigning that data to the contacts variable in my AJAX request in my JS? Any help would be appreciated.
Error: This is the error that is shown in my console log for the contacts variable:
file: "/Applications/MAMP/htdocs/cream/vendor/laravel/framework/src/Illuminate/Routing/Controllers/Controller.php"
line: 290
message: ""
type: "Symfony\Component\HttpKernel\Exception\NotFoundHttpException"

Answer 1

I now have this working. It was to do with the generated URL in the AJAX request. I removed the document.location.hostname and hard coded the url without localhost.
Here's the working code for those interested:
My JS:
var url = '/cream/public/list-contacts';
var contacts;
$.ajax({
async: false,
type: 'GET',
url: url,
dataType: 'json',
success : function(data) { contacts = data; }
});
$('#account_id').change(function() {
select = $("<select name='contact_id' id='contact_id'>");
for(var i in contacts) {
if(contacts[i]['account_id'] == $(this).val()) {
select.append('<option value="' + contacts[i]['id'] + '">' + contacts[i]['name'] + '</option>');
}
}
$('.delegates .contacts').show();
$('.delegates .contacts .controls').html(select);
});
My list-contacts route declaration:
Route::get('list-contacts', 'ContactListController#contacts');
My contacts() method in my ContactListController:
public function contacts()
{
return Contact::select('contacts.id', 'contacts.account_id', DB::raw('concat(contacts.first_name," ",contacts.last_name) AS name'))->get();
}
The form in my view:
{{ Form::open(array('action' => 'DelegatesController#store', 'class' => 'delegates pull-left form-horizontal add-delegate')) }}
<div class="control-group">
{{ Form::label('account_id', 'Account', array('class' => 'control-label')) }}
<div class="controls">
{{ Form::select('account_id', $accounts) }}
</div>
</div>
<div class="control-group contacts">
{{ Form::label('contact_id', 'Contacts', array('class' => 'control-label')) }}
<div class="controls">
</div>
</div>
<div class="control-group">
{{ Form::label('delegate_status_id', 'Status', array('class' => 'control-label')) }}
<div class="controls">
{{ Form::select('delegate_status_id', $delegate_statuses) }}
</div>
</div>
<div class="control-group">
{{ Form::label('price', 'Price', array('class' => 'control-label')) }}
<div class="controls">
{{ Form::text('price', '', array('class' => 'input-small')) }}
</div>
</div>
{{ Form::hidden('event_id', $event->id) }}
{{ Form::close() }}