Setting Your Gadget Title Programmatically

In certain circumstances, you may need to programmatically reset the title of your gadget—for example, if you are attempting to personalize all elements of the application to the current user’s profile. In this case, you may want to capture profile information about the user, such as his name, and reset the gadget title to something like “Erik’s Task List.”

To integrate this feature, take these steps:

  1. Within the ModulePrefs node of the gadget spec file, add a Require element to enable the settitle JavaScript library.

    • Include: <Require feature="settitle"/>

  2. When you wish to reset the gadget title, call the setTitle() method of the gadgets.window object.

    • Method call: gadgets.window.setTitle();

<Module>
   <ModulePrefs>
      <Require feature="settitle" />
   </ModulePrefs>
   <Content view="canvas"><![CDATA[
      <form name="titleForm">
         Input new gadget title<br />
         <input type="text" name="newTitle"><br />
         <button onclick="setTitle();">Set New Title</button>
      </form>

      <script type="text/javascript">
      function setTitle(){
         //capture user title input
         var newTitle = form.newTitle.value;

         //set the gadget title
         gadgets.window.setTitle(newTitle);
      }
      </script>
   ]]></Content>
</Module>

In the preceding example, we include the Require statement to initialize the settitle library. Within the Content section, we set up a simple form with an input box and button. The input box allows the user to enter a new title; when he clicks the “Set New Title” button, the setTitle function executes. setTitle captures the input from the form and then calls the gadgets.window.setTitle() method, passing through the title as the parameter to set the gadget title.

Get Programming Social Applications now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.