我有一个页面来编辑帖子的管理员。在此页面中,可以更新帖子的管理员,但也可以为帖子创建新的管理员。
在此页面中有一些单选按钮。每个单选按钮对应一个帖子的管理员。选择单选按钮后,将在表单字段中填充该管理员的详细信息。还有一个单选按钮"创建新的管理员"选择何时重置表单字段,以便用户可以插入值以创建新的管理员。
在这个页面中,我有下面的表格,允许更新,并根据单选按钮选择创建一个新的管理员。如果选择的单选按钮是"创建新的管理员"字段已重置,因此用户可以插入新的管理员。如果选择了其他单选按钮,则表单中会显示所选管理员的详细信息。
的疑问:
我有一些JS根据单选按钮选择更改了表单的操作,但我遇到了这种方法的一些问题,所以我试图将下面的代码分成两种不同的形式而不只是一种形式。
所以我想要一个表单进行更新,另一个表单存储管理员。当页面被访问时,不应该呈现任何形式,只有单选按钮。然后,当用户通过单选按钮选择管理时,应该显示更新表单。如果用户选择"创建新管理员"单选按钮应显示商店表单,如果可见,则更新表单隐藏。
但我怀疑如何正确地做到这一点,如何正确地完成这一点,以便重用一些代码。例如,重复两次此代码似乎不正确:
@foreach($administrators $admin)
<div class="form-check">
<input class="form-check-input" type="radio" name="radiobutton" id="{{$admin->id}}" value="">
<label class="form-check-label" for="">
{{$admin->name}}
</label>
</div>
@endforeach
更新和创建的表单:
<form method="post" class="clearfix" action="{{route('admins.update', ['id' => $post->id])}}" enctype="multipart/form-data">
{{csrf_field()}}
@foreach($administrators $admin)
<div class="form-check">
<input class="form-check-input" type="radio" name="radiobutton" id="{{$admin->id}}" value="">
<label class="form-check-label" for="">
{{$admin->name}}
</label>
</div>
@endforeach
<div class="form-check">
<input class="form-check-input" type="radio" name="radiobutton" id="create_administrator"
value="option2">
<label class="form-check-label" for="exampleRadios2">
Create new administrator
</label>
</div>
<div class="form-group">
<label for="name">Name</label>
<input type="text" required class="form-control" value="{{ $admin->name }}" name="name">
</div>
<!-- below I have more form fields like administrator name, email, etc -->
<input type="submit" id="adminStoreButton" class="btn btn-primary" value="Create"/>
<input type="submit" id="adminUpdateButton" class="btn btn-primary" value="Update"/>
</form>
以上逻辑的Js:
$(document).ready(function () {
$("#adminStoreButton").hide();
var admins = {!! $admin !!}
$("input[name='radiobutton']").click(function() {
if($(this).attr("id") == "create_administrator"){
$("#adminUpdateButton").hide();
$("#adminStoreButton").show();
$("#edit_administrator").attr('action', '{{route('admins.store', ['post_id' => $post->id])}}');
}
else{
$("#adminUpdateButton").show();
$("#adminStoreButton").hide();
$("#edit_administrator").attr('action', '{{route('admins.update', ['post_id' => $post->id])}}');
}
let id = $(this).attr("id");
let data = admins.find(e => e.id == id) || {
name: "",
email: "",
...
};
$("input[name='name']").val(data.name);
$("input[name='email']").val(data.email);
...
});
});
答案 0 :(得分:0)
id
答案 1 :(得分:0)
我会解决那个服务器端
<?php
if( $_POST['radiobutton'] == 'value2' ) {
// create
}
else {
// update
}
?>
答案 2 :(得分:0)
如果我理解得很好,你想“将下面的代码划分为两种不同的形式而不只是一种形式”。
通常我建议使用Laravel-Collective Form类,它带有 Form :: open 和 Form :: model (用于表单模型绑定)。
将这两种方法与刀片模板引擎指令@include一起使用,您可以编写一个部分块并随时重复使用它,只需创建一个部分文件(例如form-body) .blade.php)与表单的主体(打开的“form”标签和“input type ='submit'”之间的部分。)
请注意,两个(Collective Form和Blade)不需要一起使用,如果您愿意,可以只使用其中一个或两者一起使用(我建议两者同时最大化代码的写入速度)。
类似的东西:
{!! Form::open(['url' => 'foo/bar', 'method' => 'put']) !!}
@include('form-body.blade.php')
{!! Form::submit('Save') !!}
{!! Form::close() !!}
或者
{!! Form::model($user, ['route' => ['user.update', $user->id]]) !!}
@include('form-body.blade.php')
{!! Form::submit('Update') !!}
{!! Form::close() !!}
希望这会对你有所帮助。