根据单选按钮选择显示不同的表单不能正常工作

时间:2018-03-05 20:38:10

标签: php jquery laravel

我有一个页面来编辑帖子的管理员。

在此页面中有一些单选按钮。每个单选按钮对应一个帖子的管理员。选择单选按钮后,将在表单字段中填充该管理员的详细信息。

当用户访问帖子页面的编辑管理员时,默认情况下不应选中单选按钮,因此单选按钮中没有“已选中”属性。

在此页面中,我希望有2个表单,一个用于更新的表单和一个用于存储管理员的表单。

因此,例如当用户访问此页面时,例如有3个单选按钮:John,Jake,Create new admin。如果选择了与用户John对应的单选按钮,则应显示更新表单,其中表单字段填充了John管理员详细信息,对于Jake amdin也是如此。如果是“创建新管理员”单选按钮 如果选中,它应该显示商店表单,表单字段已重置。

问题是当用户访问帖子页面的编辑管理员时没有出现单选按钮,因此无法选择任何单选按钮,因此不会显示任何表单。你知道如何正确组织这两个表格,以便在选择对应的单选按钮时出现每个表格吗?

//更新表格

<form id="update_admins" method="post" class="clearfix"
              action="{{route('admins.update', ['post_id' => $post->id])}}" >
            {{csrf_field()}}
            <div class="form-row">
                <div class="form-group col col-lg-6">
                    <label for="admins">Post admins</label>

                    @foreach($administrators as $admin)
                        <div class="form-check">
                            <input autocomplete="off" class="form-check-input radio" type="radio" name="radiobutton" value="{{ $admin->id }}" id="{{$admin->id}}">
                            <label class="form-check-label" for="exampleRadios1">
                                {{$admin->name}}
                            </label>
                        </div>
                    @endforeach

                    <div class="form-check">
                        <input autocomplete="off" class="form-check-input" type="radio" name="radiobutton" id="update_admin"
                               value="update_admin">
                        <label class="form-check-label" for="exampleRadios2">
                            Create new admin
                        </label>
                    </div>

                </div>
            </div>
            <div class="form-group">
                <label for="name">Name</label>
                <input autocomplete="off" type="text" required class="form-control" value="{{ $admin->name }}" name="name" id="name">
            </div>
            <!-- ...the other form fields -->
            <input type="submit" class="btn btn-primary btn float-right" value="Update admin"/>
        </form>

//存储表格

<form id="create_admins" method="post" class="clearfix"
              action="{{route('admins.store', ['post_id' => $post->id])}}" >
            {{csrf_field()}}
            <div class="form-row">
                <div class="form-group col col-lg-6">
                    <label for="admins">Post admins</label>

                    @foreach($administrators as $admin)
                        <div class="form-check">
                            <input autocomplete="off" class="form-check-input radio" type="radio" name="radiobutton" value="{{ $admin->id }}" id="{{$admin->id}}">
                            <label class="form-check-label" for="exampleRadios1">
                                {{$admin->name}}
                            </label>
                        </div>
                    @endforeach

                    <div class="form-check">
                        <input autocomplete="off" class="form-check-input" type="radio" name="radiobutton" id="store_admin"
                               value="store_admin">
                        <label class="form-check-label" for="exampleRadios2">
                            Create new admin
                        </label>
                    </div>

                </div>
            </div>
            <div class="form-group">
                <label for="name">Name</label>
                <input autocomplete="off" type="text" required class="form-control" value="{{ old('name') }}" name="name" id="name">
            </div>
            <!-- ...the other form fields -->
            <input type="submit" class="btn btn-primary btn float-right" value="Store admin"/>
        </form>

JS:

$(document).ready(function () {
            // receive array with administrators details from the AdministratorController
            var admins = {!!  $administrators !!}

            $("#create_admins").hide();
            $("#update_admins").hide();

            $("input[name='radiobutton']").click(function() {
                let id = $(this).attr("id");

                if (id == "store_admin") {

                    $("input[name='name']").val("");
                } else {
                    let data = admins.find(e => e.id == id) || {
                        name: "",
                            ...
                    };

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

            });

1 个答案:

答案 0 :(得分:1)

通过控制器操作识别表单

@if(\Route::getCurrentRoute()->getActionMethod()  == 'create')
    //show create form
@else
   //show edit form
@endif