laravel7 H-ui模板ajax修改(资源路由)
1:列表首页设置点击事件,并将id传至后台,查询数据
<td class="f-14"><a title="编辑" href="javascript:;" onclick="admin_role_edit('角色编辑','/admin/role/{{$item->id}}/edit','1')" style="text-decoration:none"><i class="Hui-iconfont"></i></a>
2:设置路由
Route::resource('role','Role');
3:控制器代码:根据id查询数据
public function edit($id)
{
//获取id,find方法查询数据,并将数据渲染至前端
$data=RoleModel::find($id);
return view('admin.role.edit',compact('data')); }
4:视图页面,在input框value渲染数据,并将id进行隐藏,传至后台,根据id进行修改
<body>
<article class="page-container">
<form action="" method="" class="form form-horizontal" id="form-admin-role-add"> <div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>角色名称:</label>
<div class="formControls col-xs-8 col-sm-9">
<input type="text" class="input-text" value="{{$data->role_name}}" placeholder="" id="role_name" name="role_name">
</div>
</div>
{{-- 将id进行隐藏--}}
<div>
<input type="hidden" name="id" value="{{$data->id}}" id="id">
</div>
<div class="row cl">
<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
<button type="submit" class="btn btn-success radius" id="admin-role-save" name="admin-role-save"><i class="icon-ok"></i> 确定</button>
</div>
</div>
</form>
script触发ajax
//jq验证
$("#form-admin-role-add").validate({
rules:{
role_name:{
required:true,
},
},
onkeyup:false,
focusCleanup:false,
success:"valid", submitHandler:function(form){
//获取修改的角色名称的值
var role_name=$("#role_name").val();
//获取id
var id=$('#id').val();
//传_token,防止报419错误
var _token="{{csrf_token()}}"
$.ajax({
//网址
url:"/admin/role/"+id,
//发送的数据
data:{
role_name:role_name,
_token:_token,
id:id
},
//返回的数据类型
dataType:"JSON",
//发送的方式
type:'PUT',
//返回结果
success:function (res){
if (res.code==200){
layer.msg(res.message, {icon: 1, time: 1000});
location.href='/admin/role';
}else{
layer.msg(res.message, {icon: 1, time: 1000});
} }
})
}
});
5:设置路由
//资源路由
Route::resource('role','Role');
6:控制器代码
public function update(Request $request, $id)
{
//接受数据,并去除_token
$data= $request->except('_token');
// 根据id进行修改
$res=RoleModel::where('id',$data['id'])->update($data);
// 进行判断
if ($res!==false){
return (['code'=>200,'data'=>$data,'message'=>'修改成功']);
}
return (['code'=>500,'data'=>'','message'=>'修改失败']);
}
laravel7 H-ui模板ajax修改(资源路由)的更多相关文章
- 基于H.ui.Admin UI模板的网站管理后台
最近接手一个跨境电商平台开发,客户侧重电商网站UI设计,对管理后台要求不高,由我们决定选哪一款后台模板.找来找去,感觉还是H.ui靠谱一些,主要是这个模板清爽,不需要过多选择.其他的流行后台模板也看了 ...
- 后台管理UI模板
一.EasyUI easyui是一种基于jQuery的用户界面插件集合. easyui为创建现代化,互动,JavaScript应用程序,提供必要的功能. 使用easyui你不需要写很多代码,你只需要通 ...
- android自定义UI模板图文详解
不知道大家在实际开发中有没有自定义过UI模板?今天花时间研究了一下android中自定义UI模板,与大家分享一下. 每个设计良好的App都是自定义标题栏,在自定义标题栏的过程中大部分人可能都是自定义一 ...
- ecshop模板如何修改详细图解
ecshop模板如何修改?很多人在问这个问题,今天就以图解的方式给大家详细说下.相信学完之后,你会很清楚如何修改ecshop模板,不管你是初学者还是程序高手. 1, ecshop的模板结构 ecsho ...
- laravel路由与控制器(资源路由restful)
目前我们大致了解了laravel下,在开始一个Http程序需要先定义路由.之前的例子中,我们的业务逻辑都是在路由里实现,这对于简单的网站或web应用没什么问题,当我们需要扩大规模,程序变得复杂,分层的 ...
- POI根据EXCEL模板,修改内容导出新EXCEL (只支持HSSF)
package excelPoiTest; import java.io.File; import java.io.FileInputStream; import java.io.FileOutput ...
- 国外一些好用的UX/UI设计工具和资源分享
国外一些好用的UX/UI设计工具和资源分享 你今天使用的设计工具也许不再适合以后的网页和APP设计项目了.新的工具不断的推出市场,目标只有一个,让你的工作更快.更容易而且工作成效更好.今天分享的这些U ...
- jquery.ui.accordion的修改(支持展开多个)
原文:jquery.ui.accordion的修改(支持展开多个) 背景:原jquery.ui.accordion插件,最多只能展开一个,不能展开多个,后来在网上找到了一个基于它的一个修改版(http ...
- Android UI法宝的设计资源的开发
UI再次推荐设计资源.纯干,没有水~ 各种背景资源库 http://subtlepatterns.com/ ICON资源 https://www.iconfinder.com/ watermark/2 ...
随机推荐
- JavaScript 中如何将日期格式化为 DD/MM/YYYY
在 JavaScript 中要将日期格式化为 dd/mm/yyyy .需要遵循以下步骤: 使用 getDate().getMonth() 和 getFullYear() 方法获取特定日期的日.月和年. ...
- SSL证书,IIS7、IIS8,http自动跳转到HTTPS
安装"URL REWRITE2 " 伪静态模块,IIS7需要先确认是否安装 "URL REWRITE2 " 伪静态模块 , 如果您已经安装可以跳过 下载地址:h ...
- .net core部署到ubuntu 上传文件超过30MB
默认的上传文件不能超过30MB,需要修改几个地方 一.web.config中添加配置 <requestLimits maxAllowedContentLength="214748364 ...
- HTML Flex 布局
感谢原文作者:在路上de 小白 原文链接:https://www.cnblogs.com/likun123/p/9518466.html#commentform 目录 一.Flex 布局是什么? 二. ...
- 关于LVS的问题总结
关于LVS的问题总结 目录 关于LVS的问题总结 1. LVS工作模式及区别 2. LVS调度算法 3. LVS调度器你的常用算法(均衡策略) (1)固定调度算法:rr.wrr.dh.sh (2)动态 ...
- js实现用按钮控制网页滚动、以及固定导航栏效果
实现效果如下: 页面内有三个按钮,分别控制页面向上.向下移动,以及暂停,并设置有导航栏,在滚动到某一位置时显示.且当用户主动控制鼠标滑轮时,滚动效果自动关闭.本页面只是演示如何实现,进行了简单的布局, ...
- linux_15
实现基于MYSQL验证的vsftpd虚拟用户访问 配置samba共享,实现/www目录共享 使用rsync+inotify实现/www目录实时同步 LVS调度算法总结 LVS的跨网络DR实现
- charles模拟弱网
Charles操作:延迟设置 >选择相应的网络延迟设置或者自定义延迟 >开启延迟即可,如图:
- IDEA 2021 没有Allow parallel run
IDEA 2021 没有Allow parallel run 尝试运行多个客户端. 新版IDEA找不到Allow parallel run
- ansible手动添加模块
文章目录 安装ansible 验证ansible版本 定义ansible配置文件路径 为ansible添加模块 由于使用pip安装的ansible,自带的模块会比较少,有的模块会不存在,需要自己手动添 ...