0

I am kind of new to JavaScript.

However with other references I was able to call a list via Rest API and convert it into an accordion.

Now, I need to be able to search and highlight the terms being searched.

Any help is greatly appreciated.

this is what i have so far:

<html>
<head>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
 <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

<script type="text/javascript">  
$(document).ready(function(){  
GetItems();
});
function GetItems(){
var siteURL = _spPageContextInfo.webServerRelativeUrl;
    $.ajax({
            url: siteURL + "/_api/web/lists/GetByTitle('glossary of terms')/items",   //change the list name
            type: "GET",
            dataType: "json",
            headers: {
            Accept: "application/json;odata=verbose"
            },
        success: function(data) {
         if (data.d.results.length > 0) 
           {
            $('#accordion').append(GenerateAccordionFromJson(data.d.results));  
            $( "#accordion" ).accordion({
                collapsible: true,
                active: false,
            });
           }
         else{  
            $('#accordion').append("<span>No Records Found.</span>");  
            }
        },
        error: function(error){
            alert(JSON.stringify(error));
        }  
    });
}  
function GenerateAccordionFromJson(objArray) 
    {  
    var accordionContent = "";
    for (var i = 0; i < objArray.length; i++) 
    {  
        accordionContent += '<h3>' + objArray[i].Title + '</h3>';               
               //change the column name
        accordionContent += '<div><p>' + objArray[i].Definition + '</p></div>';           //change the column name
    }
    return accordionContent;
    }


</script>  
</head>
<body>
<div id="accordion">
</div>
</body>
</html>
New contributor
Jen is a new contributor to this site. Take care in asking for clarification, commenting, and answering. Check out our Code of Conduct.

Your Answer

Jen is a new contributor. Be nice, and check out our Code of Conduct.

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Browse other questions tagged or ask your own question.