16.10.2013 New version: https://spjsblog.com/2013/10/16/display-information-from-another-list-based-on-a-lookup-column-connection-updated-version/
23.05.2010 Updated to fix hyperlink columns (splits the hyperlink by the first “, ” to separate URL and description).
20.05.2010 Updated to support hyperlink columns formatted as hyperlink and hiding of empty “rows”.
26.02.2010 Updated to support multiple lookup columns.
Here is is an example on how to display information from another list based on a lookup column connection.
You have a single choice lookup column connection to another list. When selecting a value from the lookup column, the script pulls the information from the “lookup source” and displays it below the lookup column.
As always we start like this:
Create a document library to hold your scripts (or a folder on the root created in SharePoint Designer). In this example i have made a document library with a relative URL of “/test/English/Javascript” (a sub site named “test” with a sub site named “English” with a document library named “Javascript”):
The jQuery-library is found here. The pictures and the sourcecode refers to jquery-1.3.2.min. If you download another version, be sure to update the script reference in the sourcecode.
The scripts “interaction.js” and “stringBuffer.js” is created by Erucy and published on CodePlex.
The sourcecode for the file “PullInformationFromConnectedList.js” is found below.
Add a CEWP below the list form in NewForm or EditForm, and insert this code:
<script type="text/javascript" src="../../Javascript/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="../../Javascript/interaction.js"></script>
<script type="text/javascript" src="../../Javascript/stringBuffer.js"></script>
<script type="text/javascript" src="../../Javascript/PullInformationFromConnectedList.js"></script>
<script type="text/javascript">
// Init all fields
fields = init_fields();
/* Object containing all arguments for the function
* "arrFinAndDispName" is an array on format "FieldInternalName|Display name" from the list the lookup is pulling information from
* "ListGuid" is the list Guid or the displayName of the list the lookup is pulling information from
* "LookupFIN" id the FieldInternalName of the lookup column.
*/
var argumentObj = {'arrFinAndDispName':['Title|Element title',
'TextField1|My text field 1',
'TextField2|My text field 2',
'TextField3|My text field 3',
'Responsible|Responsible',
'RichText|Rich text multi line'],
'ListGuid':'405EC50E-FAF7-4473-8D50-F9E725BEAA9B',
'LookupFIN':'Lookup'};
init_displayInfo(argumentObj);
</script>
You must change the list Guid of the “target list” to match your list, the “arrOfFieldsToReturn” to match your fields and the “Lookup column” FieldInternalName.
To use for multiple lookup columns, just build another “argumentObj”, and call the function “init_displayInfo” again with the new “argumentObj”.
The sourcecode for the file “PullInformationFromConnectedList.js” looks like this:
/* Display information from another list based on a lookup column connection
* ----------------------------------------------------
* Created by Alexander Bautz
* alexander.bautz@gmail.com
* https://spjsblog.com
* Copyright (c) 2009-2010 Alexander Bautz (Licensed under the MIT X11 License)
* Version: 1.3
* LastMod: 23.05.2010
* LastChange: Updated the hyperlink handling (splits the hyperlink by the first ", " to separate URL and description
* ----------------------------------------------------
* Must include reference to:
jQuery - http://jQuery.com
interaction.js and stringBuffer.js - http://spjslib.codeplex.com
*/
function init_displayInfo(argObj){
if(typeof(fields)=='undefined')fields = init_fields();
// On load - For EditForm or for page refresh on formvalidation
var inpHidID = $(fields[argObj['LookupFIN']]).find('input').attr('optHid');
var selID = $("*[id='"+inpHidID+"']").val();
displayInfo(selID,argObj);
// Bind events to the selection of elements
if($(fields[argObj['LookupFIN']]).find('img').length==0){
// Lookup when it contains less than 20 elements
$(fields[argObj['LookupFIN']]).find('select').change(function(){
var selID = $(this).val();
displayInfo(selID,argObj);
});
}else{
// Lookup when it contains more than 20 elements
// Enter the lookup value in the input field
$(fields[argObj['LookupFIN']]).find('input').keydown(function(e){
if(e.keyCode==13){
var inpHidID = $(this).parents('tr:first').find('input').attr('optHid');
var selID = $("*[id='"+inpHidID+"']").val();
displayInfo(selID,argObj);
}
});
// Select from the dropdown
$(fields[argObj['LookupFIN']]).find("img").click(function(){
// The "options container" is shared between all lookup column
$("*[id='_Select']").bind("dblclick keydown", function(e){
var selID = $(this).val();
displayInfo(selID,argObj);
});
});
}
}
function displayInfo(selectedID,argObj){
var strRaw = getListItemFromLookup(selectedID,argObj);
// Remove existing preview
$("#customListAbstract_"+argObj['LookupFIN']).remove();
str = "";
// Display the selected element
if(strRaw!=false){
$.each(strRaw,function(fin,val){
if(val!=' '){
if(val.indexOf('http')==0){
var part_1 = val.substring(0,val.indexOf(', '));
var part_2 = val.substring(val.indexOf(', ')+2);
val = "<a title='Opens in a new window' href='"+part_1+"' target='_blank'>"+part_2+"</a>";
}
str += "<tr style='font-size:10px;color:gray'>",
str += "<td valign='top' width='200px' style='border-bottom:1px silver solid;border-right:1px silver solid;padding:2'>"+fin+"</td>";
str += "<td valign='top' style='padding:2;border-bottom:1px silver solid'>"+val+"</td>";
str += "</tr>";
}
});
str = "<tr id='customListAbstract_"+argObj['LookupFIN']+"'>"+
"<td colspan='2' style='padding:5 10 5 10'>" +
"<table width='580' cellspacing='0' cellpadding='0' style='border-top:1px silver solid'>"+str+"</table>" +
"</td></tr>"
}
// Insert the preview below the lookup column
$(fields[argObj['LookupFIN']]).after(str);
}
function getListItemFromLookup(LookupID,argObj){
var arrFin = [];
var arrDispName = [];
// Split the array in separate arrays for InternalName and DisplayName
$.each(argObj['arrFinAndDispName'],function(i,item){
split = item.split('|');
arrFin.push(split[0]);
arrDispName.push(split[1]);
});
// Get the correct list item
wsBaseUrl = L_Menu_BaseUrl + '/_vti_bin/'; // Change this path if the list is not in the current site
var item = getItemById(argObj['ListGuid'],LookupID,arrFin);
if(item!=null){
var ret = {};
$.each(arrFin,function(i,fin){
var thisVal = item[fin];
if(thisVal==null){
thisVal=' ';
}else if(thisVal.indexOf(';#')>0){
thisVal=thisVal.substring(thisVal.indexOf(';#')+2);
}
ret[arrDispName[i]]=thisVal;
});
return ret;
}else{
return false;
}
}
function init_fields(){
var res = {};
$("td.ms-formbody").each(function(){
if($(this).html().indexOf('FieldInternalName="')<0) return;
var start = $(this).html().indexOf('FieldInternalName="')+19;
var stopp = $(this).html().indexOf('FieldType="')-7;
var nm = $(this).html().substring(start,stopp);
res[nm] = this.parentNode;
});
return res;
}
Save as “PullInformationFromConnectedList.js”, mind the file extension, and upload to the script library as shown above.
Ask is anything is unclear.
Regards
Alexander
Superior & innovative work, Alexander!
Charlie Epes
Can this accomodate several (an array of) lookup fields?
Charlie Epes
See updated code.
Alexander
another great one. Now logically I should be able to grab any one of the displayed values and write it to a field. How would I grab the value? How do I refer to it?
Add an id attribute to the TD’s in line 59-60 and get the values like this:
var value = $("#myCustomID").text();Alexander
Hi Alekxander,
i don´t get it/don´t know it where to add the ID Attribute. Can you plese give me the code line?
Maik
Will this work with a custom field?
Such as iLoveSharepoint Lookup with picker: http://ilovesharepoint.codeplex.com/releases/view/15633
Hi,
I have not tested. It depends on how much this field differs from the standard field. If you test it, please let me know if it does work.
Alexander
Tested, It didn’t work
Hi Alexander:
Now that I got the array working correctly, is it possible to add this to a CEWP on a DispForm?
The DispForm lookup fields tend to be hyperlinks to the target list but is there another way?
Charlie Epes
What functionality were you thinking about? – click to preview in form rather then open link?
Alexander
Hi:
I was imagining that from my main list, I would have a field named [Contacts] using a multiple lookup. I would then add several names from a “Contacts” List.
In the main list’s DispForm, I could hover on a Contact’s name and see the fields from the Contact’s List info.
Charlie Epes
Hi,
I will be posting another solution (the one i mentioned in the email) during the next week. It will do what you require.
Alexander
Hello
I like your code. BUt I have some different requirement. Instrad of dropdown, I have text box, I want that once user enter any value it should validate by clickon OK button, if record exist in another list then it should allow to save otherwise it should show message in red coloe.
Please advise
Could you clarify previous comment about writing a value to a field with an example maybe, I’m confused about placement of elements in the script.
Thanks,
Joe
To access the items in the table displaying information from the lookup you can do it like this:
function getValueFromCustomLookup(){ // Get the value from the 5th TR of the custom lookup information table // The id of the custom TR is "customListAbstract_" and the FieldInternalName of the lookup column var getVal = $("#customListAbstract_Lookup").find('tr:eq(4)').find('td:last').html(); alert(getVal); }Add this function to the CEWP code and call it to alert the value. The variable can be used to write the value to a field if you like.
Alexander
Alexander,
I added this code but your last two sentences confuse me. What I want to do is take lookup value and write it to a field called Receiver (as an example). What is the write value code and where do I enter Receiver as the field to write it to? Here’s what I have so far. Thanks as always!
var argumentObj = {‘arrFinAndDispName’:[‘Title|Title’,
‘test_x0020_1|test 1’,
‘test_x0020_2|test 2’],
‘ListGuid’:’A04F46C4-DF0E-4B5D-8DF6-BCD3C8A0C68A’,
‘LookupFIN’:’Lookup’};
init_displayInfo(argumentObj);
function getValueFromCustomLookup(){
var getVal = $(“#customListAbstract_test_x0020_1”).find(‘tr:eq(2)’).find(‘td:last’).html();
alert(getVal);
}
Sorry I screwed up posting that code….
Hi,
Where you have “alert(getVal);”, you should insert something like this:
$(fields['Receiver']).find('input').val(getVal);Alexander
Alexander,
Sorry I’m still not getting it. I get the tutorial example to show up but I don’t get the input into the field. Thanks as always for your help.
[sourcecode language=""javascript"]
var argumentObj = {‘arrFinAndDispName’:[‘Title|Title’,
‘test_x0020_1|test 1’,
‘test_x0020_2|test 2’],
‘ListGuid’:’A04F46C4-DF0E-4B5D-8DF6-BCD3C8A0C68A’,
‘LookupFIN’:’Lookup’};
init_displayInfo(argumentObj);
function getValueFromCustomLookup(){
var getVal = $("#customListAbstract_test_x0020_1").find(‘tr:eq(2)’).find(‘td:last’).html();
$(fields[‘Receiver’]).find(‘test_x0020_1’).val(getVal);
}
The syntax in your last line is wrong, this is the correvt one:
$(fields['Receiver']).find('input').val(getVal);Alexander
I tried it that way too before and it didn’t work.
Alexander,
I’m still stuck. I would actually be fine if fields were populated from the dropdown (not just displayed) if that changes anything. Is it me? It seems simple but it just flat out won’t work for me.Thanks a lot!
[sourcecode language="language="javascript"]
<script type="text/javascript" src="javascript/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="javascript/interaction.js"></script>
<script type="text/javascript" src="javascript/stringBuffer.js"></script>
<script type="text/javascript" src="javascript/PullInformationFromConnectedList.js"></script>
<script type="text/javascript">
// Init all fields
fields = init_fields();
/* Object containing all arguments for the function
* "arrFinAndDispName" is an array on format "FieldInternalName|Display name" from the list the lookup is pulling information from
* "ListGuid" is the list Guid or the displayName of the list the lookup is pulling information from
* "LookupFIN" id the FieldInternalName of the lookup column.
*/
var argumentObj = {‘arrFinAndDispName’:[‘Title|Title’,
‘test_x0020_1|test 1’,
‘test_x0020_2|test 2’],
‘ListGuid’:’A04F46C4-DF0E-4B5D-8DF6-BCD3C8A0C68A’,
‘LookupFIN’:’Lookup’};
init_displayInfo(argumentObj);
function getValueFromCustomLookup(){
var getVal = $("#customListAbstract_test_x0020_1").find(‘tr:eq(2)’).find(‘td:last’).html();
$(fields[‘Receiver’]).find(‘input’).val(getVal);
}
</script>
Hi,
You must trigger the function to get it to “pick up” the value and write it to the new field. The best method is by adding a call to it in the function “PreSaveAction()”, as this function is automatically executed upon save.
function PreSaveAction(){ getValueFromCustomLookup(); return true; }Alexander
Alexander,
Thanks for the reply as always. I added what you had and now it shows the value as null and will not allow me to click OK to save. There is a value that should be displayed besides null so that is not triggering properly either. Sorry to be a pain! Thanks a ton!
<script type="text/javascript" src="javascript/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="javascript/interaction.js"></script> <script type="text/javascript" src="javascript/stringBuffer.js"></script> <script type="text/javascript" src="javascript/PullInformationFromConnectedList.js"></script> <script type="text/javascript"> // Init all fields fields = init_fields(); /* Object containing all arguments for the function * "arrFinAndDispName" is an array on format "FieldInternalName|Display name" from the list the lookup is pulling information from * "ListGuid" is the list Guid or the displayName of the list the lookup is pulling information from * "LookupFIN" id the FieldInternalName of the lookup column. */ var argumentObj = {'arrFinAndDispName':['Title|Title', 'test_x0020_1|test 1', 'test_x0020_2|test 2'], 'ListGuid':'A04F46C4-DF0E-4B5D-8DF6-BCD3C8A0C68A', 'LookupFIN':'Lookup'}; init_displayInfo(argumentObj); function getValueFromCustomLookup(){ var getVal = $("#customListAbstract_test_x0020_1").find('tr:eq(2)').find('td:last').html(); $(fields['Receiver']).find('input').val(getVal); } function PreSaveAction(){ getValueFromCustomLookup(); } </script>I forgot that the function must return true…
I have updated the code in my previous comment.
Regarding the null – use IE Dev toolbar or Firebug to locate the correct <tr> and <td> in the table.
Alexander
Alexander,
Thanks. That accepted the change, but it is still returning the value of null. I’m guessing it’s something in the getVal code?
See above comment. Download IE Developer Toolbar from here: Internet Explorer Developer Toolbar
Alexander
Alexander,
I downloaded both but can’t figure out where it identifies the tr and td? I can highlight it and see code but not the tr and td specs?
Alexander,
I see the tr id customListAbstract_Lookup. Then I see where the table is added. I see where the first tr. This should be the second tr. Is the fieldinternalname of the lookup column supposed to be the id of what it is looking for in the other list or the fieldinternalname of the dropdown that is selecting it?
Where I errored is exactly what I just mentioned…it should be the dropdown ID not the lookup from the other list. I think that did it…for now haha. I’m sure you have this somewhere but can I hide the field that will be filled so it is not seen – therefore preventing someone from thinking they have to fill that part out (since it will be filled and displayed on DispForm)? Thanks man you are incredible!
Requires the function init_fields()
Alexander
Alexander,
Excellent man! This works perfect. I am going to have a lot of items to pulling and populating. Is the easiest way to accomplish this by doing getVal2, getVal3, etc. for var and fields of each. I’ve made it work once so I’m good with it, I just wanted to know if you knew an easier (cleaner) way. I’m also going to use your newly published read only trick for the edit view. This may help in those fields where I’ve populated from the lookup and prevent them from thinking they should change those when editing. Thanks a bunch!
Alexander,
Alright leave it to me to find a problem. I added this code to the Edit form and the problem is that if someone makes an edit it does not recalculate the lookup. Even though the lookup is set correctly, because the view table does not reappear it defaults everything back to null. I even tried your code to set the autopopulated fields to read only and that didn’t help. If you could answer this and the above question when you have a minute I would greatly appreciate it! Thanks!
You must check the values before writing it to your “hidden field”. If it is null, don’t write it…
Or am i missing your question?
Alexander
Alexander,
I’ll try to explain better. In NewForm everything works fine. I also added the code to EditForm. The function itself works fine when performed. But if I go to EditForm on an item and don’t do anything at all and click OK it wipes out the fields it wrote to in NewForm and resets them to null. I believe this is because in EditForm the Lookup field is already selected and thus the table that the code is writing information from is not displayed. My novice theory is that maybe there is an alteration to the code that will set the table to display in EditForm based upon the selection that was made in the Lookup field previously. I hope that is a better explanation. Thanks as always-this is a huge help.
Hi,
I think my answer above is still relevant. If you in the function that writes the value to your “hidden” field check if the value is not null:
if(getVal!=null){ $(fields['Receiver']).find('input').val(getVal); }It will then only update the field if a user updates the lookup column.
Alexander
Alexander,
You are correct that works. I didn’t understand your first explanation I guess. Thanks for the example that helps me the best. When you have a second today can you check this code and make sure I’m doing this the easiest way possible? I am going to have quite a few lookups and field writing code so there may be a condensed way to do it but this is the only way I’ve been able to get it to work. Thanks a lot again!
var argumentObj = {'arrFinAndDispName':['Title|Title', 'test_x0020_1|test 1', 'test_x0020_2|test 2', 'test3|test3'], 'ListGuid':'A04F46C4-DF0E-4B5D-8DF6-BCD3C8A0C68A', 'LookupFIN':'Lookup'}; init_displayInfo(argumentObj); function getValueFromCustomLookup(){ var getVal = $("#customListAbstract_Lookup").find('tr:eq(1)').find('td:last').html(); if(getVal!=null){$(fields['Receiver']).find('input').val(getVal);} var getVal2 = $("#customListAbstract_Lookup").find('tr:eq(2)').find('td:last').html(); if(getVal!=null){$(fields['Receiver2']).find('input').val(getVal2);} var getVal3 = $("#customListAbstract_Lookup").find('tr:eq(3)').find('td:last').html(); if(getVal!=null){$(fields['Receiver3']).find('input').val(getVal3);} }The code looks OK.
Alexander
Alexander,
I have the exact problem noted here and am trying to position the JS you have provided so that it functions as you have described.
Re-selecting the lookup will always display the pulled forward fields in the Edit form. However, when users update other fields and do not re-select the Lookup field the pulled forward fields from an earlier Lookup field edit are sometimes (not always) deleted.
I have closely reviewed the original postings in this thread and have tried your additional JS that checks for null values. It is still not working consistently. Am I positioning the null value statement correctly as shown below? Should I call the function from a rule at form load completion rather than just running when the form loads?
START CODE:
jQuery(fields[“PNLookup”]).find(‘select’).trigger(“change”);
var fields = init_fields_v2();
var argumentObj1 = {‘arrFinAndDispName’:[‘PartNumber|PartNumber’],
‘ListGuid’:’42AEF135-C7B8-4192-9D5E-A3ABEED50C9C’,
‘LookupFIN’:’PNLookup’};
setTimeout(function(){
init_displayInfo(argumentObj1);
},900);
/* Writes the pulled forward fields to list fields when form saved */
function dffs_PreSaveAction(){
var v1 = jQuery(“#PNLookup_PartNumber”).text();
if(v1 !== null){jQuery(fields[‘PartNumber’]).find(‘input’).val(v1);}
setFieldValue(“PartNo”,v1);
END CODE
Thanks,
Mike
This code is 9 years old, but I did actually rewrite it 6 years ago so you should try the “new” version: https://spjsblog.com/2013/10/16/display-information-from-another-list-based-on-a-lookup-column-connection-updated-version/
Alexander
Let me try to explain again
I am using MOSS.
I have two lists Machines and TRansactions.
I have 3 following textboxes in newform.aspx/editform.aspx of Transactions List.
EnqNo – Plain Text box – Required field
Date – Datetime field – Required field
MachineID – Plain Text box – Required field
Here I want to validate Machine ID from Machines List (MachineId column) before save record into transaction list
Let me know if you need more information,
Take a look at this script: Convert Singleline textfield to filtered lookup dropdown and see if this could fill your need.
The script will convert your “MachineID” to a lookup from the list “Machines”.
Alexander
Alexandar
I dont want to use lookup field as I have 1000+ item and it is not user friendly , that is why I am thinking of using Textbox coumn and validation.
Any other advise
Answered here: Validate text field input against value in another list
Alexander
Not working for me… Page status bar just says “Please wait while scripts are loaded …
Also, Can I somehow make this work with People Picker.
Hi,
Check your script references and make sure they are correct.
About the people picker: I’m not sure what you mean, please clarify.
Alexander
I actually changed the master page to default instead of my custom master page and now I don’t see this “Please wait while scripts are loaded …”
But still it’s not working… As for the script references they are correct as I inspected using firebug and they are loading correctly onto the page.
Regarding the People Picker which is my actual requirement, by default it gets you just one column which is specified in “ShowField” but I need to be able to see some more information like First Name, Last Name, Phone… when a user is selected.
Hi,
Try to alert the function init_displayInfo in the CEWP-code:
This should give you the full function in a dialog.
Regarding pulling information on the user, take a look here: Accessing user profile information in WSS 3.0 with javascript
This is not connected to the people picker field, but take a look and give me a hint if you cannot get it working.
Alexander
Hi Alexander, I have a similar question to Charlie above. I have a list of Contacts that is alookup to a Facility list which contain multiple lookups. I would like the phone number and email address of the person selected to show up on the Display Form. Also, if you have multiple lookups where do you reference in the PullInformationFromConnectedList.js script. Maybe I am doing something wrong here because I had to change LookupFin to “Director” (a column in my list). Thank you for your help with this.
I will be posting a solution that gives you the ability to do his. Hopefully it will be ready during next week.
Alexander
Hi Alexander,
Your solutions are great but I have a question. I have a text field that I have converted to a dropdown lookup field based on one of your other solutions. I need to have this field display information similar to what this code is doing on the form.
So, when I select an item from the drop down list it will show the table and items selected. Do you think this is possible and quick to accomplish? I’m on a tight deadline for a resolution.
I do not want to use Microsoft’s lookup field as I’ve found it can be buggy and I really like your convert to drop down code. If you need more details, please let me know.
Hope to hear from you soon.
Hi,
If you are using my solution found here: Convert Singleline textfield to filtered lookup dropdown, you can modify the code above like this:
Remove this line:
Add this lines
// The "convert textfield to dropdown" - se above linked article for instructions: singleFilteredDropdown('{405EC50E-FAF7-4473-8D50-F9E725BEAA9B}',L_Menu_BaseUrl,'Title','Created','Text','Neq','',false,'DropdownNr1','','Title',true,false,false); // The onchange event calling "pull info script" $("#DropdownNr1").change(function(){ var thisValRaw = $(this).find('option:selected').val(); var thisVal = thisValRaw.substring(thisValRaw.indexOf('ID=')+3); displayInfo(thisVal,argumentObj) });Just remember to change the value for “LookupFIN” in the “argument object”.
Alexander
Hi Alex, this is really amazing !! — thanks
but nothing is so good that can’t be improved … 😉
– could be great to hide the empty fields from the list
– for Person or Group type fields doesn’t work for me, it shows nothing
– for Hyperlink type fields show the “description” could be fantastic (instead of URL)
could you please do this for me?
thanks 2 tons!
Hi,
Code updated to accommodate the first and third request. The issue with the people picker cannot be recreated. Please give me some more info to go on – and ensure you have the right FieldInternelName for the field.
Alexander
Thanks Alex, I’ve tested the new code, with people picker you where right the internal name was wrong, sorry.
Now hide empty fields perfectly, but I can’t get the hyperlink field correctly…
The field shows an address and the link goes to Googlemaps, as follows:
Web address:
http://maps.google.cl/maps?f=q&source=s_q&hl=es&geocode=&q=3950+West+12th+Ave,+Miami+FL+33012&sll=25.859979,-80.265757&sspn=0.009268,0.016286&ie=UTF8&hq=&hnear=3950+W+12th+Ave,+Hialeah,+Condado+de+Miami-Dade,+Florida+33012,+Estados+Unidos&z=16
Description:
3950 West 12th Ave, Miami FL 33012
what I have on the screen is:
the hyperlink goes to:
http://maps.google.cl/maps?f=q&source=s_q&hl=es&geocode=&q=3950+West+12th+Ave
and display:
+Miami+FL+33012&sll=25.859979
I can see the problem is on the “,” characters included on the web address, is possible to fix that?
thanks for your help!
Hi,
Is the information stored in a SharePoint Hyperlink field or in a single line text field?
If it is stored in a hyperlink field, what is the description for the hyperlink?
Alexander
Hi, yes is a hyperlink field, the description is part stored in the field is:
“3950 West 12th Ave, Miami FL 33012”
The description shown is:
“+Miami+FL+33012&sll=25.859979”
which is part of the web address to googlemaps, exactly where the “,” char is.
Thanks
Hi,
The code is updated to split the hyperlink by the first “, ” for separating the URL and the description.
Please test it and let me know if it works.
Alexander
Tested and running perfect!!
Thanks
Hi Alexander,
great script, works almost perfect on my site. Two questions:
a) I’d like to support three lookup fields, all pointing to the same list and the same lookup identifier (in the target list), so all I need to do is define three arrays for argumentObj, name them argumentObj1, argumentObj2 and argumentObj3
and call the function three times with init_displayInfo(argumentObj1); , init_displayInfo(argumentObj2); and init_displayInfo(argumentObj3);, correct?
b) All the lookup dropdowns seem to be attached to the upper right corner of the cewp that is holding the lookup script, any idea why?
I’m using the script on a newform.aspx with a combination of TabsInForm, FieldsSidebySide and BuildHeadingsFromArray CEWPs.
Chris
Correction to b), it’s not the cewp that is holding the script, I’ve moved it around and the dialog is staying below the form on the right side.
Ok, sometimes it helps to talk about it. I solved my problem with a), now I have three working lookups on that page/form. The only problem left now ist b), the dropdowns to the lookup fields are showing below the form. I suspect it has something to do with either the tabsinfom or fieldssidebyside cewps.
I’ll do some more testing and keep you updated.
Chris
Ok. it’s verified. As soon as I take the fields out of the TabsInForm CEWP the fields are displayed above the TabsInForm and the dropdowns are working as expected.
Any chance for a fix to have the Lookup dropdowns within Tabs?
Chris
Ok, trying to break the posts-per-day record :-), one more thing, the additional information is not being displayed in a dispform.aspx, here are only the lookup values as hyperlinks to the lookup item. Is that the expected behaviour?
Chris
Hi,
Combining different scripts can be difficult as many of them modify the form in some way. You would have to test it and tweak it to suite your needs…
Regarding the lookup appearing outside the tabs: this has to do with the “container” for the options being shared between all lookups in the same form. The positioning of the container is interrupted by the scripts. It can be fixed, but i have so little time that I cannot promise a fix.
Your last question regarding DispForm: Take a look at this post vLookup type rollup for SharePoint
Alexander
Hi Alexander,
I have one requirement in Sharepoint. I have used your code(Above) but not working.
I will tell you my requirement.So please send me the javascript code according to my requirements OR tell me what modifications are required to the existing code.
My Requirement is:
1). I have one list in Sharepoint called “Users List”. In that “User Name” , “User ID”, “E-mail” & “Company” are the columns.I inserted some data also.
2). I have another list called “Access Users”. In that “Title” and “Select user” are the columns. This column(Select User:) is lookup to “User Name” column in “Users List”(First List).
3). When ever i select any user from the lookup list(Select Users: list) it should display the corresponding details below that lookup column in the from.
Please send me the code for this with step by step process. Iam new to sharepoint.
Thanks a lot Alexander,
B Varaprasad
Trianz
Hi,
I believe this is the exact function to this script, no modification needed.
What exactly is not working?
Take a look here for a quick check:
How to troubleshoot when the scripts does not work
Alexander
Hi, Alexander!
Awesome script!! Thanks.
Just one question – for me it works a little bit slowly – on every choice in lookup field I see hourglass for ~2 seconds and then appears preview.
Why so??
Thanks!
Hi,
This has to do with the query against the “connected” list. It is bound to take a second or so – and if your server is overloaded, the delay will increase.
Alexander
Hi Alexander,
I was looking for a way to just display a set of instructions and I found this post. Very helpful indeed! I was able to get it to work for my form, but what if I didn’t want to use a Lookup column and instead just wanted to display my text when a radio button option was selected?
For example, if a user selects the WBT radio button, they get info on how WBTs are created, but if they select the PowerPoint radio button, they get a different set of information about how PowerPoints are created. I have the informational texts in their own list in SharePoint, but with the Lookup column, the multi-line rich text field isn’t an option for display. If you know of a way to do this with or without the lookup, I would appreciate the help! Thanks!
Hi,
Is this for SharePoint 2010?
Alexander
No, it’s SP 2007
Take a look at this one Add HTML mouseover tooltip
Alexander
Hi Alexander,
The functionality in your posted is code is as below.
When selecting a value from the lookup column, the script pulls the information from the “lookup source” and displays it below the lookup column.
But i found its not usefull with display form. As, in it we are not selecting a value from lookup column. Its just displayed. Does any modification required to achive the functionality with display form.
Thanks,
Rajkumar
Hey A,
Did you say you updated this with a way to link back to the source, or a way to update the source? I have looked thru here and I cant see it or figure it out. I just need to be able to open the editfrom of the source item.
Hi Alexander,
I’m trying to get Steve’s code working. I’m getting the table but I’m not getting any results in my text box.
Any ideas?
Thanks, Tom
fields = init_fields(); var argumentObj = {'arrFinAndDispName':['Title|Title'], 'ListGuid':'9C0DAB8B-3058-410B-A592-FF3F9FE88D41', 'LookupFIN':'Link'}; init_displayInfo(argumentObj); function getValueFromCustomLookup(){ var getVal = $("#customListAbstract_Link").find('tr:eq(1)').find('td:last').html(); $(fields['Title']).find('input').val(getVal); } function PreSaveAction(){ getValueFromCustomLookup(); }$(document).ready(function() {
$(“select[title=Link]”).change(function() {
getValueFromCustomLookup();
});
getValueFromCustomLookup();
});
fields = init_fields();
var argumentObj = {‘arrFinAndDispName’:[‘KPITitle|Title’,
‘KPIDescription|TomTest’],
‘ListGuid’:’9C0DAB8B-3058-410B-A592-FF3F9FE88D41′,
‘LookupFIN’:’Link’};
init_displayInfo(argumentObj);
function getValueFromCustomLookup(){
var getVal = $(“#customListAbstract_Link”).find(‘tr:eq(0)’).find(‘td:last’).html();
if(getVal!=null){$(fields[‘Title’]).find(‘input’).val(getVal);}
var getVal1 = $(“#customListAbstract_Link”).find(‘tr:eq(1)’).find(‘td:last’).html();
if(getVal!=null){$(fields[‘TomTest’]).find(‘input’).val(getVal1);}
}
/*tr #customListAbstract_Link {display:none;}*/
Hi,
I haven’t had the time to look at this one, but did the code you posted above do what you wanted?
Alexander
Hi Alexander,
Yes, thank you, just wanted to share. In the future, how do we post code so it displays like yours with line numbers etc.
Tom
Look here for instructions
Alexander
Hi Alexander,
I’m in need of some clarification for what value to place in the LookFIN variable. Do I create the lookup column in the list that will lookup information from another list and get its internal name? Or do I define the internal name of the column I want to lookup info from?
Thanks, in advance, for any help you can provide.
Sonny
Hi,
“LookupFin” is the FieldInternalName of the Lookup column in the form you are adding this code to.
Alexander
Alex, this looks great however when I choose an item in the dropdown list that is connected to another list, I do not get any data. Inspecting the dropdown list, I see that no on* events are set. Is this correct?
I’ve added this to a custom list and am testing it by connecting to a standard Announcements list. (If that works, I am trying to connect to a custom list which when I looked at the FINs they exist, so do I need to do what you’ve described for custom lists?)
Any help is appreciated, thanks.
Hi,
This one is a bit old. Which browser, jQuery version and which SharePoint version are you using?
Alexander
I am using IE 7 and Chrome 17, jQuery 1.6.4-min and MOSS 2007.
In the CEWP, I have the following for the argumentObj (along with the other parts that haven’t changed and updated links.)
var argumentObj = {‘arrFinAndDispName’:[‘Title|Title:’,
‘Body|Body’,
‘Expires|Expires’,
‘ListGuid’:’A5570BC6-9F9F-413A-93D1-CAC2A9AF8D8C’,
‘LookupFIN’:’Lookup’};
I relooked my code and I forgot the ] after Expires, above.
I also changed the init_fields function to the revised one with regex.
I also get the event listener of change for the dropdown list.
From the Chrome Dev tools,
Event Listener of change for
select#ct100_m_g_90be3a38_dfe6_4396_a0a0_044db2401076_ct100_ct104_ct108_ct100_ct100_ct104_ct100_Lookup
isAttribute: false
lineNumber: 2
listenerBody: “function (a){return typeof f!=”undefined”&&(!a||f.event.triggered!==a.type)?f.event.handle.apply(k.elem,arguments):b}”
node: HTMLSelectElement
sourceName: “https://xtranet/Organization/MSCs/RSCs/87SC/158th/2-351/s6/Shared%20Documents/Javascript/jquery-1.6.4.min.js”
type: “change”
useCapture: false
I now get the POST error of when I change the selection:
soap:ServerException of type ‘Microsoft.SharePoint.SoapServer.SoapServerException’ was thrown.Syntax error converting the nvarchar value ‘undefined’ to a column of data type int.
Any ideas why the value is undefined? Thanks.
Would this code work on SharePoint 2010? I have followed the exact steps mentioned but no results! Please help
Hi Alexander,
Thanks for this; it’s been extremley useful to me, but I’ve run into an issue.
I’ve followed this guide along with the modifications in order to populate a free text field with information from the lookup. It’s working when I edit an existing document in the library but it’s failing to populate my free text field when I upload a new document. Any ideas?
My application of your code:
<script type=”text/javascript” src=”https://GroupShare.pri.o2.com/sites/oss/internal/javascript/jquery-1.8.3.min.js”></script>
<script type=”text/javascript” src=”https://GroupShare.pri.o2.com/sites/oss/internal/javascript/interaction.js”></script>
<script type=”text/javascript” src=”https://GroupShare.pri.o2.com/sites/oss/internal/javascript/stringBuffer.js”></script>
<script type=”text/javascript” src=”https://GroupShare.pri.o2.com/sites/oss/internal/javascript/PullInformationFromConnectedList.js”></script>
<script type=”text/javascript”>
// Init all fields
fields = init_fields()
//$(fields[“CD_x0020_Ref_x0020__x0028_CDxxxxx_x0029_”]).hide();
/* Object containing all arguments for the function
* “arrFinAndDispName” is an array on format “FieldInternalName|Display name” from the list the lookup is pulling information from
* “ListGuid” is the list Guid or the displayName of the list the lookup is pulling information from
* “LookupFIN” id the FieldInternalName of the lookup column.
*/
var argumentObj = {‘arrFinAndDispName’:[‘Active|Ref’],
‘ListGuid’:’6BD8352D-249B-49FA-9791-3B7847DEB635′,
‘LookupFIN’:’CD_x0020_Ref’};
init_displayInfo(argumentObj);
function getValueFromCustomLookup(){
var getVal = $(“#customListAbstract_CD_x0020_Ref”).find(‘tr:eq(0)’).find(‘td:last’).html();
if(getVal!=null){$(fields[‘CD_x0020_Ref_x0020__x0028_CDxxxxx_x0029_’]).find(‘input’).val(getVal);}
}
function PreSaveAction(){
getValueFromCustomLookup();
return true;
}
</script>
Sorry for the late reply, have you figured this one out, or do you still want help?
Alexander
Hi Alex,
I’m trying to set this up on Sharepoint 2010 Standard edition and it is not working.
When using IE developer tools (F12), I get this error under console tab:
SCRIPT1007: Expected ‘]’
NewForm2.aspx, line 1016 character 31
On that line I’ve ListGuid
‘ListGuid’:’CD106517-BD26-4290-B142-5AB4B711A146′,
I saved the following code in .js file and called that .js file from the Content Editor Webpart in NewForm2.aspx
// Init all fields
fields = init_fields();
/* Object containing all arguments for the function
* “arrFinAndDispName” is an array on format “FieldInternalName|Display name” from the list the lookup is pulling information from
* “ListGuid” is the list Guid or the displayName of the list the lookup is pulling information from
* “LookupFIN” id the FieldInternalName of the lookup column.
*/
var argumentObj = {‘arrFinAndDispName’:[‘Title|Computer Type’,
‘Specs|Specs’,
‘Manufacturer_x0020_Model|Manufacturer Model’,
‘Cost_x0020_Estimate|Cost Estimate’,
‘Product_x0020_Link|Product Link’,
‘ListGuid’:’CD106517-BD26-4290-B142-5AB4B711A146′,
‘LookupFIN’:’Computer_x0020_Type_x0020_from_x’};
init_displayInfo(argumentObj);
I’m using the jquery version 1.3.2 from this link.
http://code.jquery.com/jquery-1.3.2.js
Please advise.
Thanks
Hi,
In SP2010 you more or less have this feature built in to the lookup column. Go to list settings and tick the box under “Add a column to show each of these additional fields:” for each of the additional fields you want to show (in DispForm and list views).
This solution is not tested in SP2010.
Alexander
Alexander,
Thanks for the reply.
SP 2010 builtin lookup column type feature only shows additional fields on Diplay and edit forms but not new forms. Also it does not allow you to pull multi line text fields.
These are the two things I was trying with your solution.
Hi all,
I’d just like to say that I love this add in and I can confirm that it does work in SharePoint 2010 without any real modification.
Thanks!
Hi,
This is a great tool – thank you for developing it.
The only issue i am having is with the NewForm.aspx. When the form loads the addition information does not appear under the dropdown box. However, as soon as i change the selection within the dropdown the additional information is displayed.
I have tried this in both IE and Chrome.
Has anyone else experienced this?