How to escape HTML code within a data-text attribute?

Asked

Viewed 17 times

0

I wrote the following code:

<label class="form-input">
                <i class="material-icons"><span class="glyphicon glyphicon-lock" aria-hidden="true"></span></i>
                <input class="password-mask input-popover"
                       type="password"
                       autocomplete="off"
                       id="NewPassword"
                       maxlength="16"
                       name="NewPassword"
                       required
                       onchange="VerifyInput('NewPassword', 'newPassword-text'); this.setCustomValidity('');"
                       oninvalid="this.setCustomValidity('Por favor, preencha este campo.')"
                       onkeyup="CalculeStrength('NewPassword', 'strengt-bar', 'strengt-label')"
                       title=" "
                       data-toggle="popover"
                       data-html="true"
                       data-content="<div><p>Digite ao menos uma letra</p></div>"
                       data-container="body"
                       data-trigger="focus" />
                <span id="newPassword-text" class="label">Nova senha</span>
                <span class="underline"></span>
            </label>

The problem is that within the data-content attribute I need to insert an HTML code that will then be formatted via CSS.

I’m using Visual Studio and it’s not escaping the '/'.

How can I escape '/'?

  • How do you want to use this HTML? You will insert in the page?

  • This is the popove component of the bootstrap. https://getbootstrap.com/docs/3.javascript/#popovers. It should present a balloon containing the format instructions that the user should register the password.

  • I know. He’s displaying HTML as if it were a common text, that’s not it?

  • exactly, it displays the text containing the tags. You can even notice in the code snippet I pasted that the compiler doesn’t even recognize the input as an HTML tag.

  • It’s just that the "code sample" here only highlights the HTML tag if it’s all on the same line. In your case there, you broke lines for each attribute, probably to facilitate reading.

  • Well, for the test I did here, Popover’s HTML works normal with HTML, including swapped colors of div etc and worked.

Show 1 more comment
No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.