Laravel - Проверка значения ввода текста с помощью значения базы данных

Question

Я использую Laravel -5,8 для веб-приложения. В проекте я хочу, чтобы пользователи ставили цели, используя эти две таблицы:

class GoalType extends Model
{   
  protected $table = 'goal_types';
  protected $fillable = [
              'name',
              'parent_id',
              'is_current',
              'max_score',
          ];

   public function children()
   {
     return $this->hasMany('App\Models\GoalType', 'parent_id');
   }

  public function goals()
  {
    return $this->hasMany('App\Models\Goal');
  }
}

class Goal extends Model
{
  protected $table = 'appraisal_goals';
  protected $fillable = [
              'goal_type_id',
              'employee_id',
              'weighted_score',
              'goal_description',
              'goal_title',
          ];

  public function goaltype()
  {
    return $this->belongsTo('App\Models\GoalType','goal_type_id');
  }  
}

Как показано на диаграмме ниже, GoalType является иерархической таблицей. Только родитель имеет max_score:

Контроллер

public function create()
{
 $userCompany = Auth::user()->company_id;
 $categories = GoalType::with('children')->where('company_id', $userCompany)->whereNull('parent_id')->get();

return view('goals.create')
        ->with('categories', $categories);
}
public function store(StoreGoalRequest $request)
{
 $employeeId = Auth::user()->employee_id;
    $goal = new Goal();
    $goal->goal_type_id             = $request->goal_type_id;
    $goal->employee_id              = $employeeId;
    $goal->weighted_score           = $request->weighted_score;
    $goal->save();

        Session::flash('success', 'Goal is created successfully');
        return redirect()->route('goals.index');
}

create.blade

<div class="row">
        <div class="col-md-12">
        <!-- general form elements -->
         <div class="card card-secondary">
            <!-- /.card-header -->
            <!-- form start -->
          <form  method="POST" action="{{route('goals.store')}}">
          @csrf
       <div class="card-body">
        <div class="form-body">
        <div class="row">
            
          <div class="col-12 col-sm-6">
            <div class="form-group">
              <label class="control-label"> Goal Type:<span style="color:red;">*</span></label>
              <select id="goal_type" class="form-control" name="goal_type_id">
                <option value="">Select Goal Type</option>

                @foreach ($categories as $category)
                @unless($category->name === 'Job Fundamentals')
                  <option disabled="disabled" value="{{ $category->id }}" {{ $category->id == old('category_id') ? 'selected' : '' }}>{{ $category->name }}</option>

                  @if ($category->children)
                    @foreach ($category->children as $child)
                    @unless($child->name === 'Job Fundamentals')
                      <option value="{{ $child->id }}" {{ $child->id == old('category_id') ? 'selected' : '' }}>&nbsp;&nbsp;{{ $child->name }}</option>
                    @endunless
                    @endforeach
                  @endif
                  @endunless
                @endforeach
              </select>
            </div>
          </div>    
            
          <div class="col-12 col-sm-6">
            <div class="form-group">
              <label class="control-label"> Goal Title:<span style="color:red;">*</span></label>
              <input  type="text" name="goal_title" placeholder="Enter goal title here" class="form-control">
            </div>
          </div>
            
          <div class="col-sm-12">
            <div class="form-group">
                <label>Goal Description</label>
                <textarea rows="2" name="goal_description" class="form-control" placeholder="Enter Goal Description here ..."></textarea>
            </div>
          </div>

          <div class="col-12 col-sm-4">
            <div class="form-group">
              <label class="control-label"> Weight:</label>
              <input  type="number" name="weighted_score" placeholder="Enter weighted score here" class="form-control">
            </div>
          </div>  


       </div>
     </div>
    </div>          
    <!-- /.card-body -->
    <div class="card-footer">
      <button type="submit" class="btn btn-primary">{{ trans('global.save') }}</button>
      <button type="button" onclick="window.location.href='{{route('goals.index')}}'" class="btn btn-default">Cancel</button>
    </div>           
       
    </form>
    </div>
    <!-- /.card -->
   </div>
   <!--/.col (left) -->
  </div>

На диаграмме выше раскрывающийся список GoalType (goal_type_id) содержит все дочерние поля из goal_types. Чего я хочу добиться, так это:

1. Когда в раскрывающемся списке выбран тип цели, система переходит к таблице целей (цель). Он отображает итоговое значение weighted_score на основе employee_id и goal_type_id.

2. Когда пользователь пытается ввести данные в текстовое поле веса (weighted_score), приложение добавляет значение в текстовом поле к результату в номер один (1) выше. Если результат больше, чем max_score в goal_types (GoalType) на основе родительского max_score, отображается сообщение об ошибке.

Как мне этого добиться?

Спасибо.

Answer 1

Если вы хотите заархивировать его без вызовов AJAX, вы можете отправить форму при изменении поля выбора: <select name="goal_type_id" onchange="this.form.submit()">

В контроллере вы можете перехватить старый ввод с помощью old("goal_type_id"). Теперь вы можете запросить / рассчитать общее значение weighted_score.

Answer 2

Вы должны использовать AJAX для этого, если вы не знакомы с ним, вы можете прочитать об этом здесь: https://www.w3schools.com/xml/ajax_intro.asp

Я бы также использовал JQuery чтобы сделать вещи проще. Таким образом, вы можете сделать это следующим образом:

1. Когда в раскрывающемся списке выбран тип цели, система переходит к таблице целей (Цель). Он отображает итоговое значение weighted_score на основе employee_id и goal_type_id.

здесь вы должны отправить в бэкэнд тип цели, выбранный пользователем, для этого установите событие изменения в комбинированном ящике, который вызывает AJAX request:

$('#goal_type').change(request_goals($('#goal_type').val()))

И функция request_goals должна быть такой:

function request_goals(){
    $.ajax({
    method: "GET",
    dataType: 'json',
    url: /*YOUR CONTROLLER URL*/,
    error: function(jqXHR, textStatus, errorThrown) {
        console.log(errorThrown);
        console.log("error");
    },
    success: function (response) {
        /* HERE DO WHAT YOU NEED */
    }
}

Вам нужно будет создать маршрут и функцию контроллера, которая возвращает данные, которые вы need.

Когда пользователь пытается ввести данные в текстовое поле веса (weighted_score), приложение добавляет значение в текстовом поле к результату в номере один (1) выше. Если результат больше, чем max_score в goal_types (GoalType) на основе родительского max_score, то отображается сообщение об ошибке.

Здесь вы должны сделать тот же трюк, установить обработчик событий в weighted_score поле, которое отправляет запрос ajax.

Я надеюсь, что это может помочь вам.