如果存在验证错误,请检查单选按钮

时间:2018-04-05 14:12:16

标签: javascript php jquery html laravel

我有一个视图,其中有一些单选按钮,每个按钮对应一个存在于数据库中的帖子。下面还有一个单选按钮,用于创建新帖子"创建新帖子"。当页面被访问时,"创建新帖子"选中单选按钮,因此下面的其他表单字段为空

问题当用户选择与现有帖子对应的某个单选按钮时,表单字段将使用下面的jQuery在数据库中填充帖子存储的信息。如果用户更改了表单的某些信息,例如日期字段,并引入格式不正确的日期并提交表单,则会出现错误,但是"创建帖子"单选按钮变为选中状态,因此用户不会继续在编辑所选帖子的上下文中更改上下文以创建新帖子,因为单选按钮"创建新帖子"被检查。

你知道如何解决这个问题吗?

表格,每个帖子单选按钮和"创建新帖子"单选按钮和其他表单字段:

<p>{{$anyPost}}-aaaaa</p>
<form id="editposts" method="post" 
      action="{{route('posts.update', ['post_id' => $post->id])}}" enctype="multipart/form-data">
  {{csrf_field()}}
  <div>
    @foreach($posts as $post)
    <div class="form-check">
      <input {{ (old('radiobutton') && old('radiobutton') == $post->id) ? 'checked' : '' }} class="form-check-input radio" type="radio" name="radiobutton" value="{{ $post->id }}" id="{{$post->id}}">
      <label class="form-check-label">
        {{$post->title}}
      </label>
    </div>
    @endforeach
  </div>
  <div class="form-check">
    <input checked checked {{ (old('radiobutton') && old('radiobutton') == 'create_post') ? 'checked' : '' }} class="form-check-input" type="radio" name="radiobutton" id="create_post"
           value="create_post">
    <label class="form-check-label">
      Create post
    </label>
  </div>

  <!-- form fields, here is the name but are more like description, etc -->


      <div class="form-group">
         <label>Post title</label>
         <input  type="text" required class="form-control" value="{{ old('title') }}" name="title" id="tile">
      </div>
      <input type="submit" id="poststore" value="Create"/>
      <input type="submit" id="postupdate" value="Update"/>

</form>

JS根据所选帖子填充表单字段,并根据所选的单选按钮更改表单操作:

var posts = {!!  $post !!}
$("#postupdate").hide();
$("input[name='radiobutton']").click(function() {
  let id = $(this).attr("id");
  if (id == "create_post") {
    $("#postupdate").hide();
    $("#poststore").show();
    $("#editposts").attr('action', '{{route('posts.store', ['post_id' => $post->id])}}');
    $("input[name='title']").val("");
    ...
  } else {
    $("#postupdate").show();
    $("#poststore").hide();
    $("#editposts").attr('action', '{{route('posts.update', ['post_id' => $post->id])}}');
    let data = posts.find(e => e.id == id) || {
      title: "",
      ...

    };
      $("input[name='title']").val(data.title);
      ...
    }
    }); 

我有这个&#34; ->with('anyPost', $isAnyPostButtonChecked);&#34;在控制器中调试和&#34; <p>{{$anyPost}}-aaaaa</p>&#34;在表格之上,但在提交表格之前和之后,它似乎总是错误的。

public function edit($id)
{
    ...
    $isAnyPostButtonChecked = false;
    $isAnyPostButtonChecked = $isAnyPostButtonChecked && (old('radiobutton') && old('radiobutton') == $post->id);
    return view('posts.edit')
        ->with('posts', $post)
        ->with('anyPost', $isAnyPostButtonChecked);
}

&#34; {{var_dump(old(&#39; radiobutton&#39;)}}&#34;显示:

NULL

2 个答案:

答案 0 :(得分:1)

您在单选按钮上有两次checked,将其删除,然后不会检查条件是否为真。

所以,改变一下:

<input checked checked {{ (old('radiobutton') && old('radiobutton') == 'create_post') ? 'checked' : '' }} class="form-check-input" type="radio" name="radiobutton" id="create_post"
           value="create_post">

要:

<input {{ (old('radiobutton') && old('radiobutton') == 'create_post') ? 'checked' : '' }} class="form-check-input" type="radio" name="radiobutton" id="create_post"
           value="create_post">

答案 1 :(得分:1)

试试这个..

更改create_post复选框,如下所示..

<input {{ (empty(old('radiobutton')) || old('radiobutton') == 'create_post') ? 'checked' : '' }} class="form-check-input" type="radio" name="radiobutton" id="create_post"
           value="create_post">

删除checked checked静态属性,仅使用条件属性[还有更改]。如果表单刚刚填充或没有old('radiobutton')值或old('radiobutton')值为create_post,则会选中create_post复选框。

同时更新调试代码..

public function edit($id, Request $request)
{
    ...
    $isAnyPostButtonChecked = false;
    $isAnyPostButtonChecked = $isAnyPostButtonChecked || !empty($request->get('radiobutton'));
    return view('posts.edit')
        ->with('posts', $post)
        ->with('anyPost', $isAnyPostButtonChecked);
}

希望它有所帮助..如果有任何问题,请告诉我..