Help with popup for mobile

[MakikoShukunobe]

I am new to ArcGIS APIs, and I would greatly appreciate if you could help me with a popup issue for a mobile application.
I am using the 'Attribute editing - mobile' sample code to create an editable application, and the editing function itself is working perfectly. However, I am having difficulty displaying a popup for the editable layer.

The problem occurs at: 'map.infoWindow.setFeatures([evt.grahic]);' and shows the error: 'TypeError: _31[ptr] is undefined' (Firebug) and SCRIPT5007: Unable to get value of the property 'getTitle': object is null or undefined PopupMobile.js, line 19 character 1011(IE9).

When I replace the code 'map.infoWindow.setFeatures([evt.grahic]);' with map.infoWindow.show(evt.mapPoint);, the popup is enabled. However, the popup only shows the title without the (>)-Button to show all attributes (the editable layer has a relationship class for attachments, and I would like to include the attachment to show in the popup as well).
[ATTACH=CONFIG]18868[/ATTACH]

Any assistance you can provide in helping me to solve the problem would be very much appreciated.

Please find the relevant code below (I extract just only for required code for popup from 'Attribute editing - mobile' sample code).

<script type="text/javascript">
        //initialize dojo
        dojo.require("esri.map");
        dojo.require("esri.dijit.AttributeInspector-all");
        dojo.require("esri.tasks.locator");
        dojo.require("dijit.form.ComboBox");
        dojo.require("esri.dijit.PopupMobile");

        dojo.addOnLoad(init);

        var map;
        var locator;
        var dataCollection;

        function init() {

            var initExtent = new esri.geometry.Extent({
                "xmin": -8765800,
                "ymin": 4266710,
                "xmax": -8753600,
                "ymax": 4273680,
                "spatialReference": {
                    "wkid": 102100
                }
            });
            var popup = new esri.dijit.PopupMobile(null, dojo.create("div"));

            map = new esri.Map("map", {
                extent: initExtent,
                infoWindow: popup
            });

            dojo.connect(map, "onLoad", function () {
                resizeMap();
                //hookup jquery
                $(document).ready(jQueryReady);
            });


            //add the world streetmap from arcgis online
            var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer");
            map.addLayer(basemap);

            var template = new esri.InfoTemplate();
            template.setTitle("<b>Environment ${objectid}</b>");
            template.setContent("<b>Environment Type: </b>${environment}");


            //add editable feature layer
            dataCollection = new esri.layers.FeatureLayer(
   "http://ArcGIS/rest/services/FeatureServer/0", {
       mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
       infoTemplate: template,
       outFields: ["*"]
   });


   dojo.connect(dataCollection, "onClick", function (evt) {
       map.infoWindow.setFeatures([evt.grahic]);
       //map.infoWindow.show(evt.mapPoint);
   });

            map.addLayers([dataCollection]); 

            map.infoWindow.resize(185, 100);


        } //end init()

             

        function jQueryReady() {
            $('#mapPage').bind('pageshow', function (event, ui) {
                resizeMap();
            });
        }

        
        function resizeMap() {
            if (map) {
                $('#map').css("height", screen.height);
                $('#map').css("width", "auto");

                map.reposition();
                map.resize();
            }
        }
   
      
 </script>