vLookup List view with calc column link to Child Items

[Brett]

HI Alexander,

Regarding my last Post about vLookup Child Links in a List View:

Is there a way that I can display the links to the Child Items without using the spjs-Utility? For example: in a calculated column? Or writing the link to a Rich Multi-line Text column?

The issue I have is when using a custom List View solution (DataTables) rendered with DVWP, which wipes out your spjs-utility and the child items won’t load.

So a direct link in a column of the Parent List would be great, if it can be done?
If you need some screen-grabs for visual ref, let me know.

I await your response 🙂

[Alexander Bautz]

Hi,
The vLookup solution works by running a “live” query each time you load the list view. There are no actual references to the child items in the parent itself (apart from the value used in the query to search for the children). This mean you need a completely different solution to make this work without vLookup.

What you could do is to use code like this in your parent form to create a button (HTML Section in a tab):

<div style="text-align:right;"><input type="button" onclick="addChild()" value="Add new child without vLookup" /></div>

Then use this code in Custom JS:

function addChild(){
    var res, currItems, b = [];
    res = spjs.utility.addItem({"listName":"DFFS_TestList","data":{"Title":"New child item added without vLookup"}});
    if(res.success){
        currItems = $("<div>"+getFieldValue("Links")+"</div>").find("a");
        $.each(currItems,function(i,item){
            b.push("<a href='"+$(item).attr("href")+"' target='_blank'>Child item</a>");
        });
        b.push("<a href='"+res.listURL+"/DispForm.aspx?ID="+res.id+"' target='_blank'>Child item</a>");
        setFieldValue("Links",b.join("<br>"));
        var options = {
            title: "My Dialog Title",
            url: res.listURL+"/EditForm.aspx?ID="+res.id
        };
        SP.UI.ModalDialog.showModalDialog(options);
    }
}

Please note that you must change the field name “Links” to match a Rich text field in your list, and the list name “DFFS_TestList” to match either the display name or the GUID of your child list.

I hope you can make use of this code snippet.

Alexander

[Brett]

Hi Alexander,
Thanks for your prompt response.
I tried your code, which is for creating New Child Items, thanks for coding that.
When I click Save, the dialog box doesn’t close, though it does create 3x of the same Child Item.
Beer money has been sent for your time.

I knew this would be a difficult one, so I will explain more and see if this can be done.
I don’t have an issue with creating the Child items, I have existing child items already created with vLookup and they display fine in the generic Parent List View with your vLookup ListView script is located.

My issue is when I render that List View using jQuery and Datatables, the Child Items do not display.
So I’m trying to write the link to each existing Child Item within a column of the Parent List View by either Calculated or DVWP.

If there is a JavaScript solution that can write a link to a specific parent column once a child item is created, please let me know either way 🙂

Many thanks.

Attachments:

1. 

   Working.png
   

2. 

   NotWorking.png
   

[Alexander Bautz]

I see. Use this code snippet in Custom JS:

function vLookupLinksInRTE(sourceFIN,targetFIN){
	if(spjs.vLookup.dataObj[sourceFIN] !== undefined){
		var b = [], c, item, title, link;
		$(".vLookupViewBtn_"+sourceFIN).each(function(i,td){
			c = $(td).find("a").attr("onclick");
			link = c.substring(23,c.indexOf(",")-1);
			item = spjs.vLookup.dataObj.vLookupTasks[spjs.dffs.data.thisItemID].items[link.split("=")[1]];
			if(item !== undefined){
				title = item.Title;
			}else{
				title = "Child item";
			}		
			b.push("<a href='"+link+"' target='_blank'>"+title+"</a>");
		});
		setFieldValue(targetFIN,b.join("<br>"));
	}	
}

function dffs_PreSaveAction(){
    vLookupLinksInRTE("vLookupTasks","MultilineRich");
}

Change “vLookupTasks” to match your vLookup column name and “MultilineRich” to match your rich text field where you want to store the links.

Please note that this will only work when adding children from EditForm. It is possible to adapt the code to work in DispForm as well, but it will require some changes.

Let me know how this works out.
Alexander

[Brett]

Hi Alexander, thanks for providing this code but it still won’t write the link to the column.
Pasted your code in custom JS of the EditForm of the Parent List, changed the column names in the vLookupLinksInRTE line, to “_vLookupID”,”LinktoActions” (multi-line text column), saved config.
From editform of Parent item, added a child item using the vLookup link configured on the Edit Form, saved child item, child dialog closed, Note: “LinktoActions” column is showing as blank, saved item.

From ListView: LinktoActions column remains empty.

Am I doing this correctly?

Another way to look at this:
Exporting the List to Excel, we would like the Child Items need to be shown in Excel also.

Is there anything else I can try?

Thanks for your efforts with this.

[Alexander Bautz]

Hi,
Could it be that you have multiple versions of the function “dffs_PreSaveAction” in the custom js?

What do you see if you add an alert above this line:

alert(b.join("<br>"));
setFieldValue(targetFIN,b.join("<br>"));

What do the alert show?

PS: Do you have the view item button visible in the form? – the code snippet reads the URL from this “link”.

Alexander

[Brett]

Hi Alexander,

It is now working!
I managed to find why it wasn’t working, changed vLookupTasks to the name of my internal vLookup column name (I was using the _vLookupID column.)

Also needed to change the item variable text “vLookupTasks” to the same name.
So 2x locations in the code.

Thank you for this, very much appreciated.

[Brett]

And to follow on:

What would I need to add to your script to replace the hyperlink Title to a hyperlink ID number of the Child List Item?
Is it something with the item variable?

Thanks,

Brett

[Alexander Bautz]

Hi,
I’m not 100% sure what you mean, but to replace the hyperlink with only the ID you change this line:

b.push("<a href='"+link+"' target='_blank'>"+title+"</a>");

like this:

b.push(link.split("=")[1]);

If you want the full URL but not the <a> tag you can use this code:
like this:

b.push(link);

Alexander

[Author]

Posts