Hey there, in this article we will learn about the CAML query to get items from SharePoint List.
Note
When I was stuck up at getting items by filtering multiple line of text column CAML query saved my time, as the title says ;)
Introduction
CAML Query SharePoint – CAML stands for Collaborative Application Markup Language. It is an XML-based language that is used in SharePoint.
-
A REST request with a CAML query is usually a POST request
-
A REST request with a CAML query has always to possess an X-RequestDigest HTTP header and should have the attached CAML query within the request body (and not during a query string).
In this article:
We will load HTML fields and buttons dynamically using REST API GET method and on-button click to get list items by filtering multiple line of text column using CAML Query with REST API in 3 simple steps.
Prerequisites
- SharePoint List with columns
- Add HTML & JS to SiteAssets
- Get the code files from my Github
Screenshot
What we will see in this article,
Figure 1
Figure 2., Click on the button
Figure 3
Code Details
STEP 1 - HTML
Refer the js files to the HTML
- <!DOCTYPE html>
- <html>
- <head>
- <title>CAML Query</title>
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
-
- </head>
- <body>
- <div id="Title">
-
- </div>
- </body>
- <script type="text/javascript" src="../SiteAssets/CAMLQuery.js"></script>
-
- </html>
STEP 2 - JS
On page load, the getItems() function will be called and the HTML structure is loaded dynamically based on the list items!!
- getItems();
-
- function getItems() {
- var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getByTitle('CAMLQuery')/items?";
- $.ajax({
- url: requestUri,
- type: "GET",
- headers: {
- "Accept": "application/json; odata=verbose"
- },
- async: false,
- success: function(data) {
- var items = data.d.results;
- var htmlVal = '';
- for (var i = 0; i < items.length; i++) {
- htmlVal += items[i].Title + "<br/><br/> :" + items[i].Description + ' <br/><br/><button type="button" onclick="getUsingCAML(\'' + items[i].ID + '\',\'' + items[i].Description + '\')">Click Me!</button> <br/><br/><h3 id="' + items[i].ID + '"></h3> '; //ID sets as dynamic value
- }
- document.getElementById("Title").innerHTML = htmlVal;
- },
- error: function(error) {
- console.log("getItems :: " + error);
- }
- });
- }
STEP 3
On button click, we have passed the id and the MLT column value of the particular ID to filter and get items using CAML Query.
NOTE
There are FREE tools available in the market to generate CAML query code download and install using the below links,
- U2U - CAML Query builder - U2U - Official blog - https://blogs.u2u.be/u2u/post/U2U-Caml-Query-Builder-(Windows-version)-new-version
- Saketa - SAKETA
CAML Query code for our demo app,
- <View>
- <Query>
- <Where>
- <Eq>
- <FieldRef Name='ColumnName' />" + "
- <Value Type='Note'>" + ColumnSearchValue + "</Value>
- </Eq>
- </Where>
- </Query>
- </View>
Now, CAML Query is passed with the MLT search value the REST AJAX returns the value,
- function getUsingCAML(ID, Description) {
- var caml = "<View><Query><Where><Eq><FieldRef Name='Description' />" + "<Value Type='Note'>" + Description + "</Value></Eq></Where></Query></View>";
- var endpoint = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/GetByTitle('CAMLQuery')/GetItems";
- var requestData = {
- "query": {
- "__metadata": {
- "type": "SP.CamlQuery"
- },
- "ViewXml": caml
- }
- };
- return jQuery.ajax({
- url: endpoint,
- method: "POST",
- data: JSON.stringify(requestData),
- headers: {
- "X-RequestDigest": $("#__REQUESTDIGEST").val(),
- 'content-type': 'application/json;odata=verbose',
- 'accept': 'application/json;odata=verbose'
- },
- async: false,
- success: function(data) {
- var items = data.d.results[0];
- document.getElementById(ID).innerHTML = "Syntax: <br/>" + items.Syntax; //Binds the value
- },
- error: function(error) {
- console.log(JSON.stringify(error));
- }
- });
- }
That's it!!
Now let us see the CAML Query examples
- SharePoint CAML Query Example
-
- Get results from SharePoint List where Id > 1
- <Query>
- <Where>
- <Gt>
- <FieldRef Name=’ID’ />
- <Value Type=’Counter’>11</Value>
- </Gt>
- </Where>
- </Query>
-
- Get results from SharePoint List where Title is not equal to RAM
- <Query>
- <Where>
- <Neq>
- <FieldRef Name=’Title’ />
- <Value Type=’Text’>RAM</Value>
- </Neq>
- </Where>
- </Query>
-
- Get results from SharePoint List where Title begins with RAM
- <Query>
- <Where>
- <BeginsWith>
- <FieldRef Name='Title' />
- <Value Type=’Text’>RAM</Value>
- </BeginsWith>
- </Where>
- </Query>
-
- Get results from SharePoint List where Title contains RAM
- <Query>
- <Where>
- <Contains>
- <FieldRef Name='Title' />
- <Value Type=’Text’>RAM</Value>
- </Contains>
- </Where>
- </Query>
-
- Get results from SharePoint List where Id Lower than or equal to 23
- <Query>
- <Where>
- <Leq>
- <FieldRef Name='ID' />
- <Value Type=’Counter’>23</Value>
- </Leq>
- </Where>
- </Query>
-
- Get results from SharePoint List where Title is not null
- <Query>
- <Where>
- <IsNotNull>
- <FieldRef Name='Title' />
- </IsNotNull>
- </Where>
- </Query>
-
- CAML Query to Limit Row
-
- <Query>
- <View>
- <RowLimit>10</RowLimit>
- </View>
- </Query>
Hooray!! Happy CAML riding!