【发布时间】：2018-03-01 12:34:59
【问题描述】：
我有一个页面来编辑帖子的管理员。 在此页面中有一些单选按钮。每个单选按钮对应一个帖子的管理员。选择单选按钮时，该管理员的详细信息在表单字段中填充
问题是，当用户访问帖子页面的此编辑管理员时，不应选中单选按钮，因此我在单选按钮中没有“已选中”属性。没关系。
但是虽然没有选中单选按钮，但在第一次访问页面时，默认情况下，表单字段中会显示最后创建的管理员的详细信息。然后，如果我选择其他管理员，则会显示该所选管理员的详细信息，但是当首先访问该页面并且在表单字段中未选中单选按钮时，会显示最后创建的管理员的详细信息。
您知道如何仅在选择相应的单选按钮时显示管理员的详细信息吗？
完整形式：
<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: "",
...
date: "",
};
$("input[name='name']").val(data.name);
$("input[name='email']").val(data.email);
...
$("input[name='date']").val(moment(data.date).format('DD MMMM YYYY - HH:mm'));
});
});
// 管理员控制器编辑方法，返回带有上述编辑管理员表单的视图：
public function edit($id)
{
$post = Post::find($id);
$administrators = Administrator::where('post_id', $id)->get();
return view('administrators.edit')
->with('post', $post)
->with('administrators', $administrators));
}
// 更新和存储管理路由
Route::get('post/edit/{id}/admins', [ 'uses' => 'AdminController@edit', 'as'=>'admins.edit']);
Route::post('post/update/{id}/admins', [ 'uses' => 'AdminController@update', 'as'=>'admins.update']);
Route::post('post/store/{id}/admins', [ 'uses' => 'AdminController@store', 'as'=>'admins.store']);
//管理员控制器更新方法：
public function update(Request $request, $id){
$this->validate($request, [
'name' => 'required|string',
...
]);
$adminToUpdate = Administrator::find($request->radiobutton);
$adminToUpdate->name = $request->name;
...
$adminToUpdate->save();
return redirect()->back();
}
}
//管理员控制器存储方法：
public function store(Request $request, $id){
$this->validate($request, [
'name' => 'required|string',
]);
$post = Post::find($id);
Administrator::create([
'name' => $request->name,
'post_id' => $post->id
]);
return redirect()->back();
}
【问题讨论】：
-
将
autocomplete="off"添加到您的表单输入中。 -
感谢您的回答，但我遇到了同样的问题。
-
您是否考虑过将您的 javascript 逻辑转换为 ajax 请求？如果是，请告诉我，我可能会为您制定逻辑。在我看来，它可以让你以更简单的方式做你想做的事。
-
感谢您的回答。是的，但我已经尝试将这个工作示例转换为 ajax，但我怀疑如何正确地做到这一点。我有这个 "$("input[name='radiobutton']").click(function() { let id = $(this).attr("id"); $.get('post/edit/'+ id+ '/admins', 函数（管理员）{ }); });"但我怀疑它是否正确以及如何在获取管理员详细信息后使用所选管理员（单选按钮）详细信息填充表单字段。
-
你试过@MajidFouladpour 的建议了吗？您应该先尝试一下，以防止表单被缓存。
标签： javascript php jquery laravel