Inrow delete button

[kavvson]

I figured out for a link but how to manage it for a delete option

Code:

<th field ="detail" width = "120" formatter="formatDetail">Actions</th>

Code:

function formatDetail(value,row){
		var href = 'innerlist.php?list='+row.id;
		var dhref = 'dellist.php?list='+row.id;
		return '<center><a target="_blank" href="' + href + '"><span class="btn btn-primary btn-xs"><i class="fa fa-search"></i> Preview</span></a><a href="' + dhref + '" class="easyui-linkbutton" iconCls="icon-remove" plain="true" >Remove Entry</a></center>';
	}

using this

Code:

	function destroyUser(row){

		if (row){
			$.messager.confirm('Confirm','Are you sure you want to destroy this user?',function(r){
				if (r){
					$.post('destroy_user.php',{id:row.id},function(result){
						if (result.success){
							$('#dg').datagrid('reload');    // reload the user data
						} else {
							$.messager.show({    // show error message
								title: 'Error',
								msg: result.errorMsg
							});
						}
					},'json');
				}
			});
		}
	}

I tried to add onclick destroy(row.id) but seems not working somehow. 20 message boxes appears on load.

[stworthy]

Please try the code below:

Code:

function formatDetail(value,row){
	return '<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" row-id="'+row.id+'">Remove Entry</a>';
}
$(function(){
	$('#dg').datagrid({
		onLoadSuccess:function(){
			$(this).datagrid('getPanel').find('.easyui-linkbutton').each(function(){
				$(this).linkbutton({
					onClick:function(){
						var id = $(this).attr('row-id');
						// destroy the row
					}
				})
			})
		}
	})
})

[thecyberzone]

This code works fine, but if I want to insert 2 nos of button say, one for Delete and another for Save how will I reference them individually for onClick method? Because code for inRow Delete button and Save button will be different.

[stworthy]

You can attach a 'act' attribute to indicate which button is clicked.

Code:

function formatDetail(value,row){
    return '<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" act="delete" row-id="'+row.id+'">Remove</a>'+
    '<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" act="add" row-id="'+row.id+'">Add</a>';
}
$(function(){
    $('#dg').datagrid({
        onLoadSuccess:function(){
            $(this).datagrid('getPanel').find('.easyui-linkbutton').each(function(){
                $(this).linkbutton({
                    onClick:function(){
                        var id = $(this).attr('row-id');
                        var act = $(this).attr('act');
                        console.log(act)
                        // destroy the row
                    }
                })
            })
        }
    })
})        

[daniel_john]

This is what I am using for inline "CRUD":

 {
                        field: 'action', title: 'Action', width: 100, align: 'center',
                        formatter: function (value, row, index) {
                            if (row.editing) {
                                var s = '<a href="javascript:void(0)" onclick="saverow(this)">Save</a> ';
                                var c = '<a href="javascript:void(0)" onclick="cancelrow(this)">Cancel</a>';
                                return s + c;
                            } else {
                                var e = '<a href="javascript:void(0)" onclick="editrow(this)">Edit</a> ';
                                var d = '<a href="javascript:void(0)" onclick="deleterow(this)">Delete</a>';
                                return e + d;
                            }
                        }
                    },

[thecyberzone]

Thanks stworthy, it works.