How I went about creating two related lists using JavaScript, Client Object Model and SharePoint 2010-Part3

This is the final part of these previous, posts. They setup everything (I hope) so give them a quick peak.

At this point we have the following:

• We are editing a “new” meeting item in the MeetingList’s EditFrom.aspx page
• We have a modal dialog box open that contains the AttendeeList’s NewForm.aspx
• A QueryString has been passed to the modal dialog page with the related ID and List ID

Now I want to take the QueryString values and put them into the correct fields in the AttendeeList’s NewForm.aspx page (and hide these fields so the can’t be messed with) (also remember that this is all taking place in a modal dialog):

• First I am going to hide the fields that are going to contain the related List and related item ID

 $('nobr:contains("RelatedList")').closest('tr').hide();
 $('nobr:contains("RelatedItem")').closest('tr').hide();
 

• Next I need to loop thought the QueryString and grab all the values passed, and if they match the name of an exiting field, I am going to add them to the input box of the field (taken from here). Since the QueryString values RelatedList and RelatedItem match the hidden fields above, their values get put into their input boxes.

LoopThroughQueryString()
function LoopThroughQueryString() {
    var queryString = unescape(location.search);
    if (!queryString) {
        return {};
    }
    queryString = queryString.substring(1);
    var pairs = queryString.split("&");
    for (var i = 0; i < pairs.length; i++) {
        var keyValuePair = pairs[i].split("=");
	$('input[type=text][title='+ keyValuePair[0]+ ']').each(function() {
        $(this).val(keyValuePair[1]);
        });
    }
}

• Now, when I hit save int he modal dialog, the MeetingList’s related item’s ID and related list ID are added to the new attendee.

Goal met. Two lists with related items. Phew that was a lot.