Problem: Need to validate dynamically added input fields.
Here is a screenshot of the UI:
Scenario 1: Adding a new schedule, validation works perfectly.
The form is validated using a Form Request file:
public function rules()
{
$rules = [
'name' => 'required|max:255',
'due_at' => 'required|date_format:Y-m-d',
'users' => 'required',
'task_name' => 'required|max:255'
];
if($this->request->get('task_name')){
foreach($this->request->get('task_name') as $key => $val)
{
$rules['task_name.'.$key] = 'required|max:255';
$rules['task_description.'.$key] = 'required|max:255';
}
}
return $rules;
}
public function messages()
{
$messages = [];
foreach($this->request->get('task_name') as $key => $val) {
$messages['task_name.'.$key.'.max'] = 'The field labeled task name must be less than :max characters.';
$messages['task_name.'.$key.'.required'] = 'The field task name is required.';
$messages['task_description.'.$key.'.max'] = 'The field task description must be less than :max characters.';
$messages['task_description.'.$key.'.required'] = 'The field task description is required.';
}
return $messages;
}
Scenario 2: Updating an existing Schedule. This fails and I receive the following error message:
ErrorException in helpers.php line 454: htmlentities() expects parameter 1 to be string, array given (View: /Users/petestewart/Documents/Git Repos/.../resources/views/schedules/partials/_form.blade.php) (View: /Users/.../Documents/Git Repos/.../resources/views/schedules/partials/_form.blade.php)
Here is the Schedule controller update function:
/**
* Update the specified resource in storage.
*
* @param \App\Schedule $schedule
* @return Response
*/
public function update(Schedule $schedule, ScheduleRequest $request)
{
$schedule->name = $request->name;
$schedule->apiary_id = $request->apiary_id;
$schedule->due_at = $request->due_at;
$schedule->update();
// Attach users to the new schedule
$schedule->users()->sync($request->get('users'));
// Save the tasks
if($request->get('task_name')){
foreach($request->get('task_name') as $key => $task_name)
{
//if(empty($task_name)) continue; // If a task is empty then skip to the next one
// Check if task exists and update task
if(!empty($request->task[$key])){
$task = Task::find($request->task[$key]);
$task->name = $task_name;
$task->description = $request->task_description[$key];
$task->update();
}else{
// Add new task
$task = new Task();
$task->name = $task_name;
$task->description = $request->task_description[$key];
$task->schedule_id = $schedule->id;
$task->save();
}
};
};
return Redirect::to('schedules')->with('success', trans('messages.update', ['name' => 'Schedule']));
}
And here is the HTML form:
@if(isset($tasks))
@foreach($tasks as $task)
<div class="task-item row form-group">
{!! Form::hidden('task[]', $task->id) !!}
<a href="{{ route('schedules.task.delete', $task) }}" class="btn btn-danger btn-sm task-delete-btn" data-method="delete" data-confirm="Are you sure you want to delete this task?"><span class="fa fa-trash"></span></a>
<div class="col-sm-4 task-name">
{!! Form::label('task_name', 'Task Name', array('class'=>'control-label')) !!}
{!! Form::text('task_name[]', $task->name, array('class'=>'form-control')) !!}
</div>
<div class="col-sm-8">
{!! Form::label('task_description', 'Task Description', array('class'=>'control-label')) !!}
{!! Form::text('task_description[]', $task->description, array('class'=>'form-control')) !!}
</div>
</div>
@endforeach
@else
@if(Form::old('task_name'))
@foreach(old('task_name') as $key => $val)
<div class="task-item row form-group">
<a href="#" class="btn btn-default btn-sm remove-task"><span class="fa fa-minus"></span></a>
<div class="col-sm-4 task-name {!! $errors->first('task_name.'.$key, 'has-error') !!}">
{!! Form::label('task_name', 'Task Name', array('class'=>'control-label')) !!}
{!! Form::text('task_name['.$key.']', old('task_name.'.$key), array('class'=>'form-control')) !!}
{!! $errors->first('task_name.'.$key, '<p>:message</p>') !!}
</div>
<div class="col-sm-8 {!! $errors->first('task_description.'.$key, 'has-error') !!}">
{!! Form::label('task_description', 'Task Description', array('class'=>'control-label')) !!}
{!! Form::text('task_description['.$key.']', old('task_description.'.$key), array('class'=>'form-control')) !!}
{!! $errors->first('task_description.'.$key, '<p>:message</p>') !!}
</div>
</div>
@endforeach
@else
<div class="task-item row form-group">
<a href="#" class="btn btn-default btn-sm remove-task"><span class="fa fa-minus"></span></a>
<div class="col-sm-4 task-name">
{!! Form::label('task_name', 'Task Name', array('class'=>'control-label')) !!}
{!! Form::text('task_name[]', null, array('class'=>'form-control')) !!}
{!! $errors->first('task_name', '<p>:message</p>') !!}
</div>
<div class="col-sm-8">
{!! Form::label('task_description', 'Task Description', array('class'=>'control-label')) !!}
{!! Form::text('task_description[]', null, array('class'=>'form-control')) !!}
</div>
</div>
@endif
@endif
<a href="#" class="btn btn-default btn-sm" id="add-task"><span class="fa fa-plus"></span></a>
And finally the Jquery responsible for adding and removing tasks:
var TaskList = {
addTaskBtn: $('#add-task'),
completeTaskBtn: $('.task-complete-btn'),
deleteTaskBtn: $('.task-delete-btn'),
taskTemplate: '<div class="task-item row form-group"> \
<a href="#" class="btn btn-default btn-sm remove-task"><span class="fa fa-minus"></span></a> \
<div class="col-sm-4 task-name"> \
<label for="task_name" class="control-label">Task Name</label> \
<input class="form-control" name="task_name[]" type="text"> \
</div> \
<div class="col-sm-8"> \
<label for="task_description" class="control-label">Task Description</label> \
<input class="form-control" name="task_description[]" type="text"> \
</div> \
</div>',
init: function() {
this.bindUIActions();
},
bindUIActions: function() {
// Add new task item
this.addTaskBtn.click(function () {
$('.task-item:last').after(TaskList.taskTemplate);
var newTask = $('.task-item:last');
newTask.find('input[type=text]:first').focus();
return false;
});
$(document).on('click', 'a.remove-task', function (e) {
if($(this).parent().is(':first-child')){
$(this).parent().find('input[type=text]').val('');
return;
};
$(this).parent().remove();
return false;
});
// Set task as complete via AJAX
this.completeTaskBtn.change(function () {
var h3 = $(this).parent().parent().parent().parent().find('h3');
var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
var url = '/schedules/update-task';
$.ajax({
type: 'POST',
url: url,
data: {
id: $(this).attr('id'),
complete: $(this).is(':checked')? 1 : 0,
'_token': CSRF_TOKEN
},
dataType: 'JSON',
success: function (data) {
h3.find('span').remove();
h3.append(data.status_label);
}
});
return false;
});
// Delete Task via AJAX
this.deleteTaskBtn.click(function () {
var taskWrapper = $(this).parent();
var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
var url = $(this).attr('href');
if (confirm('Are you sure you want to delete this task?')) {
$.ajax({
type: 'DELETE',
url: url,
data: {
'_token': CSRF_TOKEN
},
dataType: 'JSON',
success: function (data) {
taskWrapper.remove();
}
});
}
return false;
});
},
};
Any help with validating this when updating a Schedule would be appreciated. Thanks a lot!
from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/1L3jAUw
via
IFTTT
