Forum: Ruby on Rails javascript help

Announcement (2017-05-07): www.ruby-forum.com is now read-only since I unfortunately do not have the time to support and maintain the forum any more. Please see rubyonrails.org/community and ruby-lang.org/en/community for other Rails- und Ruby-related community platforms.
Steve O. (Guest)
on 2006-04-01 00:09
(Received via mailing list)
Hi list,

I have a list of tags. I want to be able to click on a tag and have that
tag
name populate an input field. I think delicious used to allow you to
click
on existing links to tag your bookmark similar to this (moving instead
to
auto_complete).

My guess is the code looks something like this....
<form>
<input type="text" name="all" id="discover" size="16" value="test1,
test2"/>
</form>

<a href onClick="document.form.discover.value == 'test3, test4'">click
me</a>

...but I can't get it to work. Any suggestions?

Thanks,

Steve
http://www.smarkets.net
Yami King (Guest)
on 2006-04-01 00:30
Steve O. wrote:
> Hi list,
>
> I have a list of tags. I want to be able to click on a tag and have that
> tag
> name populate an input field. I think delicious used to allow you to
> click
> on existing links to tag your bookmark similar to this (moving instead
> to
> auto_complete).
>
> My guess is the code looks something like this....
> <form>
> <input type="text" name="all" id="discover" size="16" value="test1,
> test2"/>
> </form>
>
> <a href onClick="document.form.discover.value == 'test3, test4'">click
> me</a>
>
> ...but I can't get it to work. Any suggestions?
>
> Thanks,
>
> Steve
> http://www.smarkets.net


You need to use document.forms[0].discover.value = 'test3, test4'
if you want it to work with XHTML (to be validated XHTML) use this:

# In the head of the page
<script type="text/javascript">
function oload() {
   if (document.getElementsByTag) {
      anchs = document.getElementsByTag("a");

      for (i = 0; i < anchs.length; i++) {
         if (anchs[i].rel == "fillform") {
            anchs[i].onclick = document.forms[0].discover.value =
"test3, test4";
         }
      }
   }
   else {
      return false;
   }
}

window.onload = oload;
</script>

# In the body of the page
<form>
<input type="text" name="all" id="discover" size="16" value="test1,
test2" />
</form>
<a href="#" rel="fillform">click me</a>


This should work! Have fun ;)
unknown (Guest)
on 2006-04-01 00:36
(Received via mailing list)
Well, first of all, the button should be between the <form> ...
</form> tags (it should work even if not, but lets just be strictly
correct).
Your form needs a name, for example <form name="form1">. Then its'
onClick="document.form1.discover.value = test3, test4" Notice only one
equals, not two? That should sort it out. Hope that's helped.
-N
Steve O. (Guest)
on 2006-04-01 04:43
(Received via mailing list)
Thanks to both of you for the help. Your comments helped steer me in the
right direction.

I'm using the behaviour.js library so has allowed me to simplify it
somewhat. Here is my js:

    '.tag_link' : function(el){
        el.onclick = function(){
            var str = document.tag_form.discover.value + ", " + el.rel
            document.tag_form.discover.value = str;
        }
    },

And my form:

<form name="tag_form">
<input type="text" name="all" id="discover" size="16" value="test1,
test2"/>
<a href="#" rel="mytag1" class="tag_link">click me</a><br />
<a href="#" rel="mytag2" class="tag_link">click me</a><br />
<a href="#" rel="mytag3" class="tag_link">click me</a><br />
</form>

It validates (except for not having an action in the form tag, which
I'll
add in a bit. Does anyone see any problems with this? Seems to work
fine.

Steve
http://www.smarkets.net
unknown (Guest)
on 2006-04-01 06:36
(Received via mailing list)
Nope, can't see a problem with that. If it works for you it should
work for anyone... nothing browser specific there.
-N
This topic is locked and can not be replied to.