When im writing on chrome for example (got to work on all browsers) on the textarea in my site, and im pressing CTRL+Z, its deleting everything i wrote until the last "/n". Is there any way that i could make javascript save texts, so when a user will press CTRL+Z its will go to the last point when javascript saved the data?
For example, i would love to save the data every time a user click on backspace or a button that changes the textarea. its preety similar to the undo, redo buttons on stackoverflow.
Some kind of a string list isnt good for me, im looking for a built javascript/jquery way of doing that, if there is any.
You can have a look in this library
http://dmauro.github.io/Keypress/
It's allow you to detect all input, so basically you can store it on any letter typed, or at least save the text in the textarea everytime a special key is pressed.
It's also really easy to detect combo.
Hope that's help
Related
I'm writing a chrome extension which helps the user type things on twitter. When writing a tweet on twitter, twitter opens an editable div container. When the user types into it, twitter (which is using some web-framework presumably) generates sub-divs and spans with the text the user types and places them within the content-editable div.
The thing is when one manually changes the span value (for instance, through inspect elements), and then types something again, the value in the span will just revert back to what it previously was (before the inspect elements edit). This is probably because the actually typed string is stored somewhere in javascript, and everything gets overwritten again when the user types into the div.
I've been trying to find a way around this using JQuery but with no success. I don't really know how to start. If it were just a regular input tag, you could call something like $("input").val("new value"), easy-peasy... but I don't know how one could go about doing that for an editable div that gets updated by javascript running somewhere on the page.
For a while, I just thought it would be impossible...
BUT NOW I do know it is possible. If you download the Grammarly extension and use the Grammarly popup-editor (which opens a new window to edit text), then submit that, the twitter editable-content div updates appropriately and everything works like magic.
Sorry if this isn't a standard programming question, but I couldn't find anything on the web that comes close to what I'm trying to do. Maybe I'm just not experienced enough and am missing something really obvious. I tried looking at the twitter and Grammarly source code but it's all minified garbled javascript that I can't read...
Thanks for any help and insight!
EDIT: the twitter url in question is: https://twitter.com/compose/tweet The div in question is the one with contenteditable="true" attribute (you can search it in the inspector)
I have been trying to highlighting multiple search result hits in the textareas - multiple textareas - of a form.
After much searching and many trials I found a solution while I was preparing this question for S.O. but before I submitted it. I thought it worth recording here to save time for anyone else with the same problem. I hope this is an acceptable thing to do on S.O. If not, moderators, please delete.
In the app I'm working on, users enter text and it is stored in MySQL where each record corresponds to a form. Users can recall any record for editing, and when they do, they will be presented with the previously-entered data in text areas again to modify. This all works.
Now, I've implemented a search function to search the whole table, and when the user recalls a record, I want to present it in the form for editing, with any and all search hits on a page highlighted - e.g. like this:
(source: informationtamers.com)
That's simplified, the actual form is longer, so the user may not notice other hits on the page.
I've made it work with a highlight for the first occurrence of the hit string if it's present in the form, but the problem comes when the string appears multiple times in one text area, or in multiple text areas on the same form.
I have tried these approaches:
setSelectionRange: This is the only one that even half-way works, but highlights only one string per form. This makes sense because AFAIK you can't have more than one item selected in an html input field or form and as a UI for someone looking for the results of a search it's not very user-friendly.
add style at the appropriate points in the input text: <span style="background-color: yellow">ZZZZ</span>
I didn't expect this to work, as it's input in textarea, but I did try it and it just shows the html. (For the record, the user's data is escaped immediately it's submitted.)
Invoke the browser's own search facility and pass it the search term. I failed to find any way of doing this on three counts: I can't find a way to trigger Ctrl+f programatically, inject the search term into the browser's search box and initiate the browser search programatically.
Johann Burkard's 'highlight' jQuery plugin. http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html
This is capable of highlighting multiple entries on a page, but not in textarea fields, which as far as I can see it ignores. I believe I've set it up and invoked it correctly, because I can get it to highlight multiple text area captions on the page. It works by adding <span class="highlight">Search result</span>.
This http://frightanic.com/projects/jquery-highlight/ from frightanic gives results the same as Burkard's plugin.
This http://www.jquery.info/The-plugin-SearchHighlight from Renato is targeted at search engine results, so is not my use case.
This http://jaspreetchahal.org/examples/jquery-onpage-text-highlighter-and-filter.html filters out paragraphs that don't contain a matching string so I didn't try it, but the demo shows that it uses <span style="background:yellow;color:#000000">Search result</span> to highlight, like the others, so I doubt it would work on text areas.
The one that, after some playing around, did what I wanted: http://bebo.minka.name/k2work/libs.js/jquery/2.1.0/highlightTextarea/
Some points to note.
The text areas must not be resizable. The documentation says this, but also documents an option 'resizable' and says that the jQueryUI Resizable is required. I tried this and it did not work. I guess it was an intention but was not debugged, as the author says he's no longer working on the plugin.
I'm using this with colorbox, and found I had to .highlightTextarea("destroy") and then .highlightTextarea("disable") when user leaves the form, or the highlights appeared when viewing records that had no hits.
In some circumstances, the CSS conflicted with mine and messed the form up, so when the user cancels the search, I .remove the form from the DOM and rebuild it. This is probably due to the way I'm using the plugin, and not the best solution, but I couldn't find how else to resolve it.
The result now seems to be solid, and provides the effect I was trying to find for so long.
I need to sort messages, and I can either remove them or approve them (or ignore).
I want to create a script (probably using Tampermonkey - I'm using Chrome on mac) where I could input a list of recurring words (swear words I would input) for which it removes the messages so that it can go faster, it would automatically click the remove button after if it find the word(s) in the message.
If it doesn't find anything I want it to do NOTHING, just leave the page as is.
Basically usually after I click the button the page loads again automatically and gives me the next message.
I don't really know programming, I'm mostly just around html/css and a bit of jquery, but I'm learning here and there.
How can I achieve this ?
Thank you very much.
I would like to add "add another field" and "remove field" button in django admin which results in to add/remove a text field respectively. And all these field should be concatenated(separated via some character) and assigned into one model textfield. How could I achieve this?
You're best bet is going to be to use Javascript. Have Javascript create the new field (or remove it) on button click. Let the user fill in the field as they need to. When they are ready to save you'll need to catch the submit (again using Javascript) and concatenate everything into the initial textarea field and then let it submit to the server where Django should handle it.
You'll also have to then have Javascript run on page load to check the textarea and split out the different sections of your textarea.
More or less that is how you are going to have go about it. If you're wanting to have someone write it for you then that would be a whole other discussion.
(I know it's easy to come along and say "why do that, that's not the best way". I often run into constraints where the best way isn't going to work, so I try not to knock others not knowing their constraints.)
has anyone ever seem an autocomplete solution in JS that works like Chrome's Console? (I think this is in version 17+)
I am trying to build something using jQuery, but I can't imagine how the autocomplete placeholder that stays below the active text follows the cursor.
All the autocomplete thing, the search, sort, etc... I've already done, I just need a way that the placeholder follows the cursor. Thanks.
Well, why not to use a text box and to call function on any key press/key down. Then the function will read the text that is currently enter and check your data structure for possible end of the word.
You can sort the possible answer and to write the first one for example with other color. If the user press space or enter to color the whore world with black, and if it is press tab to switch with other possible answer...
Do you mean this?I can write some code to show you want I mean if this is what you need?