Adding a default text to the beginning of an text area

I have a text area where I can enter a SQL statement. The text "SELECT TOP 1" is used at the begining of the sql statement as a default prefix that can not be removed.

In order to archive this functionality, I found three options:

1. Use an inputMask and build a pattern for the entered text. We can use the prefix inside the text area:

http://jsfiddle.net/SEXAj/2130/

2. Create an javascript event listener on event "input" and calculate to prevent the prefix is removed

http://jsfiddle.net/sarbbottam/TUc94/

3. Use another html tag like "div"/"span" that contains the prefix and calculate the suitable position

+ Tag "span": http://jsfiddle.net/4YzZy/
+ Tag "div": http://jsfiddle.net/215b34fs/

I chose the 3rd approach with tag "div" because it's the most easiest solution and suitable for me at that monment.

References:
[1]. http://stackoverflow.com/questions/24846041/how-do-i-add-a-default-text-to-the-beginning-of-an-html-text-area
[2]. http://stackoverflow.com/questions/24305200/how-to-enable-to-insert-spaces-in-masked-input-plugin-jquery-plugin

Comments

My impression of Google I/O 2016

I have not yet had a chance to attend this event but I just watched it on Youtube as usual. :) Google Assistant You might be very familiar to Google Now if you're Android fan. I saw that Google Assistant is like an upgrade to Google Now. It looks smarter because we are able to make a conversation with Google rather than just saying "Ok Google" and getting the tasks done as Google Now. That means Google Assistant can understand our personal words in our contexts. For example: I : Who is Google CEO? Google : Sundar Pichai I : Show me his awards => Here I don't need to say "Show me Sundar Pichai awards", because I don't know to pronounce his name correctly. :) I am thinking about that we can compare Google Assistant to Siri of Apple. Google Home At Google I/O 2015 last year, Sundar mentioned about working on a exciting project with Internet of Things and I think Google Home is a result. Working with Google Assistant, Google ho...

Selenium - Override javascript functions to ignore downloading process

I have got an issue with downloading process on IE 8. This browser blocks my automatic-download functionality on my app so that I could not work with my test case any more after that. In my case, I didn't care about the file is downloaded or not, I just focus on the result after downloading process finished successfully. Therefore, I found a solution to ignore this process so that I can work normally. I use Primefaces, here is the remote command to trigger the download process <p:remoteCommand name="cmdGenerateDocument" actionListener="#{logic.onGenerateDocument}" update="xrflDocumentCreationPanel" oncomplete="clickDownloadButton();"/> The following is my test case: @Test public void shouldUpdateStep6ToWarningIfStep1IsValidAfterFinished(){ MainPage mainPage = new MainPage(); waitForLoading(mainPage.getDriver()); EmployeeDetailPage empDetailPage = new EmployeeDetailPage(); waitForLoading(empDetailPage.getDriver()); e...

Styling Sort Icons Using Font Awesome for Primefaces' Data Table

So far, Primefaces has used image sprites for displaying the sort icons. This leads to a problem if we want to make a different style for these icons; for example, I would make the icon "arrow up" more blurry at the first time the table loading because I want to highlight the icon "arrow down". I found a way that I can replace these icons with Font Awesome icons. We will use "CSS Pseudo-classes" to achieve it. The hardest thing here is that we should handle displaying icons in different cases. There is a case both "arrow up" and "arrow down" showing and other case is only one of these icons is shown. .ui-sortable-column-icon.ui-icon.ui-icon-carat-2-n-s { background-image: none; margin-left: 5px; font-size: 1.1666em; position: relative; } .ui-sortable-column-icon.ui-icon.ui-icon-carat-2-n-s:not(.ui-icon-triangle-1-s)::before { content: "\f106"; font-family: "FontAwesome"; position: ...

How I did customize "rasa-nlu-trainer" as my own tool

Check out my implementation here Background I wanted to have a tool for human beings to classify intents and extract entities of texts which were obtained from a raw dataset such as Rocket.chat's conversation, Maluuba Frames or here . Then, the output (labeled texts) could be consumed by an NLU tool such as Rasa NLU. rasa-nlu-trainer was a potential one which I didn't need to build an app from scratch. However, I needed to add more of my own features to fulfill my needs. They were: 1. Loading/displaying raw texts stored by a database such as MongoDB 2. Manually labeling intents and entities for the loaded texts 3. Persisting labeled texts into the database I firstly did look up what rasa-nlu-trainer 's technologies were used in order to see how to implement my mentioned features. At first glance rasa-nlu-trainer was bootstrapped with Create React App. Create React App is a tool to create a React app with no build configuration, as it said. This too...

Creating a Chatbot with RiveScript in Java

Motivation "Artificial Intelligence (AI) is considered a major innovation that could disrupt many things. Some people even compare it to the Internet. A large investor firm predicted that some AI startups could become the next Apple, Google or Amazon within five years" - Prof. John Vu, Carnegie Mellon University. Using chatbots to support our daily tasks is super useful and interesting. In fact, "Jenkins CI, Jira Cloud, and Bitbucket" have been becoming must-have apps in Slack of my team these days. There are some existing approaches for chatbots including pattern matching, algorithms, and neutral networks. RiveScript is a scripting language using "pattern matching" as a simple and powerful approach for building up a Chabot. Architecture Actually, it was flexible to choose a programming language for the used Rivescript interpreter like Java, Go, Javascript, Python, and Perl. I went with Java. Used Technologies and Tools Oracle JDK 1.8...

vhandit

Search This Blog