Multiple rich text boxes

[wellingtonclarify]

I need to work with three rich text boxes in the same page and I am having problem when I use link button. When I try to include a link on first RTB, the result appers in the last (third) RTB.

[mkoryak]

sounds like you used an id selector when you should have used a class selector somewhere.

I bet if you removed the 3rd one from the page it would appear on the 2nd one, etc.

[mkoryak]

The editor on the demo site is not production ready. @neilj should probably write a big fat warning about that there.

The problem stems from this code in the editor:

this.linkDrop = new Drop({
        target: $('#makeLink').first()[0],
        content: $('#drop-link').html(),
        position: 'bottom center',
        openOn: 'click'
      });

      this.linkDrop.on('open', function () {
        $('.quit').click(function () {
          $(this).parent().parent().removeClass('drop-open');
        });

        $('.submitLink').click(function () {
          var editor = iframe.contentWindow.editor;
          editor.makeLink($(this).parent().children('#url').first().val());
          $(this).parent().parent().removeClass('drop-open');
          $(this).parent().children('#url').attr('value', '');
        });
      });

Specifically the link dropper widget's target is $('#makeLink').first()[0],. It is selected with the id selector, so if there are multiple ones on the page, you will get the last one. There are few more things like that in that demo integration.

This is just a guess. I didn't run the code in your screenshot.

[mkoryak]

Also, that function binds the click event on $('.submitLink') every time the link dropdown is opened. That cant be good.

[neilj]

Yes, the demo integration is not for production use. Squire is intended for integration with your own UI.