0

Problem: I have the following code which works fine:

<div style="margin-top: 5pt;">
     <a href="{{e.DocURL}}" target="_blank">
         <button class="btn btn-primary" 
                 id="showDocs" 
                 ng-show="e.DocFlag === 'Y'" 
                 style="border-radius: 13px; padding-bottom: 5px;" 
                 type="button">Provider Bio
         </button>
     </a>
</div>

However, whenever I update the form, the a tag goes disappears. I'm still fairly new to AngularJS and is their a alternative to the a tag I can use.

lin
  • 17,956
  • 4
  • 59
  • 83
Robert
  • 167
  • 1
  • 2
  • 14
  • 2
    what value does e.DocFlag have? – Mark S. Oct 10 '17 at 19:01
  • It looks like the error may not be where you expect; does `e.DocFlag` change when the form is updated? – Haroldo_OK Oct 10 '17 at 19:01
  • @MarkS.: e.DocFlag contains pdf files that will display depending on the name of a person. e.DocFlag does change if you are looking up a different person who may or may not have a pdf file – Robert Oct 10 '17 at 19:04

2 Answers2

1

I think you should not wrap the button with an <a> but put the "btn btn-primary" class in the <a>. HTML may not allow a link to contain a button.

Edit: This is confirmed by this answer: Can I nest a <button> element inside an <a> using HTML5?

Fabien Ménager
  • 140,109
  • 3
  • 41
  • 60
0

Your a tag is not disappearing your button is. Look at this line:

ng-show="e.DocFlag === 'Y'" 

When e.DocFlag is anything other than 'Y' the button will disappear. The button is the only thing inside the a tag. when there is nothing inside the a it will appear to be gone.

Niles Tanner
  • 3,911
  • 2
  • 17
  • 29
  • Let me elaborate: The actual a tag in the code disappears. Yes, the ng-show part will make it disappear. But the actual a tag is removed when I go back in the form – Robert Oct 10 '17 at 19:07
  • Would the following approach then work to prevent the disappearing of the a tag: 'Provider Bio' – Robert Oct 10 '17 at 19:18