0

I have a textarea where you can tag other people (using autocomplete and a mentions javascript plugin), I've noticed you can type in:

<script>alert('hi');</script>

And the alert will execute, I don't believe this is normal behaviour, any thoughts on why this is happening?

HTML:

<div class="comment_details_input">
    <div class="comment_user_image"><img src="resource/user/profile/pic_c4ca4238a0b923820dcc509a6f75849b20762.jpeg"></div>

    <div class="mentions-input" style="display: block;"><div class="highlighter" style="white-space: pre-wrap; word-wrap: break-word; margin: 0px; padding: 6px 12px; border-width: 1px; font-size: 14px; font-style: normal; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-weight: 400; line-height: 20px; height: 54px; box-sizing: border-box; background-color: rgb(255, 255, 255);"><div class="highlighter-content"></div></div><textarea class="form-control comment_here input ui-autocomplete-input" type="text" placeholder="Write a comment" autocomplete="off" style="height: 54px; background-color: transparent;"></textarea><input type="hidden" value=""><ul class="ui-autocomplete ui-front ui-menu ui-widget ui-widget-content" id="ui-id-2" tabindex="0" style="display: none;"></ul></div>

    <div class="comment_details_input_hidden" style="display: block;">
        <button class="btn btn-sm btn_blue_lightbg pull-right add_comment ladda-button" data-style="slide-down">Post</button>
    </div>
</div>

Javascript:

This moves around the textarea:

$(document).on('focus', '.comment_here', function () {

    $('.comment_here').autogrow();

    var $elem = $(this);
    $(this).parents('.mentions-input').next('.comment_details_input_hidden').slideDown("fast", function () {
        // Animation complete.
    });
});

$(document).on('keyup', '.comment_here', function () {
    var $elem = $(this);
    var height = $(this).height();

    var $highlighter = $elem.parents('.mentions-input').find('.highlighter');
    $highlighter.height(height);
});

Plugin used is jquery mentions:

https://github.com/ivirabyan/jquery-mentions

Edit: Really don't see this is as a duplicate of the other question, his issue is with sanitizing a user input, my issue is with having a textarea executing javascript.

Callombert
  • 1,099
  • 14
  • 38
  • 4
    It's not a problem with the ` – Pointy Feb 09 '15 at 22:25
  • @Pointy Any post on stackoverflow to explain what I'm donig wrong? – Callombert Feb 09 '15 at 22:27
  • 2
    One more good reason to not to use `innerHTML` to add content to a page. – Teemu Feb 09 '15 at 22:27
  • Can you show the code that you are using to generate the textarea? – bhspencer Feb 09 '15 at 22:29
  • Without knowing anything about your site code it's impossible to say what you need to do. The point is that you're taking user-supplied content and blinding including it somehow as part of the page. All web programming environments provide one or more ways of sanitizing user-supplied content. – Pointy Feb 09 '15 at 22:32
  • I've added some code and the used plugin @bhspencer – Callombert Feb 09 '15 at 22:34

0 Answers0