Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    raf
    raf is offline
    Master Coder
    Join Date
    Jul 2002
    Posts
    6,589
    Thanks
    0
    Thanked 0 Times in 0 Posts

    select keywords with onclick in textarea

    I'm thinking about adding a feature to one of my pages, where the user would be able to select keywords from a text he typed in in a textarea, by just clicking on them (or doubleclicking maybe or maybe clicking while holding dow a key or so).

    Did someone here ever did something like this? anyone knows some readymade code for this? someone has to many times on their hands or someone want's to help me out? (or will i have to write it myself )

    i would imagine that this sort of thing could be usefull to others (for instance on a forum like this where you could this set up keywords to optimise a searchfunction), which usually means that someone already written something like it. But my searches didn't turn up anything ...
    Posting guidelines I use to see if I will spend time to answer your question : http://www.catb.org/~esr/faqs/smart-questions.html

  • #2
    fci
    fci is offline
    Senior Coder
    Join Date
    Aug 2004
    Location
    Twin Cities
    Posts
    1,345
    Thanks
    0
    Thanked 0 Times in 0 Posts
    you could do it with the DOM.. or you could do something easier ....
    is the text in the textarea delimited in anyway(by comma, line, etc.) ?
    because then you could populate a span with checkboxes based on the delimited phrases(or multiple select menu).
    Last edited by fci; 08-28-2004 at 12:37 PM.

  • #3
    raf
    raf is offline
    Master Coder
    Join Date
    Jul 2002
    Posts
    6,589
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by fci
    you could do it with the DOM.. or you could do something easier ....
    is the text in the textarea delimited in anyway(by comma, line, etc.) ?
    because then you could populate a span with checkboxes based on the delimited phrases(or multiple select menu).
    it would be just text like this post here: a few paragraphs that you type in.

    i guess you could say that words are space-delimited (with the exception that there might be a ., :, ;,),( or so be added to them. But reloading it as a collection of checkboxes isn't realy workable.

    if i need to customcode it, then i'll probably use the caret-position and use a regex to get the word that containes this position, and then add the word to a hidden formfields value.

    i'm just wondering id noone has some code to use/start from.
    Posting guidelines I use to see if I will spend time to answer your question : http://www.catb.org/~esr/faqs/smart-questions.html

  • #4
    fci
    fci is offline
    Senior Coder
    Join Date
    Aug 2004
    Location
    Twin Cities
    Posts
    1,345
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by raf
    it would be just text like this post here: a few paragraphs that you type in.

    i guess you could say that words are space-delimited (with the exception that there might be a ., :, ;,),( or so be added to them. But reloading it as a collection of checkboxes isn't realy workable.

    if i need to customcode it, then i'll probably use the caret-position and use a regex to get the word that containes this position, and then add the word to a hidden formfields value.

    i'm just wondering id noone has some code to use/start from.
    I suggested checkboxes because I thought someone would want to 'narrow' their keyword search.. I was assuming the words in the textarea were not necessarily the search terms.

    and.. if you were to use regex you could use the word boundary to delimit it and then use 'lastindex' to increment through the search.
    http://devedge.netscape.com/library/...p.html#1193732

    If your regular expression uses the "g" flag, you can use the exec method multiple times to find successive matches in the same string. When you do so, the search starts at the substring of str specified by the regular expression's lastIndex property. For example, assume you have this script:

    <SCRIPT LANGUAGE="JavaScript1.2">
    myRe=/ab*/g;
    str = "abbcdefabh"
    myArray = myRe.exec(str);
    document.writeln("Found " + myArray[0] +
    ". Next match starts at " + myRe.lastIndex)
    mySecondArray = myRe.exec(str);
    document.writeln("Found " + mySecondArray[0] +
    ". Next match starts at " + myRe.lastIndex)
    </SCRIPT>

    This script displays the following text:

    Found abb. Next match starts at 3
    Found ab. Next match starts at 9
    btw, a server side script is not an option?

  • #5
    raf
    raf is offline
    Master Coder
    Join Date
    Jul 2002
    Posts
    6,589
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by fci
    I suggested checkboxes because I thought someone would want to 'narrow' their keyword search.. I was assuming the words in the textarea were not necessarily the search terms.

    and.. if you were to use regex you could use the word boundary to delimit it and then use 'lastindex' to increment through the search.
    Maybe i didn't explain right.
    Example:
    someone types in:
    "I'm looking for a script that can select records from a database and then display them in blocks of 10 records. I believe it is called pagination."

    Now, what i'm going to add is a feature so that the user can for instance push down the "alt"-key and then click on a word in the textarea. For instance, say he clicks on the 'i' in 'script', then i'm going to add the word 'script' to a hidden field. If he next clicks on 'records' then ', records' is added to the hidden field

    Not searching through the textarea (there is nothing to search for) and no need for an ofset or loop or repeat or so because each click should just add one new word.
    Quote Originally Posted by fci
    btw, a server side script is not an option?
    What do you mean? Registering the word he clicked on needs to be done clientsided. Unless i'd register the position and then get the word from the posted value based on the strpos() or so, but storing the position that was clicked on is almost as much clientside work as registering the word ...
    Also, if i do it clientsided, then i could for instance show the words that are already selected.

    Seams i'm gonna need to write this myself...

    Thanks fro your input !
    Posting guidelines I use to see if I will spend time to answer your question : http://www.catb.org/~esr/faqs/smart-questions.html

  • #6
    fci
    fci is offline
    Senior Coder
    Join Date
    Aug 2004
    Location
    Twin Cities
    Posts
    1,345
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by raf
    Maybe i didn't explain right.
    Example:
    someone types in:
    "I'm looking for a script that can select records from a database and then display them in blocks of 10 records. I believe it is called pagination."

    Now, what i'm going to add is a feature so that the user can for instance push down the "alt"-key and then click on a word in the textarea. For instance, say he clicks on the 'i' in 'script', then i'm going to add the word 'script' to a hidden field. If he next clicks on 'records' then ', records' is added to the hidden field

    Not searching through the textarea (there is nothing to search for) and no need for an ofset or loop or repeat or so because each click should just add one new word.

    What do you mean? Registering the word he clicked on needs to be done clientsided. Unless i'd register the position and then get the word from the posted value based on the strpos() or so, but storing the position that was clicked on is almost as much clientside work as registering the word ...
    Also, if i do it clientsided, then i could for instance show the words that are already selected.

    Seams i'm gonna need to write this myself...

    Thanks fro your input !
    using the Alt key sounds like it would provide poor usability. you have to look at it like this.. people can barely understand that you have to CTRL+click for multiple select menus... why make it more complicated for them?
    If you continue with your approach here is what I would suggest..
    As well as having the alt key availability, a user could press a button that could activate the "word selector"(crosshair cursor?).
    Now the person uses the crosshair cursor to click on various words..
    When the user clicks on a word it adds it adds a row to a table ... they would also have to be able to remove one of the keywords at their choosing.. right?
    question though.. why don't you just have people enter in their own keywords? why reinvent the wheel? why make this so "complicated" ? is this development just for the sake of development?
    (hopefully I don't come off as an asshole, I just tend to be a critical person)..

    oh! I have an idea.. instead of them actually clicking in the textarea.. the textarea populates a span that users can then click on their various keywords so then you can actually highlight the words that a user clicked on.. but then if they have to edit the textarea they would have to choose their keywords again(because of the placement of the highlighted text, etc. depends how you do it though)..

  • #7
    Regular Coder
    Join Date
    Jun 2004
    Posts
    565
    Thanks
    0
    Thanked 18 Times in 18 Posts
    Maybe this will help, although it is IE only.
    Code:
    <html>
    	<head>
    		<script type='text/javascript'>
    			function keyword() {
    				var trange = document.selection.createRange();
    				var fulltext = trange.duplicate();
    				fulltext.expand('textedit');
    				while(trange.text.substr(0, 1) != ' ') {
    					if(!trange.compareEndPoints('StartToStart', fulltext)) break;
    					trange.moveStart('character', -1);
    				}
    				while(trange.text.substr(trange.text.length - 1) != ' ') {
    					if(!trange.compareEndPoints('EndToEnd', fulltext)) break;
    					trange.moveEnd('character', 1);
    				}
    				alert(trange.text);
    			}
    		</script>
    	</head>
    	<body>
    		<textarea onClick='keyword()'>this is some text</textarea>
    	</body>
    </html>
    dumpfi

  • #8
    raf
    raf is offline
    Master Coder
    Join Date
    Jul 2002
    Posts
    6,589
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by fci
    using the Alt key sounds like it would provide poor usability. you have to look at it like this.. people can barely understand that you have to CTRL+click for multiple select menus... why make it more complicated for them?
    If you continue with your approach here is what I would suggest..
    As well as having the alt key availability, a user could press a button that could activate the "word selector"(crosshair cursor?)
    Indeed. Using a button to activate the 'keywordselection mode' would be more userfriendly.
    Quote Originally Posted by fci
    Now the person uses the crosshair cursor to click on various words..
    When the user clicks on a word it adds it adds a row to a table ... they would also have to be able to remove one of the keywords at their choosing.. right?
    Yes indeed. That's the idea
    Quote Originally Posted by fci
    question though.. why don't you just have people enter in their own keywords? why reinvent the wheel? why make this so "complicated" ? is this development just for the sake of development?
    (hopefully I don't come off as an asshole, I just tend to be a critical person)..
    Because i think that most people find it easier to just click on the words they consider to be keywords, then to type them in or to copy-paste them. Are you now saying that you'd rather type them in then just clicking on them?
    Quote Originally Posted by fci
    oh! I have an idea.. instead of them actually clicking in the textarea.. the textarea populates a span that users can then click on their various keywords so then you can actually highlight the words that a user clicked on.. but then if they have to edit the textarea they would have to choose their keywords again(because of the placement of the highlighted text, etc. depends how you do it though)..
    I don't quite understand the advantages of what you're suggesting. Are you talking about also displaying the textareas content with the selected keywords highlighted? I think that would be a bit of overkill. Usually, they wount select that many keywrds + i can just show them alongside the textarea + if they include 'doubles' then i'll just handle it serversided by creating an array_unique()

    thanks for tour input !
    Posting guidelines I use to see if I will spend time to answer your question : http://www.catb.org/~esr/faqs/smart-questions.html

  • #9
    raf
    raf is offline
    Master Coder
    Join Date
    Jul 2002
    Posts
    6,589
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by dumpfi
    Maybe this will help, although it is IE only.
    Code:
    <html>
    	<head>
    		<script type='text/javascript'>
    			function keyword() {
    				var trange = document.selection.createRange();
    				var fulltext = trange.duplicate();
    				fulltext.expand('textedit');
    				while(trange.text.substr(0, 1) != ' ') {
    					if(!trange.compareEndPoints('StartToStart', fulltext)) break;
    					trange.moveStart('character', -1);
    				}
    				while(trange.text.substr(trange.text.length - 1) != ' ') {
    					if(!trange.compareEndPoints('EndToEnd', fulltext)) break;
    					trange.moveEnd('character', 1);
    				}
    				alert(trange.text);
    			}
    		</script>
    	</head>
    	<body>
    		<textarea onClick='keyword()'>this is some text</textarea>
    	</body>
    </html>
    dumpfi
    Thanks for the code.

    I'm gonne chew on this some more because i'll need to chop of non-letters (or maybe non-alfanumerics, and mayb includeing a '-') but maybe i'll just use your code and run a regex on it serversided so that i can also counter code-injections.
    + i'll need to make it also work in moz

    thenks for the input !
    Posting guidelines I use to see if I will spend time to answer your question : http://www.catb.org/~esr/faqs/smart-questions.html

  • #10
    fci
    fci is offline
    Senior Coder
    Join Date
    Aug 2004
    Location
    Twin Cities
    Posts
    1,345
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I can highlight a word, hold down the CTRL key then drag to another input.. not hard at all. Try yourself...

    yeah.. my mind went on a tangent earlier.. a good tangent though.. anyway, I don't think it's hard for someone to type their keywords unless it's going to be like 100+ or anything excessive.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •