Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.

Necto 16 training 20 component mode & java script

87 visualizaciones

Publicado el

Panorama Necto, The Most Secure, Centralized & State of the Art Business Intelligence System

Publicado en: Tecnología
  • Sé el primero en comentar

  • Sé el primero en recomendar esto

Necto 16 training 20 component mode & java script

  1. 1. Necto 16 Training Necto SDK and JavaScript Basics
  2. 2. Objectives • By the end of this lesson you will be able to: • Show basic knowledge in JavaScript • Debug your JavaScript using Internet Explorer • Manipulate Necto using the Necto SDK
  3. 3. Agenda • Overview • Using JavaScript with Necto • Flow of JavaScript and API’s in Necto • Debugging in Necto and Internet Explorer • Using DCOM XML’s in Necto • Example and Exercise
  4. 4. Necto SDK and JavaScript Overview
  5. 5. Overview JavaScript is the language of choice to make modifications and additions to Necto  It can be used with HTML and interact with the Document Object Model (DOM)  JavaScript is run on the client machine so provides an immediate response, generally not requiring interaction with the server.  Necto has a full suite of API’s which can be called and modified by JavaScript code.
  6. 6. Using JavaScript with Necto
  7. 7. JavaScript options JavaScript variables and functions are case sensitive  Use JavaScript to:  React to events  <button type="button" onclick="alert('Welcome!')">Click Me!</button>  Write to HTML output  document.write("<h1>This is a heading</h1>");  Change HTML Content  x=document.getElementById("demo") //Find the element x.innerHTML="Hello JavaScript"; //Change the content
  8. 8. JavaScript: Choose the syntax for the level When you write JS code in Necto you need to be aware of the level you are addressing in Necto  Application Level, HTML.  getComponentById("NectoApplication"," pnAppl").getWbParametersValues();  WorkBoard Level (components)  getComponentById(“View1","pnAppl").c allSetGridSelection(2,0,2,1,0);
  9. 9. Where can I use JavaScript? You can add JavaScript code to many areas of Necto including but not limited to:  E-BINecto.htm  Entries are surrounded by <script language=JavaScript></script>  In a WorkBoard JavaScript entry area  No requirements for surrounding script setup  In side any HTML component  Entries are surrounded by  <HTML><BODY><SCRIPT> … </SCRIPT></BODY></HTML>  As a best practice for developing JavaScript we recommend using a development tool or Notepad++
  10. 10. Functions in JavaScript Functions: A function contains code that will be executed by an event or by a call to the function.  You may call a function from anywhere within a page (or even from other pages if the function is embedded in an external .js file).  Example : function onWorkboardLoadedEvent () { alert (“Workboard loaded”); }  A good JavaScript tutorial is available at
  11. 11. Necto SDK and API To add the functionality to Necto you need to use a combination of the API’s and the SDK All Necto Installations are shipped with the latest API and SDK documentation, the URL’s for these are below: •API = http://<yourservername>/panorama/api/necto-api- reference.htm •SDK = http://<yourservername/panorama/api/necto_SDK.h tm
  12. 12. Flow of JavaScript and API’s in Necto
  13. 13. API flow in Necto  Wait for something to happen (a trigger for an Event).  If required get data and then identify the specific item you need.  Process the data  Change data and/or output a reaction.
  14. 14. API’s in Necto We have multiple API’s for:  Events such as onClickCommand()  Calls such as callSave()  Triggers such as onMemberChanged()  All API’s can be found here search for API  All API’s are in the format lowercase first letter for the first word followed by uppercase thereafter i.e. callFilterGridMembers()
  15. 15. Debugging in Necto and Internet Explorer
  16. 16. Debugging in Necto In Internet Explorer simply edit the options under advanced; uncheck – ‘Disable Script Debugging (Internet Explorer)’ and (Other)  To debug or activate changes in  your JavaScript code you must:  Apply changes  Save WorkBoard  Refresh/Reload WorkBoard
  17. 17. Starting the debugger 1 Use the Debugger to check you are changing the correct item to do this add ‘debugger;’ to the Java code  Example:  getSomething()  {  debugger;  var a = 1;  alert(a);  }
  18. 18. Starting the debugger 2 The debugging will spawn a debugging tool in my case it’s Visual Studio and you will get a message similar to:  You should be able to step through your code and set breakpoints etc…
  19. 19. Using DCOM XML’s in Necto
  20. 20. Manipulating XML data in Necto Retrieve data use the XML DCOM object  Find the correct leaf value  Manipulate the data in the leaf  Write back the xmlDoc.xml string  Code Snippet to manipulate the xml data:  function onWbParameterChanged(id, xml)  {  var temp = getComponentById("NectoApplication“, “pnAppl”).getWbParametersValues(); xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async=false; xmlDoc.loadXML(temp); x=xmlDoc.getElementsByTagName('Param'); x[0].setAttribute("Value","5"); x[0].setAttribute("Caption","5"); getComponentById("NectoApplication“, “pnAppl”,).setWbParametersValues(xmlDoc.xml); }
  21. 21. Example
  22. 22. Manipulating XML data in Necto Example  To complete the examples you require:  Contoso Cube ( us/download/details.aspx?id=18279)  Necto 16  Follow these instructions :
  23. 23. Exercise
  24. 24. Adding functionality to a WorkBoard  To complete the exercise you require:  Contoso Cube  Necto 16  Follow these instructions :  Using the same view as we looked at in the exercise add functionality to it by adding a pick list (like the one below) and adding the ability to show the original view and alternatively show a view from any of your other WorkBoards  You will need to use the API callReplaceView  The viewpath that the API requires is held in the view properties->general->View path
  25. 25. Thank you, any questions?