Dynamic CAML variable

Jun 18, 2012 at 8:15 PM

Quick question which may or may not require a long answer...

I have a series of checkboxes that, when you click a "go" button, a SPServices function pulls and filters items from a calendar list.  Is there a a better way to modifiy the CAMLQuery that I pass other than a ton of if/else statements to build the CAML variable by testing against which checkboxes are checked?

<script type="text/javascript">

var calFilterVar = "<Query>"+
			"<Where>"+
				"<And>"+
					"<Or Group='true'>"+
						"<Or>"+
							"<Or>"+
								"<Or>"+
									"<Or>"+
										"<Eq>"+
											"<FieldRef Name='CorpCalCategory'/>"+
											"<Value Type='Text'>Company</Value>"+
										"</Eq>"+
										"<Eq>"+
											"<FieldRef Name='CorpCalCategory'/>"+
											"<Value Type='Text'>Volunteer Opportunities</Value>"+
										"</Eq>"+
									"</Or>"+
									"<Eq>"+
										"<FieldRef Name='CorpCalCategory'/>"+
										"<Value Type='Text'>Customer</Value>"+
									"</Eq>"+
								"</Or>"+
								"<Eq>"+
									"<FieldRef Name='CorpCalCategory'/>"+
									"<Value Type='Text'>MAP</Value>"+
								"</Eq>"+
							"</Or>"+
							"<Eq>"+
								"<FieldRef Name='CorpCalCategory'/>"+
								"<Value Type='Text'>WAP</Value>"+
							"</Eq>"+
						"</Or>"+
						"<Eq>"+
							"<FieldRef Name='CorpCalCategory'/>"+
							"<Value Type='Text'>TEAM</Value>"+
						"</Eq>"+
					"</Or>"+
					"<Geq>"+
						"<FieldRef Name='EventDate'/>"+
						"<Value Type='DateTime'>"+
							"<Today/>"+
						"</Value>"+
					"</Geq>"+
				"</And>"+
			"</Where>"+
			"<OrderBy>"+
				"<FieldRef Name='EventDate' Ascending='TRUE'/>"+
			"</OrderBy>"+
		"</Query>";

$(document).ready(function() { 
	// generate filter checkboxes html 
	AddFilterAreaHTML();  
	
	// create Generated Calendar web part
	getFilteredCalendar(calFilterVar);	
	
	// go button functionality
	$("#calFilterGo").click(function(){
		var calFilterVar = 
               	// all the if/else to modify the CAML goes here	
		;
		$("#filteredCalendarView").empty();
         		getFilteredCalendar(calFilterVar);
	});

});



function getFilteredCalendar(calFilterVar){
	var method = "GetListItems";
	var list = "CEEP-CoporateCalendar";
	var fieldsToRead =  "<ViewFields>" +
				"<FieldRef Name='CorpCalCategory' />" +
				"<FieldRef Name='EndDate' />" +
				"<FieldRef Name='Location' />" +
				"<FieldRef Name='EventDate' />" +
				"<FieldRef Name='Title' />" +
			"</ViewFields>";
	
	$().SPServices({
		operation: method,
		async: false,  
		listName: list,
		CAMLViewFields: fieldsToRead,
		CAMLRowLimit: 5, 		                 
CAMLQuery: calFilterVar completefunc: function (xData, Status) { $(xData.responseXML).SPFilterNode("z:row").each(function() { var calCategory = ($(this).attr("ows_CorpCalCategory")); var calEnd = ($(this).attr("ows_EndDate")); var calLocation = ($(this).attr("ows_Location")); var rawStart = ($(this).attr("ows_EventDate")); var calTitle = ($(this).attr("ows_Title")); if (typeof rawStart != 'undefined'){ var month_names = new Array("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"); var curr_Date = rawStart.substr(8,2); var curr_Month = rawStart.substr(5,2); var month_Num; if (curr_Month >= 10){ var month_Num = curr_Month; } else{ var month_Num = curr_Month.substr(1); } month_Num--; var calStackedDate; var calMonth = month_names[month_Num]; if (curr_Date >= 10){var calStackedDate = curr_Date;} else{var calStackedDate = curr_Date.substr(1);} } else { artMonth = ""; artDate = ""; } AddFilteredCalHTML(calTitle, calStackedDate, calMonth, calEnd, calLocation, rawStart); }); } }); } function AddFilteredCalHTML(calTitle, calStackedDate, calMonth, calEnd, calLocation, rawStart){ $("#filteredCalendarView").append("<table class='ncWrap'>" + "<tr>" + "<td class='ncDate' rowspan='2' valign='top'>" + "<span class='ncMon'>" + calMonth + "</span><br/>" + "<span class='ncDay'>" + calStackedDate + "</span>" + "</td>" + "<td class='ncMain' valign='top'>" + "<span class='ncLink'>" + calTitle + "</span>" + "</td>" + "</tr>" + "<tr>" + "<td>" + "<span class='ncBy'>Location: <span class='ncAuthor'>" + calLocation + "</span></span><br/>" + "<span class='ncBy'>Start: <span class='ncAuthor'>" + rawStart + "</span></span><br/>" + "<span class='ncBy'>End: <span class='ncAuthor'>" + calEnd + "</span></span>" + "</td>" + "</tr>" + "</table>" ); } function AddFilterAreaHTML(){ $("#CalFilter").append( "<h3 class='CalFilterHead'>Corporate Calendar</h3>"+ "<input type='checkbox' name='CompanyFilter' value='Company' checked='checked'/> Company<br/>" + "<input type='checkbox' name='VolunteerFilter' value='Volunteer Opportunities' checked='checked'/> Volunteer Opportunities<br/>" + "<input type='checkbox' name='CustomerFilter' value='Customer' checked='checked'/> Customer <br/>" + "<input type='checkbox' name='MAPFilter' value='MAP' checked='checked'/> MAP<br/>" + "<input type='checkbox' name='WAPFilter' value='WAP' checked='checked'/> WAP<br/>" + "<input type='checkbox' name='TEAMFilter' value='TEAM' checked='checked'/> TEAM<br/>"+ "<a class='GlobalButton3_GY' href='#' id='calFilterGo'><span>Go</span></a>" ); } </script> <table class="CalFilterAreaWrap"> <tr> <td valign="top"> <div id="CalFilter"></div> </td> <td valign="top"> <div id="filteredCalendarView"></div> </td> </tr> </table>
Jun 19, 2012 at 3:12 AM
Edited Jun 19, 2012 at 3:14 AM

Check out http://robocaml.codeplex.com and let me know what you think...

*Edit*

I posted prior to viewing your CAML. I've yet to add <Or> grouping to the library.  I can take a look at that and put it on the roadmap.

Cheers,

Matt