Delete Button with jslink to delete related item

[Douglenator83]

Hello,

i got a little problem to delete items with jslink in an related items list.

Thats my jslink code:

Code: Select all

(function () {
    function view(ctx, field) {
        // Get the markup that is by default rendered for the "Edit" field.
        var editButtonHtml = (new ComputedFieldRenderer(field.Name)).RenderField(
            ctx, field, ctx.CurrentItem, ctx.ListSchema);
        if (editButtonHtml.replace(/ /gi,'')) {
            // If the edit button is displayed, it means that the user has edit permissions. 
            // Then display a delete button also.
            var deleteButtonHtml =
                "<a href='#' title='Delete'><img src='/_layouts/15/images/delitem.gif' " +
                "onclick='javascript:window.deleteItem(\"" + ctx.ListTitle + "\",this);'/></a>";
                return editButtonHtml + "&nbsp;&nbsp;" + deleteButtonHtml;
        }
        return editButtonHtml;
    }
    var overrideCtx = {};
    overrideCtx.Templates = {};
    overrideCtx.Templates.Fields = {
        'Edit': {
            'View': view
         }
    };
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(overrideCtx);
})();

window.deleteItem = function (listName, element) {
    if (DeleteItemConfirmation()) {
        // Extract the id of the clicked list item.
        var id = $(element).closest("tr[iid]").attr("iid").split(',')[1];
        $.ajax({
            url: window._spPageContextInfo.webServerRelativeUrl +
                "/_api/web/lists/getbytitle('" + listName + "')/items(" + id + ")",
            type: "POST",
            headers: {
                "ACCEPT":"application/json;odata=verbose",
                "content-type":"application/json;odata=verbose",
                "X-RequestDigest": $("#__REQUESTDIGEST").val(),
                "IF-MATCH":"*",
                "X-HTTP-Method":"DELETE"
            },
            success: function(data) {
                $(element).closest("tr[iid]").remove();
            },
            error: function(error) {
                console.log(JSON.stringify(error));
            }
        });
    }
}

The code works fine in the listview but not not in any form.

I get the following error:

on this line of code

Code: Select all

   if (DeleteItemConfirmation()) {
        // Extract the id of the clicked list item.
        var id = $(element).closest("tr[iid]").attr("iid").split(',')[1];

Script error: object expected

Can u help me plz?

[Nikita Kurguzov]

Dear Douglenator,
Unfortunately, JS Link is not supported on any custom forms, either ours or created with SharePoint designer.

[Douglenator83]

Is there any other way to do this ?
The easiest workaround would be a delete checkbox to delete files...
but i think this is not a verygood way to do that

Do u have a better idea for me?

[Nikita Kurguzov]

Dear Douglenator,
What exactly do you need to achieve? Delete multiple files at once?

Normally, the users should be able to delete files one by one like this:

RelatedItemsDelete.png (34.26 KiB) Viewed 2415 times