none
input type checkbox inside the infobox problem RRS feed

  • Question

  • Hi,

    My map contains multiple pins and associated infoboxes along with it. I have 3 checkboxes inside of the infobox, set via <input /> tags.  The issue that I am running into is that when I open an infobox and check a checkbox and then remove the checkbox, and try to close the infobox, the checkbox will automatically get checked!  Is there some behavior of the <input /> tag or microsoft infobox causing this?

    var html = '<div id="' + callBackData[i]._propertyID + '" style="background-color:White;float:left;left:0px;width:199px"><font size="0.5">Show&nbsp;\
    		<INPUT ID="' + callBackData[i]._propertyID + 'fiveMile" TYPE="checkbox" NAME="radius5" VALUE="5" onclick="createCircle(' + callBackData[i]._propertyID + ', 5)" />5&nbsp;\
                    <INPUT ID="' + callBackData[i]._propertyID + 'tenMile" TYPE="checkbox" NAME="radius10" VALUE="10" onclick="createCircle(' + callBackData[i]._propertyID + ', 10)" />10&nbsp;\
                    <INPUT ID="' + callBackData[i]._propertyID + 'fifteenMile" TYPE="checkbox" NAME="radius15" VALUE="15" onclick="createCircle(' + callBackData[i]._propertyID + ', 15)" />15&nbsp;mile radius\
                </font></div><div id="' + callBackData[i]._propertyID + 'comp" style="float:left;left:200px;padding-top:3px;width:50px" onclick="selectAllPropsInRadius(' + callBackData[i]._propertyID + ', ' + callBackData[i]._pinInfo.pinLatitude + ', ' + callBackData[i]._pinInfo.pinLongitude + ')"><font color="blue" size="0.5"><u>Select All</u></font></div>';
    
    var pinInfoboxTitle = '<b>' + callBackData[i]._propertyName.toString() + '</b>';
    var pinInfoboxDesc = '<font size="0.5">' + callBackData[i]._stakeholders.toString() + '<br />' + callBackData[i]._propertySpaceCount.toString() + ' (' + callBackData[i]._segmentsTypes.toString() + ') <br /></font>' + html;
    var pinInfoBox  = new Microsoft.Maps.Infobox(new Microsoft.Maps.Location(callBackData[i]._pinInfo.pinLatitude, callBackData[i]._pinInfo.pinLongitude)
    	, { width: 280, height: 150, title: pinInfoboxTitle, description: pinInfoboxDesc, visible: false, zIndex: 200, id: callBackData[i]._propertyID
            });
    
    The code above shows, that each checkbox has an onclick function assigned to it. The checkboxes are inside a <div > tag and I have made sure that the ID's are different.

    Thanks

    • Moved by Ricky_Brundritt Friday, June 15, 2012 8:33 AM Belongs to AJAX control (From:Bing Maps General)
    Tuesday, May 29, 2012 8:19 PM

Answers

  • This is a bit hard to debug. I'd suggest using the developer tools in the browser to inspect the generated infobox. Also note that there is an actions option for infoboxes which allows you to assign click events to items in your infobox. This option may help get rid of the issue you are seeing.

    http://rbrundritt.wordpress.com

    Monday, June 25, 2012 12:13 PM