Used dashed-form for autofill overlay ids

BUG=none
TEST=none

Review URL: http://codereview.chromium.org/6552002

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@75724 0039d316-1c4b-4281-b951-d872f2087c98

3 files changed, 53 insertions, 52 deletions

diff --git a/chrome/browser/resources/options/autofill_edit_address_overlay.css b/chrome/browser/resources/options/autofill_edit_address_overlay.css
index 6931c1b..2a8142e 100644
--- a/chrome/browser/resources/options/autofill_edit_address_overlay.css
+++ b/chrome/browser/resources/options/autofill_edit_address_overlay.css
@@ -1,4 +1,4 @@
-#autoFillEditAddressOverlay {
+#autofill-edit-address-overlay {
   width: 500px;
 }
 
diff --git a/chrome/browser/resources/options/autofill_edit_address_overlay.html b/chrome/browser/resources/options/autofill_edit_address_overlay.html
index ba66968..0f4d3f2 100644
--- a/chrome/browser/resources/options/autofill_edit_address_overlay.html
+++ b/chrome/browser/resources/options/autofill_edit_address_overlay.html
@@ -1,44 +1,44 @@
-<div class="page hidden" id="autoFillEditAddressOverlay">
-  <h1 id="autoFillAddressTitle"></h1>
+<div class="page hidden" id="autofill-edit-address-overlay">
+  <h1 id="autofill-address-title"></h1>
   <div class="content-area">
     <div class="input">
-      <label id="fullNameLabel">
+      <label>
         <div><span i18n-content="fullNameLabel"></span></div>
-        <input type="text" class="form" class="form" id="fullName">
+        <input type="text" class="form" id="full-name">
       </label>
     </div>
     <div class="input">
-      <label id="companyNameLabel">
+      <label>
         <div><span i18n-content="companyNameLabel"></span></div>
-        <input type="text" class="form" class="form" id="companyName">
+        <input type="text" class="form" id="company-name">
       </label>
     </div>
     <div class="input">
-      <label id="addrLine1Label">
+      <label>
         <div><span i18n-content="addrLine1Label"></span></div>
-        <input type="text" class="form" class="form" id="addrLine1">
+        <input type="text" class="form" id="addr-line-1">
       </label>
     </div>
     <div class="input">
-      <label id="addrLine2Label">
+      <label>
         <div><span i18n-content="addrLine2Label"></span></div>
-        <input type="text" class="form" class="form" id="addrLine2">
+        <input type="text" class="form" id="addr-line-2">
       </label>
     </div>
     <div class="table">
       <div class="row">
         <div class="input cell">
-          <label id="cityLabel" for="city">
+          <label for="city">
             <span i18n-content="cityLabel"></span>
           </label>
         </div>
         <div class="input cell">
-          <label id="stateLabel" for="state">
+          <label for="state">
             <span i18n-content="stateLabel"></span>
           </label>
         </div>
         <div class="input cell">
-          <label id="zipCodeLabel" for="zipCode">
+          <label for="zip-code">
             <span i18n-content="zipCodeLabel"></span>
           </label>
         </div>
@@ -51,50 +51,50 @@
           <input type="text" class="form" id="state">
         </div>
         <div class="input cell">
-          <input type="text" class="form" id="zipCode">
+          <input type="text" class="form" id="zip-code">
         </div>
       </div>
     </div>
     <div class="input">
-      <label id="countryLabel">
+      <label>
         <div><span i18n-content="countryLabel"></span></div>
-        <input type="text" class="form" class="form" id="country">
+        <input type="text" class="form" id="country">
       </label>
     </div>
     <div class="table">
       <div class="row">
         <div class="input cell">
-          <label id="phoneLabel" for="phone">
+          <label for="phone">
             <span i18n-content="phoneLabel"></span>
           </label>
         </div>
         <div class="input cell">
-          <label id="faxLabel" for="fax">
+          <label for="fax">
             <span i18n-content="faxLabel"></span>
           </label>
         </div>
       </div>
       <div class="row">
         <div class="input cell">
-          <input type="text" class="form" class="form" id="phone">
+          <input type="text" class="form" id="phone">
         </div>
         <div class="input cell">
-          <input type="text" class="form" class="form" id="fax">
+          <input type="text" class="form" id="fax">
         </div>
       </div>
     </div>
     <div class="input">
-      <label id="emailLabel">
+      <label>
         <div><span i18n-content="emailLabel"></span></div>
-        <input type="text" class="form" class="form" id="email">
+        <input type="text" class="form" id="email">
       </label>
     </div>
   </div>
   <div class="action-area">
     <div class="button-strip">
-      <button type="reset" id="autoFillEditAddressCancelButton"
+      <button type="reset" id="autofill-edit-address-cancel-button"
           i18n-content="cancel"></button>
-      <button type="submit" id="autoFillEditAddressApplyButton" disabled
+      <button type="submit" id="autofill-edit-address-apply-button" disabled
           i18n-content="ok"></button>
     </div>
   </div>
diff --git a/chrome/browser/resources/options/autofill_edit_address_overlay.js b/chrome/browser/resources/options/autofill_edit_address_overlay.js
index fe461f3..3556e2e 100644
--- a/chrome/browser/resources/options/autofill_edit_address_overlay.js
+++ b/chrome/browser/resources/options/autofill_edit_address_overlay.js
@@ -16,7 +16,7 @@ cr.define('options', function() {
   function AutoFillEditAddressOverlay() {
     OptionsPage.call(this, 'autoFillEditAddressOverlay',
                      templateData.autoFillEditAddressTitle,
-                     'autoFillEditAddressOverlay');
+                     'autofill-edit-address-overlay');
   }
 
   cr.addSingletonGetter(AutoFillEditAddressOverlay);
@@ -31,10 +31,10 @@ cr.define('options', function() {
       OptionsPage.prototype.initializePage.call(this);
 
       var self = this;
-      $('autoFillEditAddressCancelButton').onclick = function(event) {
+      $('autofill-edit-address-cancel-button').onclick = function(event) {
         self.dismissOverlay_();
       }
-      $('autoFillEditAddressApplyButton').onclick = function(event) {
+      $('autofill-edit-address-apply-button').onclick = function(event) {
         self.saveAddress_();
         self.dismissOverlay_();
       }
@@ -63,13 +63,13 @@ cr.define('options', function() {
     saveAddress_: function() {
       var address = new Array();
       address[0] = this.guid;
-      address[1] = $('fullName').value;
-      address[2] = $('companyName').value;
-      address[3] = $('addrLine1').value;
-      address[4] = $('addrLine2').value;
+      address[1] = $('full-name').value;
+      address[2] = $('company-name').value;
+      address[3] = $('addr-line-1').value;
+      address[4] = $('addr-line-2').value;
       address[5] = $('city').value;
       address[6] = $('state').value;
-      address[7] = $('zipCode').value;
+      address[7] = $('zip-code').value;
       address[8] = $('country').value;
       address[9] = $('phone').value;
       address[10] = $('fax').value;
@@ -86,9 +86,9 @@ cr.define('options', function() {
      */
     connectInputEvents_: function() {
       var self = this;
-      $('fullName').oninput = $('companyName').oninput =
-      $('addrLine1').oninput = $('addrLine2').oninput = $('city').oninput =
-      $('state').oninput = $('country').oninput = $('zipCode').oninput =
+      $('full-name').oninput = $('company-name').oninput =
+      $('addr-line-1').oninput = $('addr-line-2').oninput = $('city').oninput =
+      $('state').oninput = $('country').oninput = $('zip-code').oninput =
       $('phone').oninput = $('fax').oninput =
       $('email').oninput = function(event) {
         self.inputFieldChanged_();
@@ -102,11 +102,12 @@ cr.define('options', function() {
      */
     inputFieldChanged_: function() {
       var disabled =
-          !$('fullName').value && !$('companyName').value &&
-          !$('addrLine1').value && !$('addrLine2').value && !$('city').value &&
-          !$('state').value && !$('zipCode').value && !('country').value &&
-          !$('phone').value && !$('fax').value && !$('email').value;
-      $('autoFillEditAddressApplyButton').disabled = disabled;
+          !$('full-name').value && !$('company-name').value &&
+          !$('addr-line-1').value && !$('addr-line-2').value &&
+          !$('city').value && !$('state').value && !$('zip-code').value &&
+          !$('country').value && !$('phone').value && !$('fax').value &&
+          !$('email').value;
+      $('autofill-edit-address-apply-button').disabled = disabled;
     },
 
     /**
@@ -114,13 +115,13 @@ cr.define('options', function() {
      * @private
      */
     clearInputFields_: function() {
-      $('fullName').value = '';
-      $('companyName').value = '';
-      $('addrLine1').value = '';
-      $('addrLine2').value = '';
+      $('full-name').value = '';
+      $('company-name').value = '';
+      $('addr-line-1').value = '';
+      $('addr-line-2').value = '';
       $('city').value = '';
       $('state').value = '';
-      $('zipCode').value = '';
+      $('zip-code').value = '';
       $('country').value = '';
       $('phone').value = '';
       $('fax').value = '';
@@ -143,13 +144,13 @@ cr.define('options', function() {
      * @private
      */
     setInputFields_: function(address) {
-      $('fullName').value = address['fullName'];
-      $('companyName').value = address['companyName'];
-      $('addrLine1').value = address['addrLine1'];
-      $('addrLine2').value = address['addrLine2'];
+      $('full-name').value = address['fullName'];
+      $('company-name').value = address['companyName'];
+      $('addr-line-1').value = address['addrLine1'];
+      $('addr-line-2').value = address['addrLine2'];
       $('city').value = address['city'];
       $('state').value = address['state'];
-      $('zipCode').value = address['zipCode'];
+      $('zip-code').value = address['zipCode'];
       $('country').value = address['country'];
       $('phone').value = address['phone'];
       $('fax').value = address['fax'];
@@ -166,7 +167,7 @@ cr.define('options', function() {
   };
 
   AutoFillEditAddressOverlay.setTitle = function(title) {
-    $('autoFillAddressTitle').textContent = title;
+    $('autofill-address-title').textContent = title;
   };
 
   // Export