From 643be985b8c4e78ec2770f5532c5cadd88572b3e Mon Sep 17 00:00:00 2001
From: Coleman Watts <coleman@civicrm.org>
Date: Sun, 4 May 2014 19:35:57 -0400
Subject: [PATCH] attachment.tpl - cleanup related to js clear buttons

---
 templates/CRM/Form/attachment.tpl | 21 ++++++++++++++-------
 1 file changed, 14 insertions(+), 7 deletions(-)

diff --git a/templates/CRM/Form/attachment.tpl b/templates/CRM/Form/attachment.tpl
index d5df47513d..a15368d324 100644
--- a/templates/CRM/Form/attachment.tpl
+++ b/templates/CRM/Form/attachment.tpl
@@ -63,8 +63,8 @@
         {/if}
         <tr>
           <td class="label">{$form.attachFile_1.label}</td>
-          <td>{$form.attachFile_1.html}&nbsp;{$form.attachDesc_1.html}<a href="#" class="crm-hover-button" title="{ts}Clear{/ts}" onclick="clearAttachment( '#attachFile_1', '#attachDesc_1' ); return false;"><span class="icon close-icon"></span></a><br />
-            <span class="description">{ts}Browse to the <strong>file</strong> you want to upload.{/ts}{if $maxAttachments GT 1} {ts 1=$maxAttachments}You can have a maximum of %1 attachment(s).{/ts}{/if} {ts 1=$config->maxFileSize}Each file must be less than %1M in size. You can also add a short description.{/ts}</span>
+          <td>{$form.attachFile_1.html}&nbsp;{$form.attachDesc_1.html}<a href="#" class="crm-hover-button crm-clear-attachment" style="visibility: hidden;" title="{ts}Clear{/ts}"><span class="icon close-icon"></span></a>
+            <div class="description">{ts}Browse to the <strong>file</strong> you want to upload.{/ts}{if $maxAttachments GT 1} {ts 1=$maxAttachments}You can have a maximum of %1 attachment(s).{/ts}{/if} {ts 1=$config->maxFileSize}Each file must be less than %1M in size. You can also add a short description.{/ts}</div>
           </td>
         </tr>
         {if $form.tag_1.html}
@@ -84,7 +84,7 @@
             <tr class="attachment-fieldset"><td colspan="2"></td></tr>
             <tr>
                 <td class="label">{$form.attachFile_1.label}</td>
-                <td>{$form.$attachName.html}&nbsp;{$form.$attachDesc.html}<a href="#" class="crm-hover-button" title="{ts}Clear{/ts}" onclick="clearAttachment( '#{$attachName}' ); return false;"><span class="icon close-icon"></span></a></td>
+                <td>{$form.$attachName.html}&nbsp;{$form.$attachDesc.html}<a href="#" class="crm-hover-button crm-clear-attachment" style="visibility: hidden;" title="{ts}Clear{/ts}"><span class="icon close-icon"></span></a></td>
             </tr>
             <tr>
               <td class="label">{$form.$tagElement.label}</td>
@@ -129,10 +129,17 @@
   </div><!-- /.crm-accordion-wrapper -->
     {literal}
     <script type="text/javascript">
-      function clearAttachment( element, desc ) {
-        cj(element).val('');
-        cj(desc).val('');
-      }
+      CRM.$(function($) {
+        var $form = $("#{/literal}{$form.formName}{literal}");
+        $form
+          .on('click', '.crm-clear-attachment', function(e) {
+            e.preventDefault();
+            $(this).css('visibility', 'hidden').closest('td').find(':input').val('');
+          })
+          .on('change', '#attachments :input', function() {
+            $(this).closest('td').find('.crm-clear-attachment').css('visibility', 'visible');
+          });
+      });
     </script>
     {/literal}
  {/if} {* edit/add if*}
-- 
2.25.1