create hyperlink column default with button or image on sharepoint list 2013

Question

We had one list name as "Data" with columns. under list, one column (Access) we need to fix with default data(URL). means when user click on "New Item", access column data must be default URL. And also in place of URL column, can we put image or button. So when user click on default "Access" column, it will open new form.

Please suggest, how to achieve with SharePoint designer 2013.

Answer 1

We can use JSLink to replace the "Access" hyperlink column with a button column, and click the button we can open the url in new tab. Add the code below into a script editor web part into the list view page.

<script type="text/javascript">
(function () { 
    // Create object that have the context information about the field that we want to change it's output render  
    var fieldContext = {}; 
    fieldContext.Templates = {}; 
    fieldContext.Templates.Fields = { 
        // Apply the new rendering for Available field on List View 
        "Access": { "View": fieldTemplate } 
    }; 
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(fieldContext);
})(); 

// This function provides the rendering logic for list view 
function fieldTemplate(ctx) { 
    var url= ctx.CurrentItem["Access"];
    var desc=ctx.CurrentItem["Access.desc"];
    if(url==""){
        url="allitems.aspx";
        desc="All Items";
    }
    return "<button onclick='window.open(\""+url+"\",\"_blank\")'>"+desc+"</button>";   
}
</script>

The "Access" field settings.