Displaying search results with templates
GEODI provides rest API services. You can use query results in your application by taking advantage of Geodi Query APIs. With GeodiQueryJS, you can display the results in any format you want, or use libraries such as Angular.js and Vue.js.
According to the use of Standard or Simple API, you must have a Token , Geodi Project name and Geodi URL information.
GeodiQueryJS
You can display the query results in your application by including the GeodiQueryJS.js library into your project and specifying a template. The template definition is the same with tools like Angular, Vue.js. You can learn the object properties that you can use in the template from the debug console of the browser you are running or from the Geodi Query API - Document Search service document.
- {{data.DisplayName}} must be used in the HTML template content to display the value of data.DisplayName.
- For loop and conditions, the d:r tag and data/visible attribute values can be used.
- data : used to determine the data to be circulated in the loop. The data value at the beginning of the template is the list of results. In each d:r tag, data is converted to the value of the data. if necessary, content outside the loop can be accessed with data.parentdata.
- Examples
- <d:r data="[0,1,2,3]">-{{data}}- </d:r>
- <d:r data="data"><d:r data=data.AditionalValues>{{data}} </d:r> </d:r>
- Examples
- visible: If the condition is valid, the d: r field is displayed or else content is ignored. Even if it is not used with data, the block in which it is contained is checked once with the data. If there is a check for each item in the loop, another element d: r must be created.
- Examples
- <d:r data="[0,1,2,3]"> <d:r visible="data>2"> -{{data}}- </d:r> </d:r>
- data : used to determine the data to be circulated in the loop. The data value at the beginning of the template is the list of results. In each d:r tag, data is converted to the value of the data. if necessary, content outside the loop can be accessed with data.parentdata.
- The HttpUtility helper class can be used for encode / decode operations.
To access the properties of the object used in the template, you can use the {{debugger; }} expression to examine data and context objects through the console.
Sample Templates
GeodiQuery.js contains a preset template definition. You can get results without defining any templates.
<script src="https://servis2.dece.com.tr/GUI/js/GeodiQueryJS.js"></script> <div id=MyQueryResultArea></div> <script> var q = new GeodiQuery(); q.wsName = "...";//wsName q.EndIndex = 8; q.ServerUrl = "...";// Server Url q.Token = "...";//Token q.SearchString = "";//Search Text q.UseRank = true; RenderDLV({ Query: q, TargetDiv: "#MyQueryResultArea" } ) </script>
Sample Template and Usage
<script type="dece-template" id=MyTemplate> <div> {{data.length}} item : <br> <ul> <d:r data="data"> <li title="{{data.AdditionalValues.Date}}">{{ data.DisplayName }} ( {{ data.MyMethod() }})</li> </d:r> </ul> </div> </div>
<script src="https://servis2.dece.com.tr/GUI/js/GeodiQueryJS.js"></script> <div id=MyQueryResultArea></div> <script> var q = new GeodiQuery(); q.wsName = "...";//wsName q.EndIndex = 8; q.ServerUrl = "...";// Server Url q.Token = "...";//Token q.SearchString = "";//Search Text q.UseRank = true; RenderDLV( { Query: q, TargetDiv: "#MyQueryResultArea", Template: $("#MyTemplate"), OnStarting: function(args) { //before rest api call //... }, OnStartRender: function() { //after rest api call, before render $.each(args.Data,function(i,d) { d.MyMethod=function() {return "SAMPLE";} }); }, OnEndRender: function(args) { // after render //... } } ) //$("#MyTemplate").html() or string could be sent istead of $("#MyTemplate") </script>
For more examples, see the example below, which runs through our live demo projects below. The token taken for the guest user is used.
You can get the sample code from: https://github.com/decesw/html/blob/master/DocumentQuery/Query_GeodiQueryJS.html
Click here for the interface that you can try template editing.
Using tools like Angular.js and Vue.js
Rest API results can be exported to any library that supports template rendering. The results from Geodi Query API ( Query ) can be shown by using the JSON as desired by the library. You can reach all the examples from: https://github.com/decesw/html/tree/master/DocumentQuery Samples are running using our live demo projects. The token taken for the guest user is used.
- https://github.com/decesw/html/blob/master/DocumentQuery/Query_AngularJS.html
- Click here for sample code.
- https://github.com/decesw/html/blob/master/DocumentQuery/Query_VUEJs.html
- Click here for sample code.
- https://github.com/decesw/html/blob/master/DocumentQuery/BasicQuery_AngularJS.html
- Click here for sample code.
- https://github.com/decesw/html/blob/master/DocumentQuery/BasicQuery_VUEJs.html
- Click here for sample code.