New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

html codes in template string using `correlativeTemplate` option #351

Closed
jgassie opened this Issue Jun 1, 2017 · 15 comments

Comments

Projects
None yet
2 participants
@jgassie

jgassie commented Jun 1, 2017

If I define a character code such as < (amersand-pound-number60) in a template string, it displays fine when listed, but if I arrow over or select an option, the js-typeahead-input displays the coded value instead of the less than symbol for example... although I can decode the value in the onClickAfter... but it still shows code if I arrow over partial match options with the keyboard before selecting. Not sure if there is a way around that.

@running-coder

This comment has been minimized.

Owner

running-coder commented Jun 5, 2017

hey @jgassie , I was able to reproduce the issue. This is more of a "format data operation" and outside of the Typeahead's scope. What you can do is convert your entities as you receive the data.

...
source: {
    groupName: {
        ajax: {
            url: "url/to/my/data.json",
            callback: {
                done: function (data, textStatus, jqXHR) {
                    // Convert htmlEntities inside data
                }
            }
        }
    }
}
...
@jgassie

This comment has been minimized.

jgassie commented Jun 5, 2017

Thank you for the response. The source data doesn't have greater-than less-than, I was wanting to add in the display. So are you saying to convert before using the template string? Had to use the codes since they are special xml/html characters. Not actually using ajax in this way either... establishing a json string by other means, google apps script loading sheet data.
I was wanting to use a fairly common RFC 822 look "Display Name" <emailaddress>
But I will probably just use something else like a dash, Name-email.

@running-coder

This comment has been minimized.

Owner

running-coder commented Jun 5, 2017

are you using the correlativeTemplate option? Seems like I'm only able to repro using it

@jgassie

This comment has been minimized.

jgassie commented Jun 5, 2017

Yes, correlativeTemplate is true. I'll just use something other than those special characters, thank you!

running-coder added a commit that referenced this issue Jun 5, 2017

@running-coder

This comment has been minimized.

Owner

running-coder commented Jun 5, 2017

You can try the newest develop version, should work

@running-coder running-coder added Bug and removed Support labels Jun 5, 2017

@running-coder running-coder added this to the 2.9.0 milestone Jun 5, 2017

@running-coder running-coder changed the title from html codes in template string to html codes in template string using `correlativeTemplate` option Jun 5, 2017

@jgassie

This comment has been minimized.

jgassie commented Jun 5, 2017

thank you i will try again when i get a chance!

@jgassie

This comment has been minimized.

jgassie commented Jun 6, 2017

Works great, thank you! :)

@running-coder

This comment has been minimized.

Owner

running-coder commented Jun 6, 2017

Amazing, thanks for the feedback!

@jgassie

This comment has been minimized.

jgassie commented Jun 6, 2017

Well for my original scenario, it worked great, although in another I had a "span" inserted into the template string, and the span tag and properties displayed..

@running-coder

This comment has been minimized.

Owner

running-coder commented Jun 6, 2017

oh yea, I might have missed that case... :rip: going to have to work some more on that regex 155ae70#diff-fd35b9a6d01c422794aa3fb6236ba920R1247

@running-coder running-coder reopened this Jun 6, 2017

@running-coder

This comment has been minimized.

Owner

running-coder commented Jun 6, 2017

What this one does is supposed to do is extracting every strings from a template excluding the html tags. The text then gets inserted in every object key named compiled, so correlativeTemplate searches though your complete template and not only in 1 key.

@jgassie

This comment has been minimized.

jgassie commented Jun 6, 2017

I see, thank you for all your effort... haven't used Jasmine before, something more to check out :) .

running-coder added a commit that referenced this issue Jun 6, 2017

@running-coder

This comment has been minimized.

Owner

running-coder commented Jun 6, 2017

So I've let the previous regex to remove anything between <> inclusively (aka removing html tags), but you will be able to add your own using the previously mentionned method &#60;{{email}}&#62; since the matched string is now inserted and extracted from a <textarea> for formatting. Should work now, sorry for the confusion

@running-coder

This comment has been minimized.

Owner

running-coder commented Jun 6, 2017

I highly recommend using jasmine or any other test framework on everything you do, in the case of Typeahead it prevented so many regressions and unhappy people ;)

@jgassie

This comment has been minimized.

jgassie commented Jun 6, 2017

Thanks for the advice, the last commit 41118e6... certainly does the trick!

running-coder added a commit that referenced this issue Aug 18, 2017

Version 2.9.0
Feature
- #306 Allow Typeahead to be initialized on <textarea> and <div> with content editable

Fixes
- #363 `templateValue` option when navigating
- #360 Safari pressing Tab brings back to the first tabbable item
- #355 XSS issue with emptyTemplate when no results found
- #351 htmlEntities inside correlativeTemplate
- #311 When `href` option is set, pressing Enter should follow the link

Improvement
- #326 Improve Up / Down / Tab navigation to have only 1 "selected" item
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment