Many blog posts write about how to pre-populate fields in SharePoint using JavaScript. It wasn't clear to me how to pass parameters through the URL between SharePoint pages.
For instance, assume that a certain page has a URL parameter passed to it. How to embed this value in the URL to a new list item? (Often a customized version of NewForm.aspx)
Consider two pages: the source page and the NewCustomForm.aspx. This is how I did it:
1. I copied an existing schema.xml from a 'base' list template. In my case, 12\TEMPLATE\FEATURES\DiscussionsList\Discuss\schema.xml.
2. Adding a new field to the content type, I added a new FieldRef under ContentTypes/FieldRefs in schema.xml.
<viewfields>
<!-- custom by Gustavo -->
<fieldref name="MyField">
</fieldref>
<!-- end custom by Gustavo -->
3. I also added a new Field under Fields.
<Field
Type="Text"
Name="MyField"
DisplayName="MyField">
</Field>
4. I added a reference to the new field in ViewFields under the proper View.
<!-- custom by Gustavo -->
<FieldRef Name="MyField">
</FieldRef>
<!-- end custom by Gustavo -->
5. Now the brain surgery: the task now is to embed the URL parameter in the link that creates a new item. In my case, the view I was working in (the view defined in schema.xml) defined a hyperlink with text and the URL in it. My task was to modify this hyperlink to append the parameter. (careful: if the redirection between pages is done by JavaScript, the href in the a element may not be the actual URL. This was my case). I begin adding a JavaScript function under the View/Toolbar element. It just gets the value of the parameter:
<Toolbar Position="After" Type="Freeform">
<IfHasRights>
<RightsChoices>
<RightsGroup PermAddListItems="required" />
</RightsChoices>
<Then>
<!-- customization by Gustavo -->
<HTML>
<![CDATA[<SCRIPT>
function GetMyFieldFromURL() {
var qs = location.search.substring(1, location.search.length);
var args = qs.split("&");
var vals = new Object();
for (var i=0; i < args.length; i++) {
var nameVal = args[i].split("=");
var temp = unescape(nameVal[1]).split('+');
nameVal[1] = temp.join(' ');
vals[nameVal[0]] = nameVal[1];
if("MyField" == nameVal[0]) {
return nameVal[1];
}
}
return "";
}
</SCRIPT>]]>
</HTML>
<!-- end of this customization by Gustavo -->
6. Now I can append the parameter to the URL:
<HTML><![CDATA[ <table width=100% cellpadding=0 cellspacing=0 border=0 > <tr> <td colspan="2" class="ms-partline"><IMG SRC="/_layouts/images/blank.gif" width=1 height=1 alt=""></td> </tr> <tr> <td class="ms-addnew" style="padding-bottom: 3px"> <img src="/_layouts/images/rect.gif" alt=""> <a class="ms-addnew" ID="idAddNewDiscuss" href="]]></HTML>
<URL Cmd="New" />
<HTML><![CDATA[" ONCLICK="javascript:NewItem(']]></HTML>
<URL Cmd="New" />
<HTML><![CDATA[?MyField='+GetMyFieldFromURL(), true);javascript:return false;" target="_self">]]></HTML>
<HTML>
<!-- _locID_text="onetid6" _locComment="{StringCategory=HTX}" -->$Resources:core,Add_New_Discussion;
</HTML>
...
7. Continuing the brain surgery: include JavaScript under the PlaceHolderMain section that does the lookup and populates the fields in the target form (customized NewForm.aspx). I followed this blog post:
http://blogs.msdn.com/sharepointdesigner/archive/2007/06/13/using-javascript-to-manipulate-a-list-form-field.aspx
I modified copied this function to populate a regular text field instead of select options.
function fillDefaultValues() {
...
setTextFromFieldName("MyField", vals["MyField"]);
}
function setTextFromFieldName(fieldName, value) {
if (value == undefined) return;
var theInput = getTagFromIdentifierAndTitle("input","",fieldName);
theInput.value=value;
}
And this is it. Just wait for the patient to wake up from the anesthesia and everything will be alright.
This is how to see it in action:
Put your list somewhere.
Verify that the hyperlink to create a new item actually has the parameter (careful: if the redirection between pages is done by JavaScript, the href in the a element may not be the actual URL)
Click on the link to create the new list item. The parameter must be in the URL at this stage.
Note that the value of the URL made its way to the form.
If you find an easier way to do this, please let me know.
No comments:
Post a Comment