Location: PHPKode > scripts > Sigma visual ajax UI builder > sigma-visual-ajax-ui-builder/manual/how-to-add-a-event-handler.html
<html><head>

   <title>Sigma Visual Builder Manual</title>
	<meta content="Sigmasoft" name="AUTHOR"/>
	
	<link rel="stylesheet" type="text/css" href="css/doc.css" media="screen"/>
    <meta content="text/html; charset=ISO-8859-1" http-equiv="Content-Type"/>
</head>
    <body style="padding: 20px 30px 20px 30px; background-color: rgb(204, 204, 153);">
	<table cellspacing="10" border="0" width="100%">
    
        <tbody>
            <tr>
                                <td align="left" class="highlight">Sigma Visual Manual </td>
                                
                                <td align="right"><img src="img/logo.gif" alt="sigmasoft logo" width="116" height="44"/></td>
            </tr>
        </tbody>
</table>
	
	
	<table cellspacing="10" cellpadding="20" border="0" width="100%">
      <tbody>
        <tr style="background-color: rgb(255, 255, 255);">
          <td valign="top" style="width: 30%; height: 768px;"><h2>
  Contents
</h2>
           
            <UL class="index">
<LI><A HREF="index.html">Welcome to SigmaVisual</A>
	<LI>How to
	<UL>
		<LI><A HREF="how-to-install.html">How to install</A>
		<LI><A HREF="how-to-add-component-to-my-web-page.html">How to add component to my web page</A>
		<LI><A HREF="how-to-set-component-properties.html">How to set component properties</A>
		<LI><A HREF="how-to-add-new-items-to-a-menu-tab-stack.html">How to add new items to a menu/tab/stack</A>
		<LI><A HREF="how-to-copy-components.html">How copy components</A>
		<LI><A HREF="how-to-remove-components.html">How to remove components</A>
		<LI><A HREF="how-to-move-components.html">How to move components</A>
		<LI><A HREF="how-to-resize-components.html">How to resize components</A>
		<LI><A HREF="how-to-change-component-parent-container.html">How to change components' parent container</A>
		<LI><A HREF="how-to-customize-appearance.html">How to customize appearance</A>
		<LI><A HREF="how-to-add-a-event-handler.html">How to add an event handler</A>
		<LI><A HREF="how-to-know-property-event-meaning.html">How to know property/event meaning</A>
		<LI><A HREF="how-to-preview-execute-a-web-page.html">How to preview/execute a web page</A>
		<LI><A HREF="how-to-make-web-application-standalone.html">How to make web application standalone</A>
		<LI><A HREF="how-to-change-theme-of-my-application.html">How to change theme of my application</A>
		<LI><A HREF="how-to-make-app-fit-different-resolutions.html">How to make app fit different resolutions </A>
	</UL>
	<LI>Reference
	<UL>
		<LI><A HREF="sigma-visual-overview.html">SigmaVisual Overview</A>
		<LI><A HREF="main-buttons.html">Main Buttons</A>
		<LI>Design View
		<UL>
			<LI><A HREF="design-tool-bar.html">Design Tool Bar</A>
			<LI><A HREF="structure-dropdown-tree.html">Structure Dropdown Tree</A>
			<LI><A HREF="tool-box.html">Component Gallery</A>
			<LI><A HREF="component-config-window.html">Object Inspector</A>
		</UL>
		<LI><A HREF="normal-view.html">Normal View</A>
		<LI><A HREF="structure-view.html">Structure View</A>
	</UL></UL>
	</td>
		  <td valign="top"><h1><B>How to add an event handler</B></h1>
		    <P>In this section, you will learn how to create a web application with following feature.</P>
		    <ul>
              <li>This application has one button with caption "say something".</li>
		      <li>When user clicks that button, an asynchronous message box drops down from top of web page saying "hello, world".&nbsp;</li>
	        </ul>
		    <P>After you add a button component to your web page by dragging it from [Tool Box], a button will appear on your web page. Click the button to select it.</P>
		    <ul>
              <li>Click the plus before [events] in [Component Config Window], then all the event for button will collapse.</li>
		      <li><FONT SIZE="4" FACE="Times New Roman, times, roman, serif" >Click [events</FONT><FONT FACE="??" SIZE="3">&rarr;</FONT><FONT FACE="Times New Roman, times, roman, serif" SIZE="4">onClick] and then value of [event </FONT><FONT FACE="??" SIZE="3">&rarr;</FONT> onClick] will be highlighted, as the following figure shows.</li>
	        </ul>
		    <P align="center" ><FONT FACE="Times New Roman, times, roman, serif" COLOR="#800000" SIZE="4"><IMG SRC="img/add_event_handler1.png" alt="add an event handler" WIDTH="399" HEIGHT="284" BORDER="0"></FONT></P>
		    <ul>
              <li>Click the button on the right side to pop up a dialog like the following figure.&nbsp;</li>
		      <li>Input the following text.</li>
	        </ul>
		    <P><I>function (profile, e, value) {</I></P>
		    <P><I>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; linb.message("hello, world");</I></P>
		    <P><FONT FACE="Times New Roman, times, roman, serif" SIZE="4"><I>}</I></FONT></P>
		    <P>&nbsp;</P>
		    <ul>
              <li>Press [OK] button to close window and save event handler code.&nbsp;</li>
		      <li>Press [Run] button to preview result.  </li>
	        </ul>
		    <h1>&nbsp;</h1>
		    <h1>&nbsp;</h1>
	      </td>
        </tr>
      </tbody>
    </table>
   <table style="margin:10px 0px 0px 0px;" border="0" cellpadding="0" cellspacing="0" width="100%">
        <tbody>
            <tr>
                                
                                <td valign="top">
                                    <div align="center" class="copyright" >All contents are (c) Copyright 2005 - 2008, Sigma Software
                                        Inc. All rights Reserved</div></td>
            </tr>
        </tbody>
</table>
</body></html>
Return current item: Sigma visual ajax UI builder