`class_="transmitter"`

Using <widget class_="transmitter"> sends a JavaScript message to the web application in which the QuickApp is contained, notifying it when the values of specified dynamic variables have changed.

Description

When a QuickApp is embedded within a web application via an <iframe>, the transmitter and receiver widgets facilitate communication between the application and the QuickApp.

The transmitter widget detects changes in dynamic variables, then constructs and sends a JavaScript message to the web application notifying it of the new values of the variables. The dynamic variables included in the message are specified in the message_ attribute.

For a complete example of using the transmitter and receiver widgets to communicate with an external web application, see the Embedded QuickApps tutorial.

Syntax

<dynamic [VAR1]="" [VAR2]="" ...>
  <widget class_="transmitter" 
   message_="{@[VAR1]},{@[VAR2]},..."/>
</dynamic>

Attributes

message_: Accepts a comma-separated list of references to dynamic variables. The dynamic variables are referenced using the {@var} syntax.
When the values of any of the dynamic variables change, the transmitter widget constructs and sends a JavaScript message containing the current values of all of the variables specified in message_.
onrender_: When onrender_="1", the values of the dynamic variables specified in the message_ attribute will be sent to the containing web application when the QuickApp is initially rendered.
enforce_destination_: Accepts a string that represents a URI (specifying protocol, hostname, and port, if non-standard) to prevent messages from being intercepted by hostile code.

Example for `class_="transmitter"`

This example demonstrates how a QuickApp can send a JavaScript message to an external web application. The transmitter widget sends a message when the value of either year or zipcode is changed. The JavaScript application must have an event listener set up to receive and process the message sent by the transmitter widget.

<defblock name="sel_year">
  <table>2014;2015
  </table>
</defblock>
<defblock name="to_plot" zipcode="10017" year="">
  <sel value="year(date)={@year}"/>
  <sel value="zipcode={@zipcode}"/>
  <sel value="day(date)=15"/>
  <colord cols="zipcode,date,meantempi"/>
  <sort col="date" dir="up"/>
</defblock>
<dynamic year="2015" zipcode="10017">
  <widget class_="receiver"/>
  <widget class_="transmitter" 
   message_="{@year},{@zipcode}" onrender_="1"/>
  <layout>
    <widget class_="dropdown" label_="Select a year" 
     value_="@year" insert_="sel_year"/>
    <widget class_="graphics" width_="700" 
     base_="pub.demo.weather.wunderground.observed_daily">
      <insert block="to_plot" year="{@year}" 
       zipcode="{@zipcode}"/>
      <graphspec width="600" height="400">
        <chart type="line" samples="100000">
          <style seriescolors="#F26F21" 
           linemarkershow="0"/>
          <data x="date" y="meantempi" yrot="65"/>
        </chart>
      </graphspec>
    </widget>
    <widget class_="grid" type_="scroll" 
     base_="pub.demo.weather.wunderground.observed_daily">
      <insert block="to_plot" year="{@year}" 
       zipcode="{@zipcode}"/>
    </widget>
  </layout>
</dynamic>

Additional information

The following information should be considered when using <widget class_="transmitter">

There can only exist one receiver and one transmitter widget per outermost DOM.

class_="transmitter"