JS 中给easyui一列添加按钮

在做库房管理系统的过程中要求点击表格最后一列归还物品,如下图所示:
这里写图片描述

下面就介绍一下如何给easyui中操作列添加按钮:

function click() {
   
    //判断文本框输入是否为空
    if ($('#bb').value = "") {
        alert("商品不能为空");
        return;
    }

    var outgoing = $("#bb").val();

    $('#dg').datagrid({

        //datagrid分页-李娜-2017年8月23日14:40:16
        //把搜索框中的内容提交到后台对数据进行过滤   

        url: '/Return/ShowBorrowInfo?itemName=' + outgoing, //获取数据地址
        //data: "password=" + $("#bb").val(),
        dataType: 'json',
        width: "100%", //宽度
        striped: true, //把行条纹化(奇偶行背景色不同)
        idField: 'quesID', //标识字段
        loadMsg: '正在加载用户的信息.......', //从远程站点加载数据是,显示的提示消息
        pagination: true, //数据网格底部显示分页工具栏
        singleSelect: false, //只允许选中一行
        pageList: [10, 20, 30, 40, 50<
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 13
    评论
要在EasyUI框架实现删除功能,你可以使用DataGrid组件提供的工具栏按钮和行操作按钮。以下是一个示例代码: ```html <!DOCTYPE html> <html> <head> <title>文件资源管理系统</title> <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-easyui/1.9.21/themes/default/easyui.css"> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easyui/1.9.21/jquery.easyui.min.js"></script> </head> <body> <h2>文件资源管理系统</h2> <table id="fileTable" class="easyui-datagrid" style="width:500px;height:300px" url="get_files.php" toolbar="#toolbar" pagination="true" rownumbers="true" fitColumns="true"> <thead> <tr> <th field="name" width="50%">文件名</th> <th field="size" width="30%">大小</th> <th field="dateModified" width="20%">修改日期</th> <th field="action" width="10%">操作</th> </tr> </thead> </table> <div id="toolbar"> <a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true">上传文件</a> <a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true">重命名</a> <a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="deleteFile()">删除文件</a> </div> <script type="text/javascript"> function deleteFile() { var selectedRow = $('#fileTable').datagrid('getSelected'); if (selectedRow) { $.messager.confirm('确认', '确定要删除选的文件吗?', function(r) { if (r) { // 发送删除请求到服务器 // 这里需要你实现相应的服务器端接口来处理文件删除 $.post('delete_file.php', { fileId: selectedRow.id }, function(result) { if (result.success) { // 删除成功后刷新数据表格 $('#fileTable').datagrid('reload'); } else { $.messager.alert('错误', '删除文件失败!', 'error'); } }, 'json'); } }); } else { $.messager.alert('提示', '请先选择要删除的文件!', 'info'); } } $(function(){ $('#fileTable').datagrid({}); }); </script> </body> </html> ``` 上述代码,我们给DataGrid添加了一个操作,其放置了一个"删除文件"的按钮。当用户点击删除按钮时,会弹出确认对话框,询问用户是否确定要删除选的文件。如果用户确认删除,则会向服务器发送一个异步请求来执行文件删除操作。在服务器端,你需要实现相应的接口(例如`delete_file.php`)来处理文件删除的逻辑。 请注意,上述示例的服务器端接口和数据源URL需要根据你的实际情况进行调整。另外,还需要引入EasyUI的messager组件来显示提示框。确保EasyUI框架已正确加载和初始化。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 13
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

诗琪小姐姐

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值