<!--
  Licensed to the Apache Software Foundation (ASF) under one or more
  contributor license agreements.  See the NOTICE file distributed with
  this work for additional information regarding copyright ownership.
  The ASF licenses this file to You under the Apache License, Version 2.0
  (the "License"); you may not use this file except in compliance with
  the License.  You may obtain a copy of the License at

      http://www.apache.org/licenses/LICENSE-2.0

  Unless required by applicable law or agreed to in writing, software
  distributed under the License is distributed on an "AS IS" BASIS,
  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  See the License for the specific language governing permissions and
  limitations under the License.
-->
<!DOCTYPE html>
<html xml:lang="EN" xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
	<title>Understanding Flex itemEditors – Part 1: Inline itemEditors  | Adobe Developer Connection</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta name="robots" content="noodp" />
	<meta name="keywords" content="" />
	<meta name="description" content="Create an inline itemEditor by simply naming a class and creating a complex class right within the MXML tags." /><meta name="creationDate" content="2010-11-11 @ 18:36:57" />
	<meta name="lastModifiedDate" content="2010-11-11 @ 18:36:57" />
	<meta name="viewport" content="width=device-width" />
<meta name="page" content="main" />
<meta name="shortTitle" content="Understanding Flex itemEditors – Part 1: Inline itemEditors"/>
<meta name="blurb" content="Create an inline itemEditor by simply naming a class and creating a complex class right within the MXML tags." />
<meta name="author" content="Peter Ent" />
<meta name="area" content="devnet" />
<link rel="icon" href="http://wwwimages.adobe.com/www.adobe.com/include/img/favicon.ico" type="image/x-icon"/>
	<link rel="shortcut icon" href="http://wwwimages.adobe.com/www.adobe.com/include/img/favicon.ico" type="image/x-icon"/>
<link rel="canonical" href="http://www.adobe.com/devnet/flex/articles/itemeditors_pt1.html"/>
       <link rel="stylesheet" media="screen" href="http://wwwimages.adobe.com/www.adobe.com/include/style/adobe-light-compressed.css"/>
<!--[if !IE]><!-->
		<link rel="stylesheet" media="screen,print" href="http://wwwimages.adobe.com/www.adobe.com/include/style/compressed.css"/>
	<!--<![endif]-->
	<!--[if IE]>
		<link rel="stylesheet" media="screen,print" href="/include/style/dotcom-css-compressed.css" />
		<link rel="stylesheet" media="screen,print" href="/include/style/default/SearchBuddy.css" />
		<link rel="stylesheet" media="screen,print" href="/include/style/dotcom-css-modes.css" />
	<![endif]-->
    <link rel="stylesheet" media="screen" href="http://wwwimages.adobe.com/www.adobe.com/include/jmvc/adobe-configurator-compressed.css"/>
    <link rel="stylesheet" media="screen" href="http://wwwimages.adobe.com/www.adobe.com/include/bach/bach-1.0.1.min.css"/>
	<!--[if lt IE 10]>
		<link rel="stylesheet" media="screen" href="/include/style/modes/MirrorIE.css" />
	<![endif]-->
	<script>
	function createNs ( ns )
	{
		var o, a;			
		a = ns.split(".");			
		o = window[a[0]] = window[a[0]] || {};			
		for(i=1; i < a.length; i++)
		{
			o = o[a[i]] = o[a[i]] || {};	
		}
		return o;		
	}

	createNs("Adobe.PageInfo");
	createNs("Adobe.Tokens");
	createNs("Adobe.UserInfo");
	Adobe.PageInfo.AuthenticatedState = false;
	Adobe.PageInfo.localeCode = "en";
	Adobe.PageInfo.accountPageName = "";
	Adobe.PageInfo.productKey = "";
	Adobe.PageInfo.catalogName = "";
	Adobe.PageInfo.countryCode = "US";
    Adobe.PageInfo.localeString = "en_us";
	Adobe.PageInfo.marketSegment = "COM";
	Adobe.PageInfo.sitecatalystMarketSegment = "COM";
	Adobe.PageInfo.akamaiURLPrefix = "http://wwwimages.adobe.com/www.adobe.com";
	Adobe.PageInfo.pageLevel = "7";
</script>
<script src="http://wwwimages.adobe.com/www.adobe.com/include/script/compressed.js"></script>
	<script src="http://wwwimages.adobe.com/www.adobe.com/include/jmvc/adobe-store-compressed.js"></script>
	<script src="http://wwwimages.adobe.com/www.adobe.com/include/bach/bach-1.0.1.min.js"></script>
    <script src="http://wwwimages.adobe.com/www.adobe.com/uber/js/VisitorAPI.js"></script>
	<script src="http://wwwimages.adobe.com/www.adobe.com/uber/js/omniture/mbox.js"></script>
	<!--[if IE 6]>
    <script>
        try{void(document.execCommand("BackgroundImageCache",false,true));} catch(e) {}
    </script>
    <![endif]-->
	<script>
	//<![CDATA[
	$(window).bind("hashchange load", adobe.fn.focusHashElement);
	cart = new adobe.ui.CartFacade("cart-dialog", "cart-dialog-flash");
	cart.setRequiredFlashVersion("9.0.115");
	cart.setDefaultCountry("");
	cart.setDomain(".adobe.com"); // set this to ".adobe.com"
	cart.setContextPath(""); // set this to empty when web context is '/'
	// Possibly add the .edu selector or override market segment
	Adobe.Product.Controller.CPod.EduController.processLocation(true);
	if(cart.isOverlaySupported()) {
		var PromoIDReport = new Array();
		var prmid = window.location.search.match(/\bpromoid\=([^&#$]+)/);
		if(prmid) {
			prmid[1]=prmid[1].toUpperCase();
			cart.setEmailTrackingId(prmid[1]);
		}
		// if a promo code is pass thru the URL, set the promo in the cart and the cookie
		prmid = window.location.search.match(/\bpromocode\=([^&#$]+)/) || null;
		if(prmid) {
			if (Adobe && Adobe.Cart && Adobe.Cart.Models && Adobe.Cart.Models.Cart) {
				var cart = Adobe.Cart.Models.Cart;
				var marketSegment = cart.getMarketSegment() || Adobe.Product.Controller.CPod.EduController.COM;
				cart.addPromotion({code:prmid[1], marketSegment:marketSegment});
				cart.savePromoCode(prmid[1]);
			}
		}
	}
	//]]>
</script>
<script>
	$(document).ready(function()
	{
		adobe.dom.param("wcmmode=disabled");
		adobe.dom.param("compress=false");
	});
</script>
<script>
    var locales = {"cn":true,"us":true,"en_xx":true,"mena_fr":true,"tw":true};
    var tokens = document.location.pathname.split('/');
    var locale = ((tokens.length < 2) || ((locales[tokens[1]] == undefined) && tokens[1]!='content')) ? 'us' : tokens[1];
    var geoCook = 'international=';
    var cookies = document.cookie.split(';');
    for(var i=0;i < cookies.length;i++) {
        var c = cookies[i];
        if ((c.indexOf(geoCook) >= 0) && !(locale=='content') ){
            var preferredLocale = c.substring(c.indexOf(geoCook) + geoCook.length,c.length);
            if ((preferredLocale != locale)&&(locales[preferredLocale])){
                var url = document.location.pathname + document.location.search;
                if (locale == 'us'){
                    url = '/' + preferredLocale + url;
                } else {
                    var suffix = url.substring(locale.length + 1);
                    if ((suffix == null) || (suffix == ""))
                    { 
                    	suffix = "/";
                    }
                    if (preferredLocale != 'us'){
                        url = '/' + preferredLocale + suffix;
                    } else {
                        url = suffix;
                    }
                }
                window.location.replace(url);
            }
        }
    }
</script>
<!--[if (gte IE 9)|(IEMobile)]><!-->
    <link rel="stylesheet" media="only screen" href="/etc/pagetables/reflowtypes/adobe_adc_article.css"/>
    <script src="/etc/pagetables/reflowtypes/adobe_adc_article.js"></script>
    <!--<![endif]-->
<script>
    //<![CDATA[
    if(typeof jQuery != 'undefined'){
        (function($) {
            var dispatcher = (adobe.vrbl("reflowDispatcher") || adobe.vrbl("reflowDispatcher", adobe.reflow.createDispatcher("width", window.document))),
                    viewport = $(window),
                    viewportWidth = NaN,
                    meta = window.document.getElementsByName("viewport")[0],
                    metaContent;

            $(window).bind("resize orientationchange", setRenderMode);

            if(meta) {
                $(window.document).bind("adobe.reflow.LayoutChange", snapViewportToMaxWidth);
            }

            setRenderMode();

            function snapViewportToMaxWidth(event, layout_event) {
                if (layout_event.snapView && layout_event.active) {
                    var widthSetter = "width=",
                            width = widthSetter+layout_event.maxRange,
                            content = meta.getAttribute("content");

                    if(content.indexOf(widthSetter) > -1) {
                        content = content.replace(/width=[^,$]+/, width);
                    } else {
                        content = width;
                    }
                    meta.setAttribute("content", content);
                }
            }

            function setRenderMode() {
                var currentViewportWidth = viewport.width();
                if (viewportWidth == currentViewportWidth) {
                    return;
                } //trottle noisy event
                viewportWidth = currentViewportWidth;
                dispatcher.updateLayout(viewportWidth);
            }
        })(jQuery);
    }
    //]]>
</script>
<link rel="stylesheet" media="screen" href="http://wwwimages.adobe.com/www.adobe.com/include/style/article-compressed.css"/>
<script src="http://community.adobe.com/help/badge/v4/ionLoader.js"></script>
	<script src="http://community.adobe.com/help/badge/v4/ionSupport.js"></script>
	<script src="http://community.adobe.com/help/badge/v4/ionBadge.js"></script>
<script type="text/javascript" src="/etc/clientlibs/granite/jquery.js"></script>
<script type="text/javascript" src="/etc/clientlibs/granite/utils.js"></script>
<script type="text/javascript" src="/etc/clientlibs/granite/jquery/granite.js"></script>
<script type="text/javascript" src="/etc/clientlibs/foundation/jquery.js"></script>
<script type="text/javascript" src="/etc/clientlibs/foundation/shared.js"></script>
<script type="text/javascript" src="/etc/clientlibs/foundation/personalization/kernel.js"></script>
<link rel="stylesheet" href="/apps/dotcom/ag-widgets.css" type="text/css">
<script type="text/javascript">
    $CQ(function() {
        CQ_Analytics.SegmentMgr.loadSegments("/etc/segmentation");
        CQ_Analytics.ClientContextUtils.init("/etc/clientcontext/default","/content/dotcom/en/devnet/flex/articles/itemeditors_pt1");

        
    });
</script><script type="text/javascript" src="/etc/clientlibs/granite/jquery-ui.js"></script>
<script type="text/javascript" src="/etc/clientlibs/foundation/jquery-ui.js"></script>
<script type="text/javascript" src="/etc/designs/dotcom/clientlib/stores.js"></script>
<link rel="stylesheet" href="/etc/clientlibs/granite/jquery-ui.css" type="text/css">
<link rel="stylesheet" href="/etc/clientlibs/foundation/jquery-ui/themes/default.css" type="text/css">
<script src="http://wwwimages.adobe.com/www.adobe.com/content/dam/Adobe/typekit/yoe7ink.js"></script>
        <script>try{Typekit.load();}catch(e){}</script>
    </head>
<body class="Text TextMedium Link">
<div class="ArticleGrid ArticleWideGrid LayoutSlimGrid LayoutCenter PanelDiffuseShadow PanelFillExtraLight LayoutP">
    <div class="PrintLayoutHide">
        <!--googleoff: all--><div class="sitenav"><script>
    //<![CDATA[
	if (navigator.userAgent.match(/iPad/i) != null){
		adobe.dom.createStyleSheet($('head').get(0), "/include/style/default/SiteHeader-iPad.css");
	}

    $(document).ready(adobe.fn.initGlobalNav);
    //]]>
</script>
<!--googleoff: index-->
<!-- $Id: //depot/projects/dylan/releases/rc_13_11/ubi/globalnav/en_us/globalnav_ssi.html#1 $ -->
<form id="globalnav-search" class="searchbuddy LayoutSlimHidden" name="globalnav-search" method="get" action="/go/gnav_search" accept-charset="utf-8">
    <div id="SiteHeader" class="SiteHeader Text TextSmall">
        <span id="globalnav"></span>
        <a href="/" id="shHome" class="SiteHeaderHome">Adobe</a>
        <div class="SiteHeaderBar" id="shBar">
            <div class="SiteHeaderDropdownLink SiteHeaderBarItem SiteHeaderBarItemFirst" id="shProducts">
                <a href="/products/catalog.html?promoid=KAWQI" id="shProductsLink" class="SiteHeaderBarLink">Products</a>
                <div class="SiteHeaderDropPanel SiteHeaderDropdown-Full" id="ProductsPanel">
                    <div class="SiteHeaderColumnSingle">
                        <div class="SiteHeaderRow">
                            <p class="SiteHeaderPanelHeader">Top destinations</p>
                            <ul>
                                <li class="SiteHeaderPanelLink"><a href="/products/creativecloud.html?promoid=JQPEQ" id="Products_Topdestinations_AdobeCreativeCloud">Adobe Creative Cloud</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/products/creativecloud/teams.html?promoid=KFKQF" id="Products_Topdestinations_CreativeCloudforteams">Creative Cloud for teams</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/products/cs6.html?promoid=JOLIS" id="Product_Topdestinationss_CreativeSuite6">Creative Suite 6</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/marketing?promoid=JOLIT" id="Products_Topdestinations_AdobeMarketingCloud">Adobe Marketing Cloud</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/products/acrobat.html?promoid=JOLIR" id="Products_Topdestinations_Acrobat">Acrobat</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/products/photoshop.html?promoid=JOLIW" id="Products_Topdestinations_Photoshop">Photoshop</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/products/sitecatalyst.html?promoid=KAWQH" id="Product_Topdestinationss_SiteCatalyst">SiteCatalyst</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/education/students.html?marketSegment=EDU&promoid=KFKQD" id="Product_Topdestinationss_Students">Students</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/products/elements-family.html?promoid=JOLIV" id="Product_Topdestinationss_Elementsfamily">Elements family</a></li>
                            </ul>
                        </div>
                    </div>
            
                    <div class="SiteHeaderColumnDouble SiteHeaderShadowLeft">
                        <div class="SiteHeaderRow">
                            <p class="SiteHeaderPanelHeader">Adobe Creative Cloud</p>
                            <ul>
                                <li class="SiteHeaderPanelLink"><a href="/products/creativecloud.html?promoid=KAUBZ" id="Products_AdobeCreativeCloud_WhatisAdobeCreativeCloud">What is Adobe Creative Cloud?</a></li>
                            </ul>

                            <div class="SiteHeaderColumn-1">
                                <ul>
                                    <li class="SiteHeaderPanelLink"><a href="/products/creativecloud/design.html?promoid=KFKPZ" id="Products_AdobeCreativeCloud_Design">Design</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/creativecloud/web.html?promoid=KFKQC" id="Products_AdobeCreativeCloud_Web">Web</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/creativecloud/photography.html?promoid=KFKQA" id="Products_AdobeCreativeCloud_Photography">Photography</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/creativecloud/video.html?promoid=KFKQB" id="Products_AdobeCreativeCloud_Video">Video</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/creativecloud/students.html?marketSegment=EDU&promoid=JUTMG" id="Products_AdobeCreativeCloud_Students">Students</a></li>
                                </ul>
							</div>            

                            <div class="SiteHeaderColumn-2">
                                <ul>
                                    <li class="SiteHeaderPanelLink"><a href="/products/creativecloud/teams.html?promoid=JZVVU" id="Products_AdobeCreativeCloud_Teams">Teams</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/creativecloud/enterprise.html?promoid=KFKPX" id="Products_AdobeCreativeCloud_Enterprise">Enterprise</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/creativecloud/enterprise/education.html?promoid=KFKQE" id="Products_AdobeCreativeCloud_Educationalinstitutions">Educational institutions</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/creativecloud/enterprise.html?promoid=KFKPY" id="Products_AdobeCreativeCloud_Government">Government</a></li>
                                </ul>
							</div>            

                            <div class="SiteHeaderColumn-1">
                                <p class="SiteHeaderPanelHeaderSmall">Design and photography</p>
                                <ul>
                                    <li class="SiteHeaderPanelLink"><a href="/products/photoshop.html?promoid=KAUCA" id="Products_DesignandPhotography_Photoshop">Photoshop</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/illustrator.html?promoid=KAUCB" id="Products_DesignandPhotography_Illustrator">Illustrator</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/indesign.html?promoid=KAUCC" id="Products_DesignandPhotography_InDesign">InDesign</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/muse.html?promoid=KAUCE" id="Products_DesignandPhotography_AdobeMuse">Adobe Muse</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/photoshop-lightroom.html?promoid=KAUCD" id="Products_DesignandPhotography_Lightroom">Lightroom</a></li>
                                </ul>
            
                                <p class="SiteHeaderPanelHeaderSmall">Video</p>
                                <ul class="SiteHeaderPanelLinkNoBottom">
                                    <li class="SiteHeaderPanelLink"><a href="/products/premiere.html?promoid=KAUCJ" id="Products_Video_AdobePremiere">Adobe Premiere</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/aftereffects.html?promoid=KAUCK" id="Products_Video_AfterEffects">After Effects</a></li>
                                </ul>
                            </div>
            
                            <div class="SiteHeaderColumn-2">
                                <p class="SiteHeaderPanelHeaderSmall">Web development and HTML5</p>
                                <ul class="SiteHeaderPanelLinkNoBottom">
                                    <li class="SiteHeaderPanelLink"><a href="http://html.adobe.com/edge/?promoid=KAGMS" target="_blank" id="Products_WebdevelopmentHTML5_EdgeToolsServices">Edge Tools &amp; <span class="SiteHeaderIconNewWindowNoWrap">Services<span class="SiteHeaderIconNewWindow"> [opens in a new window]</span></span></a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/dreamweaver.html?promoid=KAUCF" id="Products_WebdevelopmentHTML5_Dreamweaver">Dreamweaver</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="http://gaming.adobe.com/?promoid=KAUCG" target="_blank" id="Products_WebdevelopmentHTML5_Gaming"><span class="SiteHeaderIconNewWindowNoWrap">Gaming<span class="SiteHeaderIconNewWindow"> [opens in a new window]</span></span></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
            
                    <div class="SiteHeaderColumnDouble SiteHeaderShadowLeft">
                        <div class="SiteHeaderRow">
                            <p class="SiteHeaderPanelHeader">Adobe Marketing Cloud</p>
                            <ul>
                                <li class="SiteHeaderPanelLink"><a href="/solutions/digital-marketing.html?promoid=KAUCL" id="Products_AdobeMarketingCloud_WhatisAdobeMarketingCloud">What is Adobe Marketing Cloud?</a></li>
                            </ul>
            
                            <div class="SiteHeaderColumn-1">
                                <ul>
                                    <li class="SiteHeaderPanelLink"><a href="/solutions/digital-analytics.html?promoid=KAVVU" id="Products_AdobeMarketingCloud_Digitalanalytics">Digital analytics</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/solutions/social-marketing.html?promoid=KAVVV" id="Products_AdobeMarketingCloud_Socialmarketing">Social marketing</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/solutions/web-experience-management.html?promoid=KAVVX" id="Products_AdobeMarketingCloud_Webexperiencemanagement">Web experience management</a></li>
                                </ul>
                            </div>
            
                            <div class="SiteHeaderColumn-2">
                                <ul>
                                    <li class="SiteHeaderPanelLink"><a href="/solutions/testing-targeting.html?promoid=KAVVW" id="Products_AdobeMarketingCloud_Testingandtargeting">Testing and targeting</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/solutions/media-optimization.html?promoid=KAVVY" id="Products_AdobeMarketingCloud_Mediaoptimization">Media optimization</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/solutions/campaign-management.html?promoid=KFKQH" id="Products_AdobeMarketingCloud_Campaignmanagement">Campaign management</a></li>
                                </ul>
                            </div>
            
                            <div class="SiteHeaderColumn-1">
                                <p class="SiteHeaderPanelHeaderSmall">Analytics</p>
                                <ul>
                                    <li class="SiteHeaderPanelLink"><a href="/products/sitecatalyst.html?promoid=KAUCM" id="Products_Analytics_SiteCatalyst">SiteCatalyst</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/discover.html?promoid=KAUCN" id="Products_Analytics_AdobeDiscover">Adobe Discover</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/insight.html?promoid=KAUCO" id="Products_Analytics_Insight">Insight</a></li>
                                </ul>
            
                                <p class="SiteHeaderPanelHeaderSmall">Social</p>
                                <ul>
                                    <li class="SiteHeaderPanelLink"><a href="/solutions/social-marketing.html?promoid=KAUCP" id="Products_Social_AdobeSocial">Adobe Social</a></li>
                                </ul>
            
                                <p class="SiteHeaderPanelHeaderSmall">Experience Manager</p>
                                <ul class="SiteHeaderPanelLinkNoBottom">
                                    <li class="SiteHeaderPanelLink"><a href="/products/cq.html?promoid=KAUCQ" id="Products_ExperienceManager_CQ">CQ</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/scene7.html?promoid=KAUCR" id="Products_ExperienceManager_Scene7">Scene7</a></li>
                                </ul>
                            </div>
            
                            <div class="SiteHeaderColumn-2">
                                <p class="SiteHeaderPanelHeaderSmall">Target</p>
                                <ul>
                                    <li class="SiteHeaderPanelLink"><a href="/products/testandtarget.html?promoid=KAUCS" id="Products_Target_TestTarget">Test&amp;Target</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/recommendations.html?promoid=KAUCT" id="Products_Target_Recommendations">Recommendations</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/searchandpromote.html?promoid=KAUCU" id="Products_Target_SearchPromote">Search&amp;Promote</a></li>
                                </ul>
            
                                <p class="SiteHeaderPanelHeaderSmall">Media Optimizer</p>
                                <ul>
                                    <li class="SiteHeaderPanelLink"><a href="/products/adlens.html?promoid=KAUCV" id="Products_MediaOptimizer_AdLens">AdLens</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/audiencemanager.html?promoid=KAUCW" id="Products_MediaOptimizer_AudienceManager">AudienceManager</a></li>
                                    <li class="SiteHeaderPanelLink"><a href="/products/audienceresearch.html?promoid=KAUCX" id="Products_MediaOptimizer_AudienceResearch">AudienceResearch</a></li>
                                </ul>
                                
                                <p class="SiteHeaderPanelHeaderSmall">Campaign management</p>
                                <ul class="SiteHeaderPanelLinkNoBottom">
                                    <li class="SiteHeaderPanelLink"><a href="/solutions/campaign-management.html?promoid=KFKQI" id="Products_Campaignmanagement_AdobeCampaign">Adobe Campaign</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
            
                    <div class="SiteHeaderColumnSingle SiteHeaderShadowLeft">
                        <div class="SiteHeaderRow">
                            <p class="SiteHeaderPanelHeader">Document services</p>
                            <ul>
                                <li class="SiteHeaderPanelLink"><a href="/products/acrobat.html?promoid=KAUCY" id="Products_DocumentServices_Acrobat">Acrobat</a></li>
                                <li class="SiteHeaderPanelLink"><a href="https://www.echosign.adobe.com/en/home.html?promoid=KAUDB" target="_blank" class="SiteHeaderLinkNewWindow" id="Products_DocumentServices_EchoSign"><span class="SiteHeaderIconNewWindowNoWrap">EchoSign<span class="SiteHeaderIconNewWindow"> [opens in a new window]</span></span></a></li>
                                <li class="SiteHeaderPanelLink"><a href="https://www.acrobat.com/formscentral/en/home.html?promoid=KAUCZ" target="_blank" id="Products_DocumentServices_FormsCentral"><span class="SiteHeaderIconNewWindowNoWrap">FormsCentral<span class="SiteHeaderIconNewWindow"> [opens in a new window]</span></span></a></li>
                                <li class="SiteHeaderPanelLink"><a href="https://www.acrobat.com/sendnow/en/home.html?promoid=KAUDA" target="_blank" id="Products_DocumentServices_SendNow"><span class="SiteHeaderIconNewWindowNoWrap">SendNow<span class="SiteHeaderIconNewWindow"> [opens in a new window]</span></span></a></li>
                                <li class="SiteHeaderPanelLink"><a href="https://www.acrobat.com/welcome/en/home.html?promoid=KAUDC" target="_blank" id="Products_DocumentServices_Acrobatcom"><span class="SiteHeaderIconNewWindowNoWrap">Acrobat.com<span class="SiteHeaderIconNewWindow"> [opens in a new window]</span></span></a></li>
                            </ul>
            
                            <p class="SiteHeaderPanelHeader">Publishing</p>
                            <ul class="SiteHeaderPanelLinkNoBottom">
                                <li class="SiteHeaderPanelLink"><a href="/products/digital-publishing-suite-family.html?promoid=JOLIU" id="Products_Publishing_DigitalPublishingSuite">Digital Publishing Suite</a></li>
                            </ul>
                        </div>
                    </div>
                    <br style="clear: both" />
            
                    <div class="SiteHeaderRow">
                        <ul class="SiteHeaderRightLink">
                            <li class="SiteHeaderPanelLink"><a href="/products/catalog.html?promoid=JOOTH" id="Products_Seeallproducts">See all products</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="SiteHeaderDropdownLink SiteHeaderBarItem" id="shBusinessSolutions">
                <a href="/solutions.html?promoid=KAWQJ" id="shBusinessSolutionsLink" class="SiteHeaderBarLink">Business solutions</a>
                <div class="SiteHeaderDropPanel SiteHeaderDropdown-Double" id="BusinessSolutionsPanel">
                    <div class="SiteHeaderRow">
                        <div class="SiteHeaderColumn-1">
                            <p class="SiteHeaderPanelHeaderSmall">By business need</p>
                            <ul>
                                <li class="SiteHeaderPanelLink"><a href="/solutions/digital-analytics.html?promoid=JOLJB" id="BusinessSolutions_Bybusinessneed_Digitalanalytics">Digital analytics</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/solutions/digital-publishing.html?promoid=JOLJA" id="BusinessSolutions_Bybusinessneed_Digitalpublishing">Digital publishing</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/products/acrobat.html?promoid=KAWSC" id="BusinessSolutions_Bybusinessneed_Documentmanagement">Document management</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/solutions/media-optimization.html?promoid=JOLIX" id="BusinessSolutions_Bybusinessneed_Mediaoptimization">Media optimization</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/solutions/social-marketing.html?promoid=JZPNO" id="BusinessSolutions_Bybusinessneed_Socialmarketing">Social marketing</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/solutions/testing-targeting.html?promoid=KAXLU" id="BusinessSolutions_Bybusinessneed_Testingandtargeting">Testing and targeting</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/products/creativecloud/video.html?promoid=KAUDD" id="BusinessSolutions_Bybusinessneed_Videoeditingandserving">Video editing and serving</a></li>
                                <li class="SiteHeaderPanelLink"><a href="http://html.adobe.com?promoid=JZEFF" target="_blank" class="SiteHeaderLinkNewWindow" id="BusinessSolutions_Bybusinessneed_Webdevelopment">Web <span class="SiteHeaderIconNewWindowNoWrap">development<span class="SiteHeaderIconNewWindow"> [opens in a new window]</span></span></a></li>
                                <li class="SiteHeaderPanelLink"><a href="/solutions/web-experience-management.html?promoid=JOOYM" id="BusinessSolutions_Bybusinessneed_Webexperiencemanagement">Web experience management</a></li>
                            </ul>
            
                            <ul class="SiteHeaderPanelLinkNoBottom">
                                <li class="SiteHeaderPanelLink"><a href="/solutions.html?promoid=JOOTI" id="BusinessSolutions_Seeallbusinessneeds">See all business needs</a></li>
                            </ul>
                         </div>
            
                        <div class="SiteHeaderColumn-2">
                            <p class="SiteHeaderPanelHeaderSmall">By industry</p>
                            <ul>
                                <li class="SiteHeaderPanelLink"><a href="/solutions/broadcasting.html?promoid=JOLIY" id="BusinessSolutions_Byindustry_Broadcast">Broadcast</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/education.html?marketSegment=EDU&promoid=JOLIZ" id="BusinessSolutions_Byindustry_Education">Education</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/solutions/financial-services.html?promoid=KAUDE" id="BusinessSolutions_Byindustry_Financialservices">Financial services</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/solutions/government.html?promoid=KAUDF" id="BusinessSolutions_Byindustry_Government">Government</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/solutions/digital-publishing.html?promoid=KAUDG" id="BusinessSolutions_Byindustry_Publishing">Publishing</a></li>
                                <li class="SiteHeaderPanelLink"><a href="/solutions/retail.html?promoid=KAWSD" id="BusinessSolutions_Byindustry_Retail">Retail</a></li>
                            </ul>
            
                            <ul class="SiteHeaderPanelLinkNoBottom">
                                <li class="SiteHeaderPanelLink"><a href="/solutions.html?promoid=KAUDH" id="BusinessSolutions_Seeallindustries">See all industries</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <div class="SiteHeaderDropdownLink SiteHeaderBarItem" id="shSupportLearning">
                <a href="http://helpx.adobe.com/support/?promoid=KAWQK" id="shSupportLearningLink" class="SiteHeaderBarLink">Support &amp; Learning</a>
                <div class="SiteHeaderDropPanel SiteHeaderDropdown-Single" id="SupportLearningPanel">
                    <div class="SiteHeaderRow">
                        <p class="SiteHeaderPanelHeaderSmall">I need help</p>
                        <ul>
                            <li class="SiteHeaderPanelLink"><a href="http://helpx.adobe.com/support/?promoid=JZEFP" id="SupportLearning_Ineedhelp_Products">Products</a></li>
                            <li class="SiteHeaderPanelLink"><a href="http://helpx.adobe.com/creative-cloud/topics/getting-started.html?promoid=JZEFO" id="SupportLearning_Ineedhelp_AdobeCreativeCloud">Adobe Creative Cloud</a></li>
                            <li class="SiteHeaderPanelLink"><a href="http://helpx.adobe.com/marketing-cloud.html?promoid=KAWSE" id="SupportLearning_Ineedhelp_AdobeMarketingCloud">Adobe Marketing Cloud</a></li>
                            <li class="SiteHeaderPanelLink"><a href="http://forums.adobe.com/index.jspa?promoid=JZEFM" target="_blank" id="SupportLearning_Ineedhelp_Forums"><span class="SiteHeaderIconNewWindowNoWrap">Forums<span class="SiteHeaderIconNewWindow"> [opens in a new window]</span></span></a></li>
                        </ul>
            
                        <p class="SiteHeaderPanelHeaderSmall">I want to learn</p>
                        <ul class="SiteHeaderPanelLinkNoBottom">
                            <li class="SiteHeaderPanelLink"><a href="http://helpx.adobe.com/learning.html?promoid=KAUDK" id="SupportLearning_Iwanttolearn_Trainingandtutorials">Training and tutorials</a></li>
                            <li class="SiteHeaderPanelLink"><a href="http://training.adobe.com/certification.html?promoid=KAUDM" target="_blank" id="SupportLearning_Iwanttolearn_Certification"><span class="SiteHeaderIconNewWindowNoWrap">Certification<span class="SiteHeaderIconNewWindow"> [opens in a new window]</span></span></a></li>
                            <li class="SiteHeaderPanelLink"><a href="/devnet.html?promoid=KAUDN" id="SupportLearning_Iwanttolearn_AdobeDeveloperConnection">Adobe Developer Connection</a></li>
                            <li class="SiteHeaderPanelLink"><a href="/designcenter.html?promoid=KAUDO" id="SupportLearning_Iwanttolearn_AdobeDesignCenter">Adobe Design Center</a></li>
                            <li class="SiteHeaderPanelLink"><a href="http://tv.adobe.com?promoid=KFELF" target="_blank" id="SupportLearning_Iwanttolearn_AdobeTV">Adobe <span class="SiteHeaderIconNewWindowNoWrap">TV<span class="SiteHeaderIconNewWindow"> [opens in a new window]</span></span></a></li>
                            <li class="SiteHeaderPanelLink"><a href="/solutions/digital-marketing/guides.html?promoid=KAWSF" id="SupportLearning_Iwanttolearn_AdobeMarketingCenter">Adobe Marketing Center</a></li>
                            <li class="SiteHeaderPanelLink"><a href="http://labs.adobe.com/?promoid=JZEFQ" target="_blank" id="SupportLearning_Iwanttolearn_AdobeLabs">Adobe <span class="SiteHeaderIconNewWindowNoWrap">Labs<span class="SiteHeaderIconNewWindow"> [opens in a new window]</span></span></a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="SiteHeaderDropdownLink SiteHeaderBarItem" id="shDownload">
                <a href="/downloads/?promoid=KAWQL" id="shDownloadLink" class="SiteHeaderBarLink">Download</a>
                <div class="SiteHeaderDropPanel SiteHeaderDropdown-Single" id="DownloadPanel">
                    <div class="SiteHeaderRow">
                        <ul>
                            <li class="SiteHeaderPanelLink"><a href="/downloads/?promoid=JZEFS" id="Download_Producttrials">Product trials</a></li>
                            <li class="SiteHeaderPanelLink"><a href="http://get.adobe.com/flashplayer/?promoid=JZEFT" id="Download_AdobeFlashPlayer">Adobe Flash Player</a></li>
                            <li class="SiteHeaderPanelLink"><a href="http://get.adobe.com/reader/?promoid=JZEFU" id="Download_AdobeReader">Adobe Reader</a></li>
                            <li class="SiteHeaderPanelLink"><a href="http://get.adobe.com/air/?promoid=JZEFV" id="Download_AdobeAIR">Adobe AIR</a></li>
                        </ul>
            
                        <ul class="SiteHeaderPanelLinkNoBottom">
                            <li class="SiteHeaderPanelLink"><a href="/downloads/?promoid=JZEFW" id="Download_Seealldownloads">See all downloads</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="SiteHeaderDropdownLink SiteHeaderBarItem" id="shCompany">
                <a href="/company.html?promoid=KAWQM" id="shCompanyLink" class="SiteHeaderBarLink">Company</a>
                <div class="SiteHeaderDropPanel SiteHeaderDropdown-Single" id="CompanyPanel">
                    <div class="SiteHeaderRow">
                        <ul>
                            <li class="SiteHeaderPanelLink"><a href="/careers.html?promoid=JZEFX" id="Company_CareersatAdobe">Careers at Adobe</a></li>
                            <li class="SiteHeaderPanelLink"><a href="/aboutadobe/invrelations/?promoid=JZEFZ" id="Company_InvestorRelations">Investor Relations</a></li>
                            <li class="SiteHeaderPanelLink"><a href="/aboutadobe/pressroom/?promoid=JZEGA" id="Company_Newsroom">Newsroom</a></li>
                            <li class="SiteHeaderPanelLink"><a href="/privacy.html?promoid=JZEGB" id="Company_Privacy">Privacy</a></li>
                            <li class="SiteHeaderPanelLink"><a href="/corporate-responsibility.html?promoid=JZEFY" id="Company_CorporateResponsibility">Corporate Responsibility</a></li>
                            <li class="SiteHeaderPanelLink"><a href="/customershowcase.html?promoid=KEWBG" id="Company_CustomerShowcase">Customer Showcase</a></li>
                            <li class="SiteHeaderPanelLink"><a href="/company/contact.html?promoid=JZEGC" id="Company_Contactus">Contact us</a></li>
                        </ul>
            
                        <ul class="SiteHeaderPanelLinkNoBottom">
                            <li class="SiteHeaderPanelLink"><a href="/company.html?promoid=JZPLK" id="Company_Morecompanyinfo">More company info</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="SiteHeaderDropdownLink SiteHeaderBarItem" id="shBuy">
                <a href="/products/catalog/software._sl_id-contentfilter_sl_catalog_sl_software_sl_mostpopular.html?promoid=KAWQN" id="shBuyLink" class="SiteHeaderBarLink">Buy</a>
                <div class="SiteHeaderDropPanel SiteHeaderDropdown-Single" id="BuyPanel">
                    <div class="SiteHeaderRow">
                        <ul class="SiteHeaderPanelLinkNoBottom">
                            <li class="SiteHeaderPanelLink"><a href="/products/catalog/software.html?marketSegment=COM&promoid=KAWQO" id="Buy_Forpersonalandprofessionaluse">For personal and professional use</a></li>
                            <li class="SiteHeaderPanelLink"><a href="/products/catalog/software._sl_id-contentfilter_sl_catalog_sl_education_sl_alledu.html?marketSegment=EDU&promoid=KAWQP" id="Buy_Forstudentseducatorsandstaff">For students, educators, and staff</a></li>
                            <li class="SiteHeaderPanelLink"><a href="/products/small-business-pricing/software-catalog._sl_id-contentfilter_sl_catalog_sl_software_sl_creativecloudmembership.html?marketSegment=COM&promoid=JOLJE" id="Buy_Forsmallandmediumbusinesses">For small and medium businesses</a></li>
                            <li class="SiteHeaderPanelLink"><a href="/volume-licensing.html?promoid=KAWQQ" id="Buy_VolumeLicensing">Volume Licensing</a></li>
                            <li class="SiteHeaderPanelLink"><a href="/products/discount-software-coupons.html?promoid=KAWQR" id="Buy_Specialoffers">Special offers</a></li>
                            <li class="SiteHeaderPanelLink"><a href="http://success.adobe.com/en/na/programs/rfi/dm_sales_inquiries.html?promoid=KAWSG" target="_blank" id="Buy_AdobeMarketingCloudsales">Adobe Marketing Cloud <span class="SiteHeaderIconNewWindowNoWrap">sales<span class="SiteHeaderIconNewWindow"> [opens in a new window]</span></span></a></li>
                        </ul>
                    </div>
                </div>
            </div>

			<!--
            <div id="tooltipStrings" class="SiteHeaderTooltipStrings LayoutHidden">
                <span id="tooltipStringExpandMenu">Expand menu</span>
                <span id="tooltipStringOpenLink">Open link</span>
            </div>
			-->
            
            <a href="/go/gnav_search" id="shSearchButton" class="SiteHeaderBarItem SiteHeaderSearchButton" style="display: none;">Search</a>
            <div class="SiteHeaderBarItem SiteHeaderBarItemLast">&nbsp;</div>
            <div id="site-search" class="SiteHeaderSearch">
                <input title="Search" type="text" id="search-input" name="term" maxlength="1000" />
                <input type="hidden" id="searchbuddy-loc" name="loc" value="en_us" />
                <button type="submit" id="search-submit" class="icon-replace search">Search</button>
            </div>
        </div>
        <div class="SiteHeaderUser">
            <div id="shSignInBlock">
                <a id="shInfo" class="SiteHeaderUserItem SiteHeaderInfo">Info</a>
                <a href="/account/sign-in.adobedotcom.html" id="shSignIn" class="SiteHeaderUserItem LinkStrong">Sign in</a>
                <div class="SiteHeaderPopPanelShadow width-250" id="InfoPanelShadow" style="display: none;"></div>
                <div class="SiteHeaderPopPanel width-250" id="InfoPanel" style="display: none;">
                    <div class="SiteHeaderPanelRow">
                        <span class="SiteHeaderPanelHeader">Why sign in?</span>
                        Sign in to manage your account and access trial downloads, product extensions, community areas, and more.
                    </div>
                </div>
            </div>
        
            <a href="/account.html" id="shWelcome" class="SiteHeaderUserItem SiteHeaderArrow LinkStrong" style="display: none;">Welcome, <span id="screenName"></span></a>
        
            <div class="SiteHeaderPopPanelShadow" id="WelcomePanelShadow" style="display: none;"></div>
            <div class="SiteHeaderPopPanel" id="WelcomePanel" style="display: none;">
                <div class="SiteHeaderPanelRow SiteHeaderPanelLink" id="shMyAccount">
                    <a class="SiteHeaderPanelHeader" href="/go/gnavtray_myadobe_en_us">My Adobe</a>
                </div>
                <div class="SiteHeaderPanelRow SiteHeaderPanelLink" id="shMyOrders">
                    <a class="SiteHeaderPanelHeader" href="/go/gnavtray_myadobe_myorders_en_us">My orders</a>
                </div>
                <div class="SiteHeaderPanelRow SiteHeaderPanelLink" id="shMyInformation">
                    <a class="SiteHeaderPanelHeader" href="/go/gnavtray_myadobe_myinformation_en_us">My information</a>
                </div>
                <div class="SiteHeaderPanelRow SiteHeaderPanelLink" id="shMyPreferences">
                    <a class="SiteHeaderPanelHeader" href="/go/gnavtray_myadobe_mypreferences_en_us">My preferences</a>
                </div>
                <div class="SiteHeaderPanelRow SiteHeaderPanelLink" id="shMyProductsServices">
                    <a class="SiteHeaderPanelHeader" href="/go/gnavtray_myadobe_myproducts_services_en_us">My products and services</a>
                </div>
                <div class="SiteHeaderPanelRow SiteHeaderPanelLink" id="shSignOut">
                    <a class="SiteHeaderPanelHeader" id="shSignOutLink" href="/cfusion/membership/logout.cfm">Sign out</a>
                </div>
            </div>
        
            <div id="MyCartLinkContainer">
                <a href="/go/gnav_mycart_en_us" id="shMyCart" class="SiteHeaderUserItem SiteHeaderCart">My cart<span id="cartQuantity"></span></a>
            </div>
        
            <a href="/privacy.html" id="shPrivacy" class="SiteHeaderUserItem">Privacy</a>
            <a href="/go/gnav_myadobe_en_us" id="shMyAdobe" class="SiteHeaderUserItem">My Adobe</a>
        </div>
    </div>
</form>

<div id="SiteHeaderMobile" class="SiteHeaderMobile LayoutHidden LayoutSlim Text TextSmall">
    <a href="/go/gnav_adobe_logo_en_us" id="shHomeMobile" class="SiteHeaderHome SiteHeaderHomeMobile">Adobe</a>

    <div class="SiteHeaderBar SiteHeaderBarMobile" id="shBarMobile">
        <span class="SiteHeaderBarItemMobile SiteHeaderBarItemMobileNoLeftBorder" id="shProductsMobileSpan"><a href="/go/gnav_products_en_us" id="shProductsMobile" class="SiteHeaderBarLink">Products</a></span>
        <span class="SiteHeaderBarItemMobile" id="shSectionsMobileSpan"><a href="#" id="shSectionsMobile" class="SiteHeaderArrowMobile SiteHeaderBarLink">Sections</a></span>
        <span class="SiteHeaderBarItemMobile" id="shSectionsMobileBuy"><a href="/go/gnav_store_en_us" id="shBuyMobile" class="SiteHeaderBarLink">Buy</a></span>
        <span class="SiteHeaderBarItemMobile SiteHeaderBarItemMobileNoRightBorder SiteHeaderBarItemMobileNoPadding">&nbsp;</span>
        <span class="SiteHeaderBarItemMobile SiteHeaderBarItemMobileNoRightBorder SiteHeaderBarItemFloatRight" id="shSearchMobileSpan"><a href="/go/gnav_search" id="shSearchMobile" class="SiteHeaderSearchButtonMobile">Search</a></span>
        <span class="SiteHeaderBarItemMobile SiteHeaderBarItemMobileNoLeftBorder SiteHeaderBarItemFloatRight SiteHeaderBarItemMobileNoPadding">&nbsp;</span>
    </div>
    <div class="SiteHeaderBarMobileExtend" id="shBarExtend">
        <div id="shBarExtendSections" style="display: none;">
            <div id="shBarExtendSections1" class="SiteHeaderBarMobileExtendSections">
                <a href="/go/gnav_solutions_en_us" id="shSectionsSolutionsMobile" class="SiteHeaderBarExtendSectionsItem SiteHeaderBarLink">Solutions</a>
                <a href="/go/gnav_company_en_us" id="shSectionsCompanyMobile" class="SiteHeaderBarExtendSectionsItem SiteHeaderBarLink">Company</a>
            </div>
            <div id="shBarExtendSections2" class="SiteHeaderBarMobileExtendSections">
                <a href="/go/gnav_help_en_us" id="shSectionsHelpMobile" class="SiteHeaderBarExtendSectionsItem SiteHeaderBarLink">Help</a>
                <a href="/go/gnav_learning_en_us" id="shSectionsLearningMobile" class="SiteHeaderBarExtendSectionsItem SiteHeaderBarLink">Learning</a>
            </div>
        </div>
        <div id="shBarExtendSearch" style="display: none;">
            <form id="globalnav-search-mobile" class="SiteHeaderSearchMobileForm" name="globalnav-search-mobile" method="get" action="/go/gnav_search" accept-charset="utf-8">
                <input title="Search" type="text" id="search-input-mobile" name="term" maxlength="1000" />
                <button type="submit" id="search-submit-mobile">Search</button>
            </form>
        </div>
    </div>
    <div class="SiteHeaderUser">
        <a href="/cfusion/membership/index.cfm?loc=en_us&amp;nl=1" id="shSignInMobile" class="SiteHeaderUserItem SiteHeaderUserItemMobile LinkStrong">Sign in</a>
        <a href="/cfusion/membership/logout.cfm" id="shSignOutMobile" class="SiteHeaderUserItem SiteHeaderUserItemMobile LinkStrong" style="display: none;">Sign out</a>
        <a href="/privacy.html" id="shPrivacyMobile" class="SiteHeaderUserItem SiteHeaderUserItemMobile">Privacy</a>
        <a href="/go/gnav_myadobe_en_us" id="shMyAdobeMobile" class="SiteHeaderUserItem SiteHeaderUserItemMobile">My Adobe</a>
    </div>
</div>
<!--googleon: index--><div class="hovercart"><div id="HoverCartModal">
		<div class="CartHeaderPopPanelShadow HoverCartwidth" id="CartPanelShadow" style="display: none;">
		<div class="CartHeaderPopPanel HoverCart" id="CartPanel">
			<div id="HoverCartItem" class="RuleHBottom HoverCart-1-3 LayoutBigRowTop" style="display: none">
				<div class="LayoutBreakAfter">
					<div class="HoverCart-1 LayoutHItem">
						<div style="padding-left:60px;" class=" LayoutBreakAfter LayoutPullout">
	<div id="HoverCartBoxShotxyz" class="HoverCartBoxShot">
								<a href="">
										<img src="" class="LayoutImage" alt=""/>
									</a>
								</div>
							<div style="float:left;width:100%" class="CPodCostCell">
							    <span class="TextStrong ProductName" id="HoverCartHeaderxyz"> 
							    	<a href="#">
							        	</a>
							    </span>
								<div class="LayoutBigRowBottom" id="HoverCartDescriptionxyz">
									</div>
                                <span id="HoverCartPreOrderHardGoodMsgxyz" style="display:none;" class="TextWarning TextPostScript">Preorder Estimated Availability <span id="HoverCartPreOrderHardGoodMsgDatexyz">Date</span>. Your credit card will not be charged until the product is shipped. Estimated availability date is subject to change.</span>
                                <span id="HoverCartPreOrderSoftGoodMsgxyz" style="display:none;" class="TextWarning TextPostScript">Preorder Estimated Availability <span id="HoverCartPreOrderSoftGoodMsgDatexyz">Date</span>. Your credit card will not be charged until the product is ready to download. Estimated availability date is subject to change.</span>

							</div>
						</div>
</div>
					<div class="LayoutHItem HoverCart-2">
						<div class="HoverCartQty">
							Qty: 
							<span id="HoverCartQtyxyz">
								</span>
						</div>
					</div>
                    <div class="LayoutRight">
						<div class="CheckoutCostDark LayoutRight TextRight">
							<span id="HoverCartPricexyz"> 
							</span>
								<span id="HoverCartSubscriptionxyz" class="CheckoutSubscription"> 
								</span>						
                            <div id="HoverCartVatPercentageLabelxyz" class="TextEm TextSmall" style="display:none; max-width: 100px;"><span id="HoverCartVatPercentagePreTextxyz"></span>
                                    <span id="HoverCartVatPercentagexyz"></span></div>                  
                        </div>
					</div>
					
				</div>
				<div class="HoverCartEDUMessage LayoutBigCellBottom" style="display:none">Purchase requires verification of academic eligibility</div>
			</div>
			<div id="HoverCartContainer" class="LayoutBreakAfter" style=""></div>
			<a id="HoverCartMoreItems" class="LayoutBreakAfter" style="text-align: center;" href="/cart.html"></a>
            <div  id="HoverCartButtons" class="HoverCart-1-3">
                <table border="0" align="right" width="70%">
                    <tr>
                        <td>
                            <div class="TextRight HoverCartSubTotal">Subtotal</div>
                            <div id="ExVatLabel" style="display:none" class="TextEm TextSmall TextRight"></div>
                        </td>
                        <td>
                            <div class="LayoutRight TextRight">
                                <div class="CheckoutCostDark">
                                    <span id="HoverCartSubTotal">
                                    </span>
                                        </div>
                            </div>
                        </td>
                    </tr>
                    <tr id="HoverCartPromotionsRow">
                        <td>
                            <div class="TextRight HoverCartPromotionsLabel HoverCartSubTotal">Promotions</div>
                        </td>
                        <td>
                            <div class="LayoutRight TextRight">
                                <div class="CheckoutCostDark">
                                    <span id="HoverCartPromotions">
                                    </span>
                                        </div>
                            </div>
                        </td>
                    </tr>
                    <tr id="HoverCartShippingRow">
                        <td>
                            <div class="TextRight HoverCartShippingLabel HoverCartSubTotal">Estimated shipping</div>
                        </td>
                        <td>
                            <div class="LayoutRight TextRight">
                                <div class="CheckoutCostDark">
                                    <span id="HoverCartShipping">
                                    </span>
                                        </div>
                            </div>
                        </td>
                    </tr>
                    <tr id="HoverCartVATRow">
                        <td>
                            <div class="TextRight HoverCartVATLabel HoverCartSubTotal">Tax</div>
                        </td>
                        <td>
                            <div class="LayoutRight TextRight">
                                <div class="CheckoutCostDark">
                                    <span id="HoverCartVat">
                                    </span>
                                        </div>
                                <div id="CartTaxHeader">
                                    Calculated at checkout</div>
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td><div class="RuleH"></div></td>
                        <td><div class="RuleH"></div></td>
                    </tr>
                    <tr>
                        <td>
                            <div class="TextRight HoverCartTotalLabel HoverCartSubTotal">Total</div>
                        </td>
                        <td>
                            <div class="LayoutRight TextRight">
                                <div class="CheckoutCostDark">
                                    <span id="HoverCartTotal">
                                    </span>
                                        </div>
                            </div>
                        </td>
                    </tr>
                </table>
				<div class="LayoutBreak"></div>		
				
				<div class="HoverCart-1-3 LayoutRight LayoutCellTop LayoutBreakAfter">
						<a href="/cart.html" id="HoverCartCheckOut" class="CartButtonYellow CartShopCheckOut LayoutRight"><span class="CartBuyIconText">Review and Checkout</span></a>
				</div>
			</div>
		</div>
		</div>
	</div>
<script>
	/*global jQuery,adobe*/
	jQuery.createNs("Adobe.Cart.ShoppingCart");

	Adobe.Cart.ShoppingCart.HoverCart = {
			
		MaxItems: "4",

		DisplayTime: "5000",

		MoreItemsTextSingular: "() more item in your cart",

		MoreItemsTextPlural: "() more items in your cart",

		MonthToMonthText: "per month",

		YearlyText: "per year"
    };

    Adobe.Cart.TaxLabels = {
            TaxInclusiveText    : "",
            TaxNotApplicable    : "Tax not applicable"
	};

	Adobe.Cart.ShoppingCart.GlobalVars = {
			
		CountryCode: 			"US",

		MarketSegment: 			"COM",

		AkamaiURLPrefix: 		"http://wwwimages.adobe.com/www.adobe.com",

		PriceMonthText:			"per month",

		PriceYearText:			"per year",

		FullSubMonthText:		"Month-to-month",

		FullSubYearText:		"One-year",

		SubMonthText:			"Monthly",

		SubYearText:			"Annual",

		SubscriptionItemText:	"NONE",

		TermTypeMonth:			"MONTH",

		TermTypeYear:			"YEAR",

		BackupDVDParent:		"_PARENT",
		/*
			params: {
				cart,
				price,
				categoryPath,
				originalPrice,
				storeName,
				locale,
				usePrecision,
				type,
				taxCode,
				delimiter,
				showCentDelim,
				distributionMethod
			}
		*/
		getPriceLabel: function(params) {
			var currency = params.cart.currency;
			var params = {
				storeName: params.storeName,
				locale: params.locale,
				productKey: params.categoryPath,
				priceObject: {
					price: {
						orginalPriceWithoutTax: params.originalPrice,
						priceWithoutTax: params.price,
						taxCode: params.taxCode || ""
					},
					priceTypeKey: params.distributionMethod
				},
				currencyObject: {
					delimiter: params.delimiter || ",",
					formatString: currency.FORMATSTRING,
					iso3Code: currency.CODE,
					symbol: currency.SYMBOL,
					usePrecision: params.usePrecision
				},
				showCentDelim : params.showCentDelim || false,
				type: params.type
			};
			return params;
		},

		isSubscription: function(serviceCommitment, termType) {
			return (serviceCommitment == this.SubscriptionItemText && 
					(termType == this.TermTypeMonth || termType == this.TermTypeYear));
		},

		subscriptionItem: function(serviceCommitment, termType) {
			return (termType == this.TermTypeMonth && 
					(serviceCommitment == this.TermTypeMonth || serviceCommitment == this.TermTypeYear));
		},

		getSubscriptionText: function(serviceCommitment, termType) {
			if (this.isSubscription(serviceCommitment, termType)) {
				if (termType === this.TermTypeMonth) {
					return this.SubMonthText;
				} else if (termType === this.TermTypeYear) {
					return this.SubYearText;
				}	
			} else if (this.subscriptionItem(serviceCommitment, termType)) {
				if (serviceCommitment === this.TermTypeMonth) {
					return this.FullSubMonthText;
				} else if (serviceCommitment === this.TermTypeYear) {
					return this.FullSubYearText;
				}	
			}
			return "";
		},

		getSubscriptionPriceText: function(serviceCommitment, termType) {
			if (this.isSubscription(serviceCommitment, termType)) {
				if (termType === this.TermTypeMonth) {
					return this.PriceMonthText;
				} else if (termType === this.TermTypeYear) {
					return this.PriceYearText;
				}	
			} else if (this.subscriptionItem(serviceCommitment, termType)) {
				return this.PriceMonthText;	
			}
			return "";
		}
		
	};
</script>
</div>
<div id="modalContent" style="display:none;"></div>
</div>
<!--googleon: all--></div>
    <div class="Link" id="top">
    <div class="Link LayoutBreakAfter">
        <div class="parbase compbase breadcrumb"><div class="LayoutHeader LayoutBreakAfter Link">
	<div class="LayoutHeaderPath">
		<div class="LayoutCellSides LinkStrong LayoutH IconAlign">
			<span class="LayoutHItem LayoutSmallGutterRight">
						<a href="/devnet.html">
							Adobe Developer Connection</a>
					</span>
					<span class="LayoutSmallGutterRight LayoutHItem">/</span>
				<span class="LayoutHItem LayoutSmallGutterRight">
						<a href="/devnet/flex.html">
							Flex Developer Center</a>
					</span>
					<span class="LayoutSmallGutterRight LayoutHItem">/</span>
				</div>
	</div>
</div>
</div>
<div class="LayoutGrid-1-3 LayoutSlimGrid-1-2">
            <h1 class="LayoutCellSides LayoutSmallRow TextH1">
                Understanding Flex itemEditors – Part 1: Inline itemEditors</h1>
        </div>
    </div>
</div>
<div class="LayoutRow Link RuleH">
    <div class="LayoutBreakAfter">
        <!-- Article Leaf -->
        <div class="ArticleGrid-1 LayoutSlimGrid-1-2 ArticleWideGrid-1 TextSmall">
                <div class="LayoutCellSides LayoutRow">
                    <div class="articleAuthorDisplay authordisplay"><h2 class="TextH5 LayoutRow">
        by&nbsp;<a href="/devnet/author_bios/peter_ent.html">Peter Ent</a></h2>
    <div class="LayoutRow">
        <img title="peter_ent_bio" alt="Peter Ent" class="ImageShadow LayoutImage" src="devnet/authors/bio/p/peter_ent_bio.jpg.adimg.mw.160.png"/></div>
    <div class="LayoutRow">
                 <ul>
            <li><a href="http://www.adobe.com/" title="Adobe" target="_blank">Adobe</a></li>
            </ul>
        </div>
    </div>
</div>
                <div class="LayoutCellSides LayoutRow">
                    <div class="parbase compbase articleTOC singlepagetoc"></div>
</div>
                <div class="LayoutCellSides LayoutRow">
                    <div class="articleTools articletools"><div class="LayoutRow LayoutCellVSides">
                    <h2 class="TextH5 LayoutSmallRow">Created</h2>
                    <p>26 January 2009</p>
                </div>
            <ul class="LayoutRow">
            </ul>
     </div>
</div>
                <div class="LayoutRow">
                    <div class="articleCommentSummary commentsummary"><div class="LayoutRow LayoutCellSides">
    <div id="articleRankAndCommentSummary"></div>
</div>
</div>
</div>
                <div class="LayoutRow">
                    <!-- Page Tools -->
                    <div class="pagetools pageTools"><div class="LayoutBreakAfter">
    <div class="LayoutRow LayoutBreakAfter TextH5">
	<table class="LayoutMaxH">
        <tbody>
            <tr>
                <td class="PanelFillDark">
					<h2 class="TextH5 LayoutCellSides LayoutSmallCellVSides">
                        		Page tools</h2>
					    </td>
                </tr>
        </tbody>
    </table>
</div>
<div class="LayoutCellSides">
            <div class="LayoutRow">
                    <div id="PageTools" style="padding-left:23px;" class=" LayoutBreakAfter LayoutPullout">
	<div class="LayoutSmallRowBottom LayoutBreakAfter">
                                <div style="width:16px;float:left;clear:left;position:relative;left:-23px;margin-right:-23px">
									<a class="Facebook-button Icon IconFacebook" href="http://www.facebook.com/sharer.php"></a>
                                </div>
                                <div style="float:left;width:100%">
                                    <a href="http://www.facebook.com/sharer.php" class="Facebook-button" title="Share on Facebook" target="_blank">Share on Facebook</a></div>
                            </div>
                        <div class="LayoutSmallRowBottom LayoutBreakAfter">
                                <div style="width:16px;float:left;clear:left;position:relative;left:-23px;margin-right:-23px">
									<a class="Twitter-button Icon IconTwitter" href="http://twitter.com/"></a>
                                </div>
                                <div style="float:left;width:100%">
                                    <a href="http://twitter.com/" class="Twitter-button" title="Share on Twitter" target="_blank">Share on Twitter</a></div>
                            </div>
                        <div class="LayoutSmallRowBottom LayoutBreakAfter">
                                <div style="width:16px;float:left;clear:left;position:relative;left:-23px;margin-right:-23px">
									<a class="LinkedIn-button Icon IconLinkedIn" href="http://www.linkedin.com/"></a>
                                </div>
                                <div style="float:left;width:100%">
                                    <a href="http://www.linkedin.com/" class="LinkedIn-button" title="Share on LinkedIn" target="_blank">Share on LinkedIn</a></div>
                            </div>
                        <div class="LayoutSmallRowBottom LayoutBreakAfter">
                                <div style="width:16px;float:left;clear:left;position:relative;left:-23px;margin-right:-23px">
									<a class="Bookmark-button Icon IconBookmark" href="#"></a>
                                </div>
                                <div style="float:left;width:100%">
                                    <a class="Bookmark-button" href="#">Bookmark</a>
                                </div>
                            </div>
                        <div class="LayoutSmallRowBottom LayoutBreakAfter">
                                <div style="width:16px;float:left;clear:left;position:relative;left:-23px;margin-right:-23px">
									<a class="Print-button Icon IconPrint" href="#"></a>
                                </div>
                                <div style="float:left;width:100%">
                                    <a class="Print-button" href="#">Print</a>
                                </div>
                            </div>
                        </div>
</div>
            </div>
            </div>
</div>
</div>
                <div class="LayoutCellSides LayoutRow">
                    <!-- Article Community -->
                    <div class="articletags articleTags"><div class="LayoutRow">
             	<div class="LayoutH LinkWeak TextTag">
                <a href="/devnet/tagsearch.tsb.prod-_sl_flex_v_.tse.html" class="LayoutHItem LayoutHItem PanelFillMedium LayoutSmallGutterRight LayoutSmallRow LayoutSmallCellSides" title="Flex">Flex</a></div>
            </div>
        </div>
</div>
                <div class="LayoutCellSides LayoutRow">
                          <div class="parbase adcFeedBack compbase adcfeedback"><script type="javascript">
                //<![CDATA[
                    s_tagEnv = 'dev';
                //]]>
              </script>
        <script src="http://wwwimages.adobe.com/www.adobe.com/include/script/article-compressed.js"></script>

        <div id="helpful-pod">
            <div id="helpful" class="collapsed">
              <div id="helpfulspan">Was this helpful?</div>
              <input type="radio" name="feedback" id="radioyes" onClick="showForm();"/><span id="yesspan" class="radio-option">Yes</span> &#160;
              <input type="radio" name="feedback" id="radiono" onClick="showForm();"/><span id="nospan" class="radio-option">No</span>
              <textarea title="(Optional) Please let us know how we can improve this page. " id="feedbacktext" placeholder="" rows="5" cols="25" style="font-family:sans-serif;display:none"></textarea>
              <button id="submitButton" onClick="submitForm();" style="display:none">Submit</button>
              <button id="noCommentButton" onClick="hideForm();" style="display:none">No comment</button>
              <br clear="both">
              <div id="termsofuse"><p>By clicking Submit, you accept the <a href="/misc/terms.html">Adobe Terms of Use</a>.</p>
</div>
            </div>
            <div id="fold">&nbsp;</div>
        </div>
        <div id="helpful-thankyou" class="thankyou">Thanks for your feedback.</div>

        <script>
        //<![CDATA[
            // Send CHL-specific data to SiteCatalyst
            var s_chl = s_gi("mxchlprod");
            var urlMatch = /(https?:\/\/)([-\w\.]+)+(:\d+)?(\/([\w\/_\.]*))(index.html)?(\?\S+)?(#\S+)?/;
            var adobeMatch = /(https?:\/\/)([-\w\.]+)+(\.adobe\.com)/;
            var adobeLocaleMatch = /^\/(ae|bg|cz|dk|de|gr|es|ee|fi|fr|il|hr|hu|it|jp|kr|lt|lv|no|nl|pl|br|ro|ru|sk|si|se|tr|ua|cn|tw)\/.+/;
            var cqLocaleMatch = /^\/content\/help\/(ae|bg|cz|dk|de|gr|es|ee|fi|fr|il|hr|hu|it|jp|kr|lt|lv|no|nl|pl|br|ro|ru|sk|si|se|tr|ua|cn|tw)\/.+/;
            var ua = navigator.userAgent.toLowerCase();
            s_chl.channel = "helpx";
            s_chl.eVar3 = window.location.toString().replace(/[\?,#](.*)/, "");
            s_chl.pageName = s_chl.eVar11 = document.title;
            if ( typeof(omtrPageName) != 'undefined' && omtrPageName.length > 0 ) {
                s_chl.pageName = s_chl.eVar11 = omtrPageName;
            }
           // s_chl.list1 = omtrProductList.replace(/,/g,":");
            var omtrLocale = "en";
            if (adobeLocaleMatch.test(location.pathname)) {
                var matchArray = adobeLocaleMatch.exec(location.pathname).slice();
                omtrLocale = matchArray[1];
                if ( typeof(matchArray[1]) != 'undefined') {
                    omtrLocale = matchArray[1];
                }
            }
            else if (cqLocaleMatch.test(location.pathname)) {
                var matchArray = cqLocaleMatch.exec(location.pathname).slice();
                omtrLocale = matchArray[1];
                if ( typeof(matchArray[1]) != 'undefined') {
                    omtrLocale = matchArray[1];
                }
            }

            s_chl.eVar8 = omtrLocale;
            if (omtrLocale != "en") {
                s_chl.eVar9 = document.title;
            }
            // Transmit
            // The s_gs() call in compressed.js causes problems with any .t() call in any report suite
            function s_gs(){}
            s_chl.t();

            function showForm(){
                if (ua.indexOf('msie 6') == -1 ){
                    $('#helpfulspan').hide();
                    $('#radioyes').hide();
                    $('#radiono').hide();
                    $('#yesspan').hide();
                    $('#nospan').hide();
                    $('#feedbacktext').autofill();
                    $('#helpful').animate({width:'420px', height: '185px'});
                    $('#helpful').removeClass('collapsed');
                    $('#helpful').addClass('expanded');
                    $('#fold').css('background-position', '-12px 0');
                    displayTextField();
                }else{
                    submitForm();
                }
            }


            $(document).ready(function() {
                var feedbackLocales = "en, jp, fr, de, it, se, es, nl , dk, br, no, fi";
                if ( feedbackLocales.indexOf( omtrLocale ) > -1 ){
                $('#helpful-pod').fadeIn();
                    $('#helpful-pod').animate({
                    opacity: 1,
                   top: '+=20'},
                    1500);
                }
            });

        // ]]>
        </script>
    </div>
</div>
                <div class="LayoutBreak"></div>
        </div>
        <!-- Main Content -->
        <div class="LayoutSlimGrid-1-2 ArticleGrid-2-4 ArticleWideGrid-2-6">
            <div class="ArticleWideGrid-2-4">
                <div class="articlerequirements articlePrerequistes"><div class="PanelFillMedium PanelBorder LayoutRow TextSmall">
			<div id="requirements-title" class="LayoutCell Link">
				<h2 class="TextH5">
					<span class="LayoutSmallGutterRight Icon IconSmallerAdd"></span>
					Requirements</h2>
			</div>
			<div id="requirements-content" class="LayoutBreakAfter">
				<div class="ArticleGrid-2">
					<div class="LayoutCellSides">
						<h3 class="TextH5 LayoutSmallRowTop">
								Prerequisite knowledge</h3>
							<div class="LayoutRowBottom">
								<p>Prior experience working with Flex Builder to create applications is needed.</p>
</div>
						<h3 class="TextH5 LayoutSmallRowTop">
							User level</h3>
						<p class="LayoutRowBottom">Intermediate</p>
					</div>
				</div>
				<div class="ArticleGrid-3">
						<div class="LayoutCellSides">
							<h3 class="TextH5 LayoutSmallRowTop">
									Required products</h3>
								<ul class="LayoutSmallRowTop LayoutRowBottom">
									<li class="LayoutSmallRow">
												<span class="IconLeft IconSmallDownload"></span>Flex Builder 3<a href="/go/tryflashbuilder/"> (Download trial)</a></li>
										</ul>
							</div>
					</div>
				<div class="ArticleGrid-4">
							<div class="LayoutCellSides">
								<h3 class="TextH5 LayoutSmallRowTop">
									Sample files</h3>
								<ul class="LayoutSmallRowTop LayoutRowBottom">
									<li class="LayoutSmallRow"><a href="/content/dotcom/en/devnet/flex/articles/itemeditors_pt1/_jcr_content/articlePrerequistes/multiplefiles/node_1282807927011/file.res/itemEditors_pt1.mxml"><span class="LayoutSmallGutterRight Icon IconSmallDownload"></span>itemEditors_pt1.mxml</a>
														  (5 KB)</li>
														  <ul class="LayoutGutterLeft"><li class="LayoutGutterLeft">
														  </li></ul>
														</ul>
							</div>
						</div>
					</div>
        </div>
    <script>
    adobe.fn.panelToggle("requirements-title", "requirements-content", true);
</script>
<script>
    adobe.fn.panelToggle("requirements-title", "requirements-content", true);
</script>
</div>
<div class="LayoutGrid-1-4 LayoutSlimGrid-1-2 LayoutBreakAfter">
                    <div class="parsys articlecontentAdobe"><div id="articlecontentAdobe">
<a name="articlecontentAdobe_text" style="visibility:hidden"></a><div class="text parbase section"><div class="Semantic LayoutCellSides LayoutBreakAfter TextMedium TextBreak">
						<p>I recently completed <a href="/devnet/flex/articles/itemrenderers_pt1.html">a series on itemRenderers</a> ― customizations to list controls that format the display of the list contents. Displaying and rendering content is a very effective UI technique and with Flex you can do nearly anything you can imagine.</p>
<p>This is Part 1 of a new series covering itemEditors, which allow data to be changed directly inside of a list control. This first article covers inline itemEditors, which are very simple, though quite useful, components you write directly inside your MXML files. Later articles in the series will cover more complex editing, validation, events, and using itemRenderers as itemEditors.</p>
</div>
				</div>
<a name="articlecontentAdobe_text_0" style="visibility:hidden"></a><div class="text parbase section"><div class="Semantic LayoutCellSides LayoutBreakAfter TextMedium TextBreak">
						<h3>The TextInput editor </h3>
  <p>Editing    directly in list controls is convenient. Imagine a DataGrid of warehouse    inventory where you can adjust the content right in the grid without needing a    special pop-up (see Figure 1). The list controls have a built in editor, a    TextInput control, that appears whenever the user clicks in an editable area,    either a row (for a List), a branch (for a Tree), or a cell (for a DataGrid).    All you need to do is set the list control's <code>editable</code> property to true. For a DataGrid you can exclude a column from being edited by    setting the DataGridColumn's <code>editable</code> property to false.</p>
</div>
				</div>
<a name="articlecontentAdobe_image" style="visibility:hidden"></a><div class="parbase image section"><div class="LayoutRow LayoutCellSides">
	<img title="itemEditors allow editing directly within a DataGrid" alt="itemEditors allow editing directly within a DataGrid" class="cq-dd-image  LayoutImage LayoutRow " src="/content/dotcom/en/devnet/flex/articles/itemeditors_pt1/_jcr_content/articlecontentAdobe/image.adimg.mw.576.jpg/1282808488601.jpg"/></div>
<div class="TextSmall LayoutCellSides LayoutRowTop LayoutBigRowBottom">
        Figure 1. itemEditors allow editing directly within a DataGrid</div>
</div>
<a name="articlecontentAdobe_text_1" style="visibility:hidden"></a><div class="text parbase section"><div class="Semantic LayoutCellSides LayoutBreakAfter TextMedium TextBreak">
						<p>itemEditors differ from itemRenderers in that only one instance of the itemEditor is seen, just on the cell being edited. The itemEditor is not seen until the cell to be edited receives input focus. Then the itemRenderer is hidden and the itemEditor is moved to that position, sized to fit the area, and given the data for the record. When editing is finished (by moving focus to another location), the list control copies the new value from the editor to the dataProvider record.</p>
<p>In the application shown in Figure 1, when the user clicks in a cell of the &quot;Part #&quot; column, the <code>dataProvider[row][dataField]</code> value is given to the <code>text</code> property of the itemEditor (TextInput) control. When editing is finished, the <code>text</code> property value from the itemEditor (TextInput) control is copied to the <code>dataProvider[row][dataField]</code>. The dataProvider, being a collection, dispatches an event in response to the update.</p>
<p>While the default TextInput control makes a fine editor, it really only works for the most simple of cases. It works fine for String values, for example, such as a book title, author name, or product number. If you need more control or want to validate the user's input, then you need to take matters into your own hands.</p>
<h3>Flex Controls as itemEditors</h3>
<p>Here is how you make an itemEditor which only accepts numeric values:</p>
</div>
				</div>
<a name="articlecontentAdobe_codeblock" style="visibility:hidden"></a><div class="parbase codeblock compbase section"><div class="PanelFillLight PanelBevelTop LayoutCell LayoutRow">
        <code class="CodeBlock">&lt;mx:DataGrid x=&#034;46&#034; y=&#034;270&#034; editable=&#034;true&#034; dataProvider=&#034;{employeeDB}&#034;&gt;
     &lt;mx:columns&gt;
          &lt;mx:DataGridColumn headerText=&#034;Name&#034; dataField=&#034;name&#034;/&gt;
          &lt;mx:DataGridColumn headerText=&#034;Position&#034; dataField=&#034;position&#034;/&gt;
          &lt;mx:DataGridColumn headerText=&#034;Age&#034; dataField=&#034;age&#034;&gt;
               &lt;mx:itemEditor&gt;
                    &lt;mx:Component&gt;
                         &lt;mx:TextInput restrict=&#034;0-9&#034; maxChars=&#034;3&#034; /&gt;
                    &lt;/mx:Component&gt;
               &lt;/mx:itemEditor&gt; 
          &lt;/mx:DataGridColumn&gt;
     &lt;/mx:columns&gt;
&lt;/mx:DataGrid&gt;</code>
    </div>
</div>
<a name="articlecontentAdobe_text_2" style="visibility:hidden"></a><div class="text parbase section"><div class="Semantic LayoutCellSides LayoutBreakAfter TextMedium TextBreak">
						<p>The <code>restrict</code> and <code>maxChars</code> properties ensure            that age values are constrained to three-digit numbers.</p>
          <p>The            CheckBox is another common control to use for an itemEditor, because it is            useful for editing Boolean values. Figure 2 shows an example of using the            CheckBox to edit the values for an &quot;In Stock&quot; column of an inventory            program.</p>
</div>
				</div>
<a name="articlecontentAdobe_image_0" style="visibility:hidden"></a><div class="parbase image section"><div class="LayoutRow LayoutCellSides">
	<img title="Using a CheckBox as an itemEditor for a Boolean value" alt="Using a CheckBox as an itemEditor for a Boolean value" class="cq-dd-image  LayoutImage LayoutRow " src="/content/dotcom/en/devnet/flex/articles/itemeditors_pt1/_jcr_content/articlecontentAdobe/image_0.adimg.mw.300.jpg/1282808405522.jpg"/></div>
<div class="TextSmall LayoutCellSides LayoutRowTop LayoutBigRowBottom">
        Figure 2. Using a CheckBox as an itemEditor for a Boolean value</div>
</div>
<a name="articlecontentAdobe_text_3" style="visibility:hidden"></a><div class="text parbase section"><div class="Semantic LayoutCellSides LayoutBreakAfter TextMedium TextBreak">
						<p>Here is the code to make it work:</p>
</div>
				</div>
<a name="articlecontentAdobe_codeblock_0" style="visibility:hidden"></a><div class="parbase codeblock compbase section"><div class="PanelFillLight PanelBevelTop LayoutCell LayoutRow">
        <code class="CodeBlock">&lt;mx:DataGrid x=&#034;531&#034; y=&#034;273&#034; editable=&#034;true&#034; dataProvider=&#034;{inventoryDB}&#034;&gt;
     &lt;mx:columns&gt;
          &lt;mx:DataGridColumn headerText=&#034;Product&#034; dataField=&#034;product&#034;/&gt;
          &lt;mx:DataGridColumn headerText=&#034;Part #&#034; dataField=&#034;part&#034;/&gt;
          &lt;mx:DataGridColumn headerText=&#034;In Stock?&#034; dataField=&#034;inStock&#034;
               labelFunction=&#034;inStockLabeler&#034;
               itemEditor=&#034;mx.controls.CheckBox&#034; editorDataField=&#034;selected&#034; /&gt; 
           &lt;mx:DataGridColumn headerText=&#034;Quantity&#034; dataField=&#034;quantity&#034;/&gt;
     &lt;/mx:columns&gt;
&lt;/mx:DataGrid&gt;</code>
    </div>
</div>
<a name="articlecontentAdobe_text_4" style="visibility:hidden"></a><div class="text parbase section"><div class="Semantic LayoutCellSides LayoutBreakAfter TextMedium TextBreak">
						<p>In this example the content of the cells in this column are rendered using a labelFunction (<code>inStockLabeler</code>), which can display descriptive strings such as &quot;Yes&quot;, &quot;No&quot;, &quot;In Stock&quot;, or &quot;Out of Stock&quot;. The <code>itemEditor</code> property is set to the mx.controls.CheckBox class. And there is another, equally important, property set on the DataGridColumn: <code>editorDataField</code>. This field indicates the property of the itemEditor class to use to fetch the value when editing is finished. In this case it is the CheckBox's <code>selected</code> property. When editing is finished, the DataGrid will use the CheckBox's <code>selected</code> property to replace the <code>inStock</code> property in the data record.</p>
<p>At this point, you may wonder why the example with the TextInput did not supply the <code>editorDataField</code> property. That is because the default value for <code>editorDataField</code> is &quot;text&quot; which just happens to be the name of the property on the TextInput control holding the value.</p>
<p>You can use this same technique with a number of Flex controls. Here is one for an order quantity column using NumericStepper, as shown in Figure 3:</p>
</div>
				</div>
<a name="articlecontentAdobe_codeblock_1" style="visibility:hidden"></a><div class="parbase codeblock compbase section"><div class="PanelFillLight PanelBevelTop LayoutCell LayoutRow">
        <code class="CodeBlock">&lt;mx:DataGrid x=&#034;531&#034; y=&#034;82&#034; editable=&#034;true&#034; dataProvider=&#034;{inventoryDB}&#034;&gt;
     &lt;mx:columns&gt;
          &lt;mx:DataGridColumn headerText=&#034;Product&#034; dataField=&#034;product&#034;/&gt;
          &lt;mx:DataGridColumn headerText=&#034;Part #&#034; dataField=&#034;part&#034;/&gt;
          &lt;mx:DataGridColumn headerText=&#034;In Stock?&#034; dataField=&#034;inStock&#034;/&gt;
          &lt;mx:DataGridColumn headerText=&#034;Quantity&#034; dataField=&#034;quantity&#034;
               itemEditor=&#034;mx.controls.NumericStepper&#034; editorDataField=&#034;value&#034;/&gt;
     &lt;/mx:columns&gt;
&lt;/mx:DataGrid&gt;</code>
    </div>
</div>
<a name="articlecontentAdobe_image_1" style="visibility:hidden"></a><div class="parbase image section"><div class="LayoutRow LayoutCellSides">
	<img title="Using a NumericStepper to edit quantities" alt="Using a NumericStepper to edit quantities" class="cq-dd-image  LayoutImage LayoutRow " src="/content/dotcom/en/devnet/flex/articles/itemeditors_pt1/_jcr_content/articlecontentAdobe/image_1.adimg.mw.300.jpg/1282808605599.jpg"/></div>
<div class="TextSmall LayoutCellSides LayoutRowTop LayoutBigRowBottom">
        Figure 3. Using a NumericStepper to edit quantities</div>
</div>
<a name="articlecontentAdobe_text_5" style="visibility:hidden"></a><div class="text parbase section"><div class="Semantic LayoutCellSides LayoutBreakAfter TextMedium TextBreak">
						<p>Notice            the <code>editorDataField</code> is &quot;value&quot; - the property of the            NumericStepper that holds the current value of the control. Make sure you use            the fully-qualified class name for the itemEditor property or else the compiler            will not be able to find the class and flag the line with an error. </p>
          <h3>A more complex editor </h3>
          <p>Now            suppose you want to do something a little more complex that doesn't have a            ready-made Flex control available. Here is one which allows the user to enter a            credit card number using four separate four-digit fields (see Figure 4):</p>
</div>
				</div>
<a name="articlecontentAdobe_image_2" style="visibility:hidden"></a><div class="parbase image section"><div class="LayoutRow LayoutCellSides">
	<img title="Editing a credit card number in four separate fields" alt="Editing a credit card number in four separate fields" class="cq-dd-image  LayoutImage LayoutRow " src="/content/dotcom/en/devnet/flex/articles/itemeditors_pt1/_jcr_content/articlecontentAdobe/image_2.adimg.mw.300.jpg/1282808937985.jpg"/></div>
<div class="TextSmall LayoutCellSides LayoutRowTop LayoutBigRowBottom">
        Figure 4. Editing a credit card number in four separate fields</div>
</div>
<a name="articlecontentAdobe_text_6" style="visibility:hidden"></a><div class="text parbase section"><div class="Semantic LayoutCellSides LayoutBreakAfter TextMedium TextBreak">
						<p>Here is the code to make it work:</p>
</div>
				</div>
<a name="articlecontentAdobe_codeblock_2" style="visibility:hidden"></a><div class="parbase codeblock compbase section"><div class="PanelFillLight PanelBevelTop LayoutCell LayoutRow">
        <code class="CodeBlock">&lt;mx:DataGrid x=&#034;46&#034; y=&#034;463&#034; editable=&#034;true&#034; dataProvider=&#034;{accountDB}&#034; width=&#034;302&#034;&gt;
     &lt;mx:columns&gt;
          &lt;mx:DataGridColumn headerText=&#034;Account&#034; dataField=&#034;account&#034; width=&#034;100&#034;/&gt;
          &lt;mx:DataGridColumn headerText=&#034;Credit Card&#034; dataField=&#034;ccard&#034; editorDataField=&#034;value&#034;&gt;
               &lt;mx:itemEditor&gt;
                    &lt;mx:Component&gt;
                         &lt;mx:HBox&gt;
                              &lt;mx:Script&gt;
                                   &lt;![CDATA[
                                        public function get value() : String
                                        {
                                             return part1.text+part2.text+part3.text+part4.text;
                                        }
                                        override public function set data(value:Object):void
                                        {
                                             super.data = value;
                                             part1.text = value.ccard.substr(0,4);
                                             part2.text = value.ccard.substr(4,4);
                                             part3.text = value.ccard.substr(8,4);
                                             part4.text = value.ccard.substr(12,4);
                                        }
                                   ]]&gt;
                              &lt;/mx:Script&gt;
                              &lt;mx:TextInput id=&#034;part1&#034; maxChars=&#034;4&#034; restrict=&#034;0-9&#034; width=&#034;40&#034; /&gt;
                              &lt;mx:TextInput id=&#034;part2&#034; maxChars=&#034;4&#034; restrict=&#034;0-9&#034; width=&#034;40&#034; /&gt;
                              &lt;mx:TextInput id=&#034;part3&#034; maxChars=&#034;4&#034; restrict=&#034;0-9&#034; width=&#034;40&#034; /&gt;
                              &lt;mx:TextInput id=&#034;part4&#034; maxChars=&#034;4&#034; restrict=&#034;0-9&#034; width=&#034;40&#034; /&gt;
                         &lt;/mx:HBox&gt;
                    &lt;/mx:Component&gt;
               &lt;/mx:itemEditor&gt;
          &lt;/mx:DataGridColumn&gt;
     &lt;/mx:columns&gt;
&lt;/mx:DataGrid&gt;</code>
    </div>
</div>
<a name="articlecontentAdobe_text_7" style="visibility:hidden"></a><div class="text parbase section"><div class="Semantic LayoutCellSides LayoutBreakAfter TextMedium TextBreak">
						<p>This inline itemEditor follows the same rules as other itemEditors and names the <code>editorDataField</code> as &quot;value&quot;. The component chosen for the itemEditor is the HBox, <b><i>which does not have a &quot;value&quot; property</i></b>. To make this itemEditor work, a getter function named <code>value</code> is created to return the concatenation of the four input fields. Now when the user is finished editing the cell, the DataGrid can call upon the value property of the itemEditor and it will receive the combined fields.</p>
<p>Note the <code>super.data = value</code> in the data setter function. The data property - really the data getter function - is used extensively behind the scenes in the List controls and elsewhere in the framework (not to mention your own code). If you don't set the internal value of data using <code>super.data</code>, then the data getter function will return a null value and, most likely, cause your application to crash.</p>
<p>You can also see that I have overridden the data setter function. In that function I split up the credit card number among the four TextInput fields. This is the technique used to display the data to be edited. The <code>editorDataField</code> is the property used to retrieve the new value.</p>
<h3>Where to go from here</h3>
<p>In this article you've seen how to create an inline itemEditor by simply naming a class and by creating a complex class right within the MXML tags. Naming the property of the editor class that contains the final editor value allows the DataGrid to retrieve the value from the editor instance and replace the current value in the data.</p>
<p><a href="/devnet/flex/articles/itemeditors_pt2.html">Part 2</a> of this series covers more complex itemEditors and editing events.</p>
</div>
				</div>
<a name="articlecontentAdobe_reference" style="visibility:hidden"></a><div class="parbase section reference"><div style="display:inline;" class="cq-dd-paragraph"><div class="text parbase"><div class="Semantic LayoutCellSides LayoutBreakAfter TextMedium TextBreak">
						<p><a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/" target="_blank"><img alt="Creative Commons License" style="border-width: 0pt;" src="http://i.creativecommons.org/l/by-nc-sa/3.0/88x31.png"></a><br>
This work is licensed under a <a href="http://creativecommons.org/licenses/by-nc-sa/3.0/" rel="license" target="_blank">Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License</a></p>
</div>
				</div>
</div>
</div>
</div></div>
<div class="LayoutRow">
                                <div class="articlePaging paging"></div>
</div>
                        </div>
            </div>
            <div class="ArticleWideGrid-5-6 ArticleWideRight">
                <div class="LayoutBreakAfter RuleH ArticleWideRuleHide TextSmall LayoutBreak">
                    <div class="LayoutGrid-1-4 LayoutSlimGrid-1-2 LayoutBreakAfter">
                        <div class="LayoutRow">
                            <div class="parbase compbase inheritedpromo"></div>
</div>
                    </div>
                </div>
                <div class="LayoutBreakAfter TextSmall">
                    <div class="ArticleGrid-2 LayoutSlimGrid-1-2 ArticleWideGridColReset">
                        <div class="parsys inheritedresources inheritedResources"><div class="parsys"><div id="inheritedResources">
<div class="parbase xdheading compbase section"><div pathToMoreText="" class="LayoutRow LayoutBreakAfter TextH5" linkboxcolor="RouterMore">
	<table class="LayoutMaxH">
        <tbody>
            <tr>
                <td class="PanelFillDark">
					<h2 class="TextH5 LayoutCellSides LayoutSmallCellVSides">
                        		Tutorials &amp; Samples</h2>
					    </td>
                </tr>
        </tbody>
    </table>
</div>
</div>
<div class="whatsnew section"><div>
	<div class="LayoutCell">
            <h3 class="HeadingSmaller">
           		Tutorials</h3>
            <ul>
                <li>
                               	<a href="/devnet/flex/articles/flex-mobile-performance-checklist.html" title="Flex mobile performance checklist">Flex mobile performance checklist</a></li>
							<li>
                               	<a href="/devnet/flex/articles/flex-maven-flexmojos-pt3.html" title="Flex and Maven with Flexmojos – Part 3: Journeyman">Flex and Maven with Flexmojos – Part 3: Journeyman</a></li>
							<li>
                               	<a href="/devnet/flex/articles/migrating-flex-apps-part4.html" title="Migrating Flex 3 applications to Flex 4.5 – Part 4">Migrating Flex 3 applications to Flex 4.5 – Part 4</a></li>
							</ul>
            </div>
        </div>
</div>
<div class="whatsnew section"><div>
	<div class="LayoutCell">
            <h3 class="HeadingSmaller">
           		Samples</h3>
            <ul>
                <li>
                               	<a href="/devnet/flex/articles/twitter-trends.html" title="Twitter Trends">Twitter Trends</a></li>
							<li>
                               	<a href="/devnet/flex/samples.html" title="Flex 4.5 reference applications">Flex 4.5 reference applications</a></li>
							<li>
                               	<a href="http://coenraets.org/blog/2011/04/flex-based-ipad-trader-app-now-on-android-market/" title="Mobile Trader Flex app on Android Market">Mobile Trader Flex app on Android Market</a></li>
							</ul>
            </div>
        </div>
</div>
</div></div>
</div>
</div>
                    <div class="ArticleGrid-3 LayoutSlimGrid-1-2 ArticleWideGridColReset">
                        <div class="parsys inheritedresources inheritedResources2"></div>
</div>
                    <div class="ArticleGrid-4 LayoutSlimGrid-1-2 ArticleWideGridColReset">
                        <div class="parsys inheritedResources3 inheritedresources"></div>
</div>
                </div>
            </div>
            <!-- Main Content Comments -->

            <div class="LayoutRow LayoutGridBreak LayoutBreakAfter">
                <div class="parbase compbase jivecomments jiveComments"></div>
</div>

        </div>

    </div>
</div>
<div class="PrintLayoutHide">
        <!--googleoff: all--><script>
	//<![CDATA[
	var hideEvidon = false;

    $(document).ready(function() {
		adobe.fn.initGlobalFooter();
		adobe.fn.evidon('_bapw-link');
		
		adobe.fn.initGeorouting();
	});
    changeRegion = adobe.fn.changeRegionFooter;
    //]]>
</script>

<!--googleoff: index-->
<!-- $Id: //depot/projects/dylan/releases/rc_13_11/ubi/footer/en_us/globalfooter_ssi.html#1 $ -->
<div id="SiteFooter" class="SiteFooter Text TextSmall TextInvert Link LayoutBreak">
	<span id="Georouting"></span>
    <div class="LayoutBreakAfter">
        <div class="LayoutGrid-1 LayoutSlimGrid-1 LinkInvert">
        	<div class="LayoutCellSides LayoutCellTop">
                <h4><a href="/products/catalog.html?promoid=JOPBT">Products</a></h4>
                <ul class="SiteFooterLinkList">
                    <li><a class="icon Icon SiteFooterMenuItemIconProducts SiteFooterMenuItemIconCloud" href="/products/creativecloud.html?promoid=JQPER">Adobe Creative Cloud</a></li>
                    <li><a class="icon Icon SiteFooterMenuItemIconProducts SiteFooterMenuItemIconCS" href="/products/cs6.html?promoid=KFHNH">Creative Suite 6</a></li>
                    <li><a class="icon Icon SiteFooterMenuItemIconProducts SiteFooterMenuItemIconOMS" href="/solutions/digital-marketing.html?promoid=JOPBY">Adobe Marketing Cloud</a></li>
                    <li><a class="icon Icon SiteFooterMenuItemIconProducts SiteFooterMenuItemIconAcrobat" href="/products/acrobat.html?promoid=JOPBV">Acrobat</a></li>
                    <li><a class="icon Icon SiteFooterMenuItemIconProducts SiteFooterMenuItemIconPS" href="/products/photoshop.html?promoid=JOPCB">Photoshop</a></li>
                    <li><a class="icon Icon SiteFooterMenuItemIconProducts SiteFooterMenuItemIconDPS" href="/products/digital-publishing-suite-family.html?promoid=JOPBZ">Digital Publishing Suite</a></li>
                    <li><a class="icon Icon SiteFooterMenuItemIconProducts SiteFooterMenuItemIconElements" href="/products/elements-family.html?promoid=JOPBX">Elements family</a></li>
                    <li><a class="icon Icon SiteFooterMenuItemIconProducts SiteFooterMenuItemIconSC" href="/products/sitecatalyst.html?promoid=KFGCH">SiteCatalyst</a></li>
                    <li><a class="icon Icon SiteFooterMenuItemIconProducts" href="/education.html?marketSegment=EDU&promoid=JUTMH">For education</a></li>
                </ul>
            </div>
        </div>
        <div class="LayoutGrid-2 LayoutSlimGrid-2 LinkInvert">
        	<div class="LayoutCellSides LayoutCellTop">
                <h4><a href="/downloads/?promoid=JOPDB">Download</a></h4>
                <ul class="SiteFooterLinkList SiteFooterLinkListBottom">
                    <li><a href="/downloads/?promoid=KEWBH">Product trials</a></li>
                    <li><a href="/go/gffooter_adobe_reader">Adobe Reader</a></li>
                    <li><a href="http://get2.adobe.com/flashplayer/?promoid=KFHNI">Adobe Flash Player</a></li>
                    <li><a href="/go/gffooter_adobe_air">Adobe AIR</a></li>
                </ul>
            </div>
        </div>
        <div class="LayoutGrid-3 LayoutSlimGrid-1 LinkInvert">
        	<div class="LayoutCellSides LayoutCellTop">
                <h4><a href="/go/gffooter_help">Support &amp; Learning</a></h4>
                <ul class="SiteFooterLinkList">
                    <li><a href="http://helpx.adobe.com/support.html?promoid=KFKQG">Product help</a></li>
                    <li><a href="http://forums.adobe.com/index.jspa?promoid=JOPCT" target="_blank">Forums</a></li>
                </ul>
            </div>
        </div>
        <div class="LayoutGrid-4 LayoutSlimGrid-2 LinkInvert">
        	<div class="LayoutCellSides LayoutCellTop">
                <h4><a href="/buy.html?promoid=JOPCV">Buy</a></h4>
                <ul class="SiteFooterLinkList">
                    <li><a href="/go/gffooter_homeuse">For personal and professional use</a></li>
                    <li><a href="/go/gffooter_students_store">For students, educators, and staff</a></li>
                    <li><a href="/products/small-business-pricing/software-catalog._sl_id-contentfilter_sl_catalog_sl_software_sl_creativecloudmembership.html?marketSegment=COM&promoid=JOPCY">For small and medium businesses</a></li>
                    <li><a href="/go/gffooter_licensingprograms">Volume Licensing</a></li>
                    <li><a href="/go/gffooter_special_offers">Special offers</a></li>
                </ul>
            </div>
        </div>
        <div class="LayoutGrid-5 LayoutSlimGrid-1-2 LinkInvert">
        	<div class="LayoutCellSides LayoutCellTop">
                <h4><a href="/company.html?promoid=JOPDG">Company</a></h4>
                <ul class="SiteFooterLinkList">
                    <li><a href="/go/gffooter_news_room">News room</a></li>
                    <li><a href="/go/gffooter_partner_programs">Partner programs</a></li>
                    <li><a href="/go/gffooter_corporate_social_responsibility">Corporate responsibility</a></li>
                    <li><a href="/go/gffooter_career_opportunities">Career opportunities</a></li>
                    <li><a href="/go/gffooter_investor_relation">Investor Relations</a></li>
                    <li><a href="/go/gffooter_events">Events</a></li>
                    <li><a href="/go/gffooter_legal">Legal</a></li>
                    <li><a href="/go/gffooter_security">Security</a></li>
                    <li><a href="/company/contact.html?promoid=JOPDO">Contact Adobe</a></li>
                </ul>
            </div>
        </div>
        
		<div class="LayoutGridBreak">
        	<div class="LayoutCellSides LayoutCellBottom">
                <div class="SiteFooterRegionSelector TextInvert LinkInvert LinkStrong">
                    <a href="/go/gffooter_choose_region" id="sfRegion" class="SiteFooterMenuItemIcon SiteFooterMenuItemIconRegionBlue">Choose your region</a>
                    <span id="sfRegionSet" class="SiteFooterMenuItemIcon SiteFooterMenuItemIconRegionBlack" style="display: none;">United States <a href="/go/gffooter_choose_region" id="sfRegionChange">(Change)</a></span>
                </div>
                <div class="SiteFooterRegionPanel SiteFooterRegionPanelEvidon" id="RegionPanel" style="display: none;">
                    <div class="SiteFooterRegionPanelHeader">
                        <span class="SiteFooterMenuItemIcon SiteFooterMenuItemIconRegionBlack">Choose your region</span>
                        <a id="sfRegionClose" class="SiteFooterRegionPanelHeaderClose">Close</a>
                    </div>
                    <div class="Column">
                        <div class="Column-1">
                            <p class="SiteFooterRegionPanelRegionHeader">North America</p>
                        </div>
                        <div class="Column-2-3">
                            <p class="SiteFooterRegionPanelRegionHeader">Europe, Middle East and Africa</p>
                        </div>
                        <div class="Column-4">
                            <p class="SiteFooterRegionPanelRegionHeader">Asia Pacific</p>
                        </div>
                        <div class="Column-1">
                            <ul>
                                <li lang="en"><a onClick="changeRegion('ca');">Canada - English</a></li>
                                <li lang="fr"><a onClick="changeRegion('ca_fr');">Canada - Fran&ccedil;ais</a></li>
                                <li lang="es"><a onClick="changeRegion('la');">Latinoam&eacute;rica</a></li>
                                <li lang="es"><a onClick="changeRegion('mx');">M&eacute;xico</a></li>
                                <li lang="en"><a onClick="changeRegion('us');">United States</a></li>
                            </ul>
            
                            <p class="SiteFooterRegionPanelRegionHeader">South America</p>
                            <ul>
                                <li lang="pt"><a onClick="changeRegion('br');">Brasil</a></li>
                            </ul>
                        </div>
                        <div class="Column-2">
                            <ul>
                                <li lang="en"><a onClick="changeRegion('africa');">Africa - English</a></li>
                                <li lang="de"><a onClick="changeRegion('at');">&Ouml;sterreich - Deutsch</a></li>
                                <li lang="en"><a onClick="changeRegion('be_en');">Belgium - English</a></li>
                                <li lang="fr"><a onClick="changeRegion('be_fr');">Belgique - Fran&ccedil;ais</a></li>
                                <li lang="nl"><a onClick="changeRegion('be_nl');">Belgi&euml; - Nederlands</a></li>
                                <li lang="bg"><a onClick="changeRegion('bg');">България</a></li>
                                <li lang="hr"><a onClick="changeRegion('hr');">Hrvatska</a></li>
                                <li lang="en"><a onClick="changeRegion('eeurope');">Cyprus - English</a></li>                                
                                <li lang="cs"><a onClick="changeRegion('cz');">Česk&aacute; republika</a></li>
                                <li lang="da"><a onClick="changeRegion('dk');">Danmark</a></li>
                                <li lang="en"><a onClick="changeRegion('eeurope');">Eastern Europe - English</a></li>
                                <li lang="et"><a onClick="changeRegion('ee');">Eesti</a></li>
                                <li lang="fi"><a onClick="changeRegion('fi');">Suomi</a></li>
                                <li lang="fr"><a onClick="changeRegion('fr');">France</a></li>
                                <li lang="de"><a onClick="changeRegion('de');">Deutschland</a></li>
                                <li lang="en"><a onClick="changeRegion('eeurope');">Greece - English</a></li>
                                <li lang="hu"><a onClick="changeRegion('hu');">Magyarorsz&aacute;g</a></li>
                                <li lang="en"><a onClick="changeRegion('ie');">Ireland</a></li>
                                <li lang="en"><a onClick="changeRegion('il_en');">Israel - English</a></li>
                                <li lang="he"><a onClick="changeRegion('il_he');">&#1497;&#1513;&#1512;&#1488;&#1500; - &#1506;&#1489;&#1512;&#1497;&#1514;</a></li>
                                <li lang="it"><a onClick="changeRegion('it');">Italia</a></li>
                                <li lang="lv"><a onClick="changeRegion('lv');">Latvija</a></li>
                                <li lang="lt"><a onClick="changeRegion('lt');">Lietuva</a></li>
                                <li lang="de"><a onClick="changeRegion('lu_de');">Luxembourg - Deutsch</a></li>
                                <li lang="en"><a onClick="changeRegion('lu_en');">Luxembourg - English</a></li>
                                <li lang="fr"><a onClick="changeRegion('lu_fr');">Luxembourg - Fran&ccedil;ais</a></li>
                            </ul>
                        </div>
                        <div class="Column-3">
                            <ul>
                                <li lang="en"><a onClick="changeRegion('eeurope');">Malta - English</a></li>
								<li lang="ar"><a onClick="changeRegion('mena_ar');">&#1575;&#1604;&#1588;&#1585;&#1602; &#1575;&#1604;&#1571;&#1608;&#1587;&#1591; &#1608;&#1588;&#1605;&#1575;&#1604; &#1571;&#1601;&#1585;&#1610;&#1602;&#1610;&#1575; - &#1575;&#1604;&#1604;&#1594;&#1577; &#1575;&#1604;&#1593;&#1585;&#1576;&#1610;&#1577;</a></li>                                <li lang="en"><a onClick="changeRegion('mena_en');">Middle East and North Africa - English</a></li>
                                <li lang="fr"><a onClick="changeRegion('mena_fr');">Moyen-Orient et Afrique du Nord - Fran&ccedil;ais</a></li>
                                <li lang="nl"><a onClick="changeRegion('nl');">Nederland</a></li>
                                <li lang="no"><a onClick="changeRegion('no');">Norge</a></li>
                                <li lang="pl"><a onClick="changeRegion('pl');">Polska</a></li>
                                <li lang="pt"><a onClick="changeRegion('pt');">Portugal</a></li>
                                <li lang="ro"><a onClick="changeRegion('ro');">Rom&acirc;nia</a></li>
                                <li lang="ru"><a onClick="changeRegion('ru');">Россия</a></li>
                                <li lang="sr"><a onClick="changeRegion('rs');">Srbija</a></li>
                                <li lang="sk"><a onClick="changeRegion('sk');">Slovensko</a></li>
                                <li lang="sl"><a onClick="changeRegion('si');">Slovenija</a></li>
                                <li lang="es"><a onClick="changeRegion('es');">Espa&ntilde;a</a></li>
                                <li lang="sv"><a onClick="changeRegion('se');">Sverige</a></li>
                                <li lang="de"><a onClick="changeRegion('ch_de');">Schweiz - Deutsch</a></li>
                                <li lang="fr"><a onClick="changeRegion('ch_fr');">Suisse - Fran&ccedil;ais</a></li>
                                <li lang="it"><a onClick="changeRegion('ch_it');">Svizzera - Italiano</a></li>
                                <li lang="tr"><a onClick="changeRegion('tr');">T&uuml;rkiye</a></li>
                                <li lang="uk"><a onClick="changeRegion('ua');">Україна</a></li>
                                <li lang="en"><a onClick="changeRegion('uk');">United Kingdom</a></li>
                            </ul>
                        </div>
                        <div class="Column-4">
                            <ul>
                                <li lang="en"><a onClick="changeRegion('au');">Australia</a></li>
                                <li lang="zh"><a onClick="changeRegion('cn');">中国</a></li>
                                <li lang="zh"><a onClick="changeRegion('hk_zh');">中國香港特別行政區</a></li>
                                <li lang="en"><a onClick="changeRegion('hk_en');">Hong Kong S.A.R. of China</a></li>
                                <li lang="en"><a onClick="changeRegion('in');">India - English</a></li>
                                <li lang="ja"><a onClick="changeRegion('jp');">日本</a></li>
                                <li lang="ko"><a onClick="changeRegion('kr');">한국</a></li>
                                <li lang="en"><a onClick="changeRegion('nz');">New Zealand</a></li>
                                <li lang="zh"><a onClick="changeRegion('tw');">台灣</a></li>
                            </ul>
            
                            <p class="SiteFooterRegionPanelRegionHeader">Southeast Asia</p>
                            <ul>
                                <li lang="en"><a onClick="changeRegion('sea');">Includes Indonesia, Malaysia, Philippines, Singapore, Thailand, and Vietnam - English</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>

		<div class="LayoutGridBreak">
        	<div class="LayoutCellSides">
                <hr />
            </div>
        </div>
    
        <div class="LayoutGrid-1-5 LayoutSlimGrid-1-2 LinkInvert LinkStrong">
        	<div class="LayoutCellSides LayoutCellBottom LinkInvert">
                <p class="SiteFooterRow TextSmall">Copyright &copy; 2013 Adobe Systems Incorporated.  All rights reserved.</p>
                <p class="SiteFooterRow TextSmall"><a href="/go/gffooter_terms_of_use">Terms of Use</a> | <a href="/privacy.html">Privacy</a> | <a href="/privacy/cookies.html">Cookies</a></p>
                <p class="SiteFooterRow SiteFooterRowTop"><a href="#" id="_bapw-link" class="TextSmall icon Icon SiteFooterMenuItemIconEvidon" style="display:none;">Ad Choices</a></p>
            </div>
        </div>
    </div>
</div>
<!--googleon: index--><!--googleon: all--></div>
    <div class="parsys templatembox bottomofbodymbox"><div class="mboxDefault">
                    </div>
                <script>
                            mboxCreate('defaultmboxname');
                    </script>
                </div>
<div class="parsys doubleclickfloodlight"><!-- Fetch either EDU or COM snippet based on the Mode selection-->
</div>
    <!-- Invoking faas form engine tracking Script !! --->
    </div>
</body>
</html>