Print Page - Inrow delete button

Title: Inrow delete button
Post by: kavvson on August 01, 2014, 03:06:12 AM

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.

Title: Re: Inrow delete button
Post by: stworthy on August 01, 2014, 04:00:41 AM

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
					}
				})
			})
		}
	})
})

Title: Re: Inrow delete button
Post by: thecyberzone on November 06, 2016, 08:04:51 AM

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.

Title: Re: Inrow delete button
Post by: stworthy on November 07, 2016, 05:24:19 AM

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
                    }
                })
            })
        }
    })
})

Title: Re: Inrow delete button
Post by: daniel_john on November 08, 2016, 06:52:56 AM

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;
}
}
},

Title: Re: Inrow delete button
Post by: thecyberzone on November 10, 2016, 11:42:08 PM

Thanks stworthy, it works.

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: kavvson on August 01, 2014, 03:06:12 AM