This one is a follow-up on the two previous posts on manipulating form labels, but the technique can be used for many other scenarios.
I will show you how to use entries from another list as “resources” for a script by querying the “resources-list” for variables to use in the script.
Because i use the same scenario as in the two previous posts, you must read them before proceeding with this one.
The array i used to populate the labels for each option in the choice list is now moved out in another list, and we “ask for it” with a CAML-query to the web-service lists.asmx.
Create a new list like this:
These are all the actual “FieldInternalNames” (Fields get their “FieldInternalName” first time created – any later modification of the name affects only their “DisplayName”).
The fields are used like this:
- ListGuid: This is the list Guid of the list using this resource.
- Title: This is the FieldInternalName of the column to use the resource in.
- Val: This is the actual value to return.
- Description: This is used to describe the use of this “resource”.
Here is the form filled for our need in this example:
You must refer two more scripts like this:
The scripts “interaction.js” and “stringBuffer.js” is created by Erucy and published on CodePlex.
You will need the list GUID of your “resources-list” and the list you will insert the resources in. Replace the one in the script (resourcesListGuid – line 34 in the script) and the one in the picture above and the one in line 13 with your own!
I have made the “resources-list” more complex than i needed for this example, but by adding the “ListGuid” column i prepare the list so that it can be used by many different lists without having to think about using unique names for the columns in the different lists.
The script is now modified like this:
<script type="text/javascript" src="/test/English/Javascript/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="/test/English/Javascript/interaction.js"></script> <script type="text/javascript" src="/test/English/Javascript/stringBuffer.js"></script> <script type="text/javascript"> fields = init_fields(); var myNewLabel = "<br><div>Here is some custom text added by adressing the formlabel with jQuery!</div>" + "<br><div>You can insert images to:<br><img src='/test/English/Shared%20Documents/jQuery_img.jpg' border='0'></div>" $(fields['MyChoice']).find(".ms-formlabel h3").after(myNewLabel); // Lookup the array values from another list and split it to create an array arrMyChoice = getExternalResources('3264E665-228B-4A08-970C-4CE5E871A002','MyChoice').split(','); // Call the script that inserts the descriptions descriptionBeforeChoice('MyChoice',arrMyChoice,300); function descriptionBeforeChoice(FieldInternalName,arrName,widthOfCustomLabel){ $(fields[FieldInternalName]).find(".ms-formbody").find(":checkbox").each(function(idx){ // Add alternating style to make it easier to follow the lines in the form var trClass = ''; if(idx%2==0){ trClass = 'ms-alternatingstrong'; } $(this).before("<span style='display:inline-block;width:" + widthOfCustomLabel + ";white-space:nowrap'>" + arrName[idx] + "</span>") .parent().css({'white-space':'nowrap'}) .parents('tr:first').addClass(trClass); }); } function getExternalResources(ListGuid,ElementTitle){ // ListGuid can be swapped with DisplayName // ElementTitle is here the FieldInternalName of the field to add the resources to var resourcesListGuid = "{7008EA8E-623D-4F80-A70C-35C0F71E5FB0}"; // GUID of the "resources-list" - can be swapped with DisplayName var query = "<Where><And><Eq><FieldRef Name='ListGuid' /><Value Type='Text'>" + ListGuid + "</Value></Eq>" + "<Eq><FieldRef Name='Title' /><Value Type='Text'>" + ElementTitle + "</Value></Eq></And></Where>"; wsBaseUrl = L_Menu_BaseUrl + '/_vti_bin/'; var res = queryItems(resourcesListGuid,query,['Val'],1); if(res.count==-1){ alert("An error occured in the query:n" + query); }else{ return res.items[0]['Val']; } } 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; } </script>
The end result looks like in the previous post:
As always – ask if something is unclear!
Alexander
2 Comments on “Get variables in a script from another list”