账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    ajax删除数据?
    27
    0

    需求是客户点击查询,获取后台数据,页面展示视频列表,时间,和地点信息。
    点击删除,删除单个视频及其信息。

    js代码:

    //查询操作
    function getInfo(pagenum,createtime,location) {

    sessionStorage.setItem('pagenum', pagenum); //保存当前页数
    $.ajax({
        type: 'post',
        url: 'http://127.0.0.1:8080/gateway/CaptureandRecord?method=getvideo',
        dataType: 'text',
        data: {
            'pagenum': pagenum,
            'createtime':createtime,
            "location":location,
        },
        async: false,
        success: function(data) {
            console.log("data"+data);
            var data = JSON.parse(data);
            console.log("data"+data);
            var list = data.videos;
    
            if (data.flag == "success") {
                $('#content .row').html("");
                for (var i = 0; i < (data.countmessage<parseInt(pagenum)*8?data.countmessage-(parseInt(pagenum)-1)*8:8); i++) {
                    $('#content .row').append(
    
                        '<div class="col-md-3">' +
                        ' <div class="view">' +
                        '<video id="'+list[i].uid+'" src="' + list[i].video + '" controls="controls">' +
                        '</video>'+
                        '</div>' +
                        '<ul>' +
                        '<li>' +
                        '<span>时间:</span>' +
                        '<span>' + data.time[i] + '</span>' +
                        '</li>' +
                        '<li>' +
                        '<span>位置:</span>' +
                        '<span>' + list[i].location + '</span>' +
                        '</li>' +
                        '<li>' +
                        '<button class="delete" onclick="delInfo(' + list[i].uid + ')" data-whatever="' + list[i].uid + '">删除</button>' + 
                        '</li>' +
                        '</ul>' +
                        '</div>'
                    )
                }
            }
    
    
    
    

    //删除操作
    function delInfo(button,id) {

    $.ajax({
        type: 'post',
        url: 'http://127.0.0.1:8080/gateway/CaptureandRecord?method=deletevideobyuid',
        dataType: 'text',
        data: {
            "uid": id,
        },
        async: true,
        success: function(data) { 
            var data = JSON.parse(data);
            if (data.flag == 'success') {
                alert('删除成功');
             $('button').parents('.col-md-3').remove();
            } else {
                alert("删除失败");
            }
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            console.log(XMLHttpRequest.status);
            console.log(XMLHttpRequest.readyState);
            console.log(textStatus);
        },
    })

    }

    查询操作中的删除按钮button在点击后调用delInfo(button,id)时,只能返回id,无法传入参数button。(传入button的作用是为了通过button按钮,找到图片的父级,将其删除)
    导致在数据库删除了,却无法在页面删除,要怎么解决?

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 喲丿妞你赞 普通会员 1楼

      在JavaScript中,我们可以使用AJAX来从服务器获取数据并将其删除。以下是一个简单的示例:

      ```javascript // 创建一个新的XMLHttpRequest对象 var xhr = new XMLHttpRequest();

      // 设置HTTP方法(GET或POST) xhr.open('DELETE', '/deleteData', true);

      // 设置请求头 xhr.setRequestHeader('Content-Type', 'application/json');

      // 发送请求 xhr.send(JSON.stringify({data: '你要删除的数据'}));

      // 监听服务器响应 xhr.onload = function() { if (xhr.status === 200) { // 请求成功 console.log(xhr.responseText); } else { // 请求失败 console.log('请求失败'); } }; ```

      在这个例子中,我们首先创建了一个新的XMLHttpRequest对象,然后设置了HTTP方法(DELETE)和请求头。然后,我们发送了一个包含要删除的数据的JSON字符串。最后,我们监听了服务器响应,当服务器响应时,我们将服务器的响应文本打印到控制台。

      注意:这个例子假设你已经有一个删除特定数据的路由,这个路由指向一个名为'/deleteData'的URL。你可能需要根据你的实际情况来调整这个URL。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部