Finish implementation of controlled setting indicator

chrome/browser/resources/options/chromeos/internet_detail.html

 <div id="details-internet-page" class="page" hidden>
   <div class="close-button"></div>
   <!-- Network header -->
   <div id="network-details-header">
     <div id="network-details-title"></div>
     <div id="network-details-subtitle">
       <span id="network-details-subtitle-status"></span>
       <span id="network-details-subtitle-separator"> - </span>
       <span id="network-details-subtitle-type"></span>
     </div>
@@ skipping 54 matching lines @@
     <div id="wifi-network-tab" class="subpages-tab-contents wifi-details">
       <section>
         <table class="option-control-table">
           <tr id="prefer-network">
             <td>
               <div class="checkbox">
                 <label>
                   <input id="prefer-network-wifi" type="checkbox">
                   <span i18n-content="inetPreferredNetwork"></span>
                 </label>
-                <span class="controlled-setting-indicator" data="preferred"
-                    for="prefer-network-wifi"></span>
+                <span class="controlled-setting-indicator" type="checkbox"
+                    data="preferred" for="prefer-network-wifi"></span>
               </div>
             </td>
           </tr>
           <tr class="auto-connect-network">
             <td>
               <div class="checkbox">
                 <label>
                   <input id="auto-connect-network-wifi" type="checkbox">
                   <span i18n-content="inetAutoConnectNetwork"></span>
                 </label>
-                <span class="controlled-setting-indicator" data="autoConnect"
-                    for="auto-connect-network-wifi"></span>
+                <span class="controlled-setting-indicator" type="checkbox"
+                    data="autoConnect" for="auto-connect-network-wifi"></span>
               </div>
             </td>
           </tr>
         </table>
       </section>
       <section>
         <table id="wifi-settings-table">
           <tr>
             <td class="option-name" i18n-content="connectionState"></td>
             <td id="wifi-connection-state" class="option-value"></td>
@@ skipping 57 matching lines @@
     <div id="wimax-network-tab" class="subpages-tab-contents wimax-details">
       <section>
         <table class="option-control-table">
           <tr class="auto-connect-network">
             <td>
               <div class="checkbox">
                 <label>
                   <input id="auto-connect-network-wimax" type="checkbox">
                   <span i18n-content="inetAutoConnectNetwork"></span>
                 </label>
-                <span class="controlled-setting-indicator" data="autoConnect"
-                    for="auto-connect-network-wimax"></span>
+                <span class="controlled-setting-indicator" type="checkbox"
+                    data="autoConnect" for="auto-connect-network-wimax"></span>
               </div>
             </td>
           </tr>
         </table>
       </section>
       <section>
         <table id="wimax-settings-table">
           <tr>
             <td class="option-name" i18n-content="connectionState"></td>
             <td id="wimax-connection-state" class="option-value"></td>
@@ skipping 22 matching lines @@
       <section>
         <table class="option-control-table">
           <tr>
             <td class="option-name" i18n-content="inetServiceName"></td>
             <td id="inet-service-name" class="option-value"></td>
           </tr>
           <tr>
             <td class="option-name" i18n-content="inetServerHostname"></td>
             <td>
               <input class="option-value" id="inet-server-hostname"></input>
-              <span class="controlled-setting-indicator"
+              <span class="controlled-setting-indicator" type="text"
                   data="serverHostname" for="inet-server-hostname"></span>
             </td>
           </tr>
           <tr>
             <td class="option-name" i18n-content="inetProviderType"></td>
             <td id="inet-provider-type" class="option-value"></td>
           </tr>
           <tr>
             <td class="option-name" i18n-content="inetUsername"></td>
             <td id="inet-username" class="option-value"></td>
@@ skipping 41 matching lines @@
             <td class="option-name" i18n-content="errorState"></td>
             <td id="error-state" class="option-value"></td>
           </tr>
           <tr class="gsm-only apn-list-view">
             <td class="option-name" i18n-content="cellularApnLabel"></td>
             <td id="cellular-apn-label" class="option-value">
               <select id="select-apn">
                 <option value="-1" i18n-content="cellularApnOther">
                 </option>
               </select>
-              <span class="controlled-setting-indicator" data="providerApnList"
-                  for="select-apn"></span>
+              <span class="controlled-setting-indicator" type="select"
+                  data="providerApnList" for="select-apn"></span>
             </td>
           </tr>
           <tr class="gsm-only apn-details-view">
             <td class="option-name" i18n-content="cellularApnLabel"></td>
             <td id="cellular-apn-label" class="option-value">
               <input id="cellular-apn" type="text">
             </td>
           </tr>
           <tr class="gsm-only apn-details-view">
             <td class="option-name" i18n-content="cellularApnUsername"></td>
@@ skipping 18 matching lines @@
                   i18n-content="cellularApnCancel"></button>
             </td>
           </tr>
           <tr>
             <td colspan="2">
               <div class="checkbox">
                 <label>
                   <input id="auto-connect-network-cellular" type="checkbox">
                   <span i18n-content="inetAutoConnectNetwork"></span>
                 </label>
-                <span class="controlled-setting-indicator" data="autoConnect"
-                    for="auto-connect-network-cellular"></span>
+                <span class="controlled-setting-indicator" type="checkbox"
+                    data="autoConnect" for="auto-connect-network-cellular"></span>
               </div>
             </td>
           </tr>
         </table>
       </section>
     </div>
     <div id="cellular-device-tab" class="subpages-tab-contents
         cellular-details">
       <section id="cellular-device-options">
         <table class="option-control-table">
@@ skipping 57 matching lines @@
           </tr>
         </table>
       </section>
       <section id="ipconfig-section">
         <div id="ip-automatic-configuration" class="checkbox">
           <label>
             <input id="ip-automatic-configuration-checkbox"
                 type="checkbox">
             <span i18n-content="ipAutomaticConfiguration"></span>
           </label>
-          <span class="controlled-setting-indicator" data="ipconfigDHCP"
-              for="ip-automatic-configuration"></span>
+          <span class="controlled-setting-indicator" type="checkbox"
+              data="ipconfigDHCP" for="ip-automatic-configuration"></span>
         </div>
         <div>
         <table id="ip-address-settings">
           <tr>
             <td class="spacer" width="14px"></td>
             <td class="option-name" i18n-content="inetAddress"></td>
             <td><div id="ip-address"></div></td>
           </tr>
           <tr>
             <td class="spacer" width="14px"></td>
@@ skipping 64 matching lines @@
     </div>
     <div id="security-tab"
          class="subpages-tab-contents cellular-details gsm-only">
       <div id="cellular-security-options">
         <section>
           <div id="sim-pin-lock" class="checkbox">
             <label>
               <input id="sim-card-lock-enabled" type="checkbox">
               <span i18n-content="lockSimCard"></span>
             </label>
-            <span class="controlled-setting-indicator" data="simCardLockEnabled"
-                for="sim-card-lock-enabled"></span>
+            <span class="controlled-setting-indicator" type="checkbox"
+                data="simCardLockEnabled" for="sim-card-lock-enabled"></span>
           </div>
         </section>
         <section>
           <div id="change-pin-area">
             <button id="change-pin" i18n-content="changePinButton"></button>
-            <span class="controlled-setting-indicator" data="simCardLockEnabled"
-                for="change-pin"></span>
+            <span class="controlled-setting-indicator" type="button"
+                data="simCardLockEnabled" for="change-pin"></span>
           </div>
         </section>
       </div>
     </div>
     <div id="network-proxy-tab" class="subpages-tab-contents">
       <section>
         <div id="info-banner" hidden>
           <span id="banner-icon" class="page-banner-icon"></span>
           <span id="banner-text" class="page-banner-text"></span>
         </div>
@@ skipping 139 matching lines @@
       </button>
       <button id="details-internet-disconnect" i18n-content="disconnectButton">
       </button>
       <button id="activate-details" i18n-content="activateButton"></button>
       <button id="buyplan-details" i18n-content="buyplanButton"></button>
       <button id="view-account-details" i18n-content="viewAccountButton">
       </button>
     </div>
   </div>
 </div>