0

I'm trying to create a simple extension for personal use. It's partially from laziness, and partially from an urge to learn. I've never made extensions before, but I've been looking at the documentation. Now I just need to write the code. What I'm trying to do, is when the browser loads a certain page, to insert text into a specific form. The form is as follows

<div id="set_tags" class="advanced_option"> 
   <label for="post_tags" class="inline_input_label" id="post_tags_label"
       onclick="Element.remove($(this))" 
       style="left:8px; right:auto; text-align:left">tags</label> 
   <input id="post_tags" name="post[tags]" type="text"/> 
 </div> 

I haven't worked much with javascript, so is there a way to add the text "Music" to this when the page is loaded?

James Black
  • 41,583
  • 10
  • 86
  • 166
Tommy
  • 365
  • 1
  • 5
  • 7

3 Answers3

1

You can use the onload function to start your function. http://javascript.about.com/library/blonload.htm

Since you are new to javascript you may want to get familiar with unobtrusive javascript (http://www.onlinetools.org/articles/unobtrusivejavascript/chapter4.html) which I find is a better way to write javascript, as you can then easily comment out javascript and see how it works when that is disabled. But, it would be easier to learn this in the beginning.

To get the input tag you can use document.getElementById() which would be something like:

var elem = document.getElementById('post_tags');

Then, to add text to this field there should be a value property in your input definition above, and you would just do:

elem.value = "Music";
James Black
  • 41,583
  • 10
  • 86
  • 166
0
document.getElementById("post_tags_label").appendChild(
    document.createTextNode("Music"));

I'm assuming that you want to put it at the end of the element post_tags_label.

thejh
  • 44,854
  • 16
  • 96
  • 107
  • This looks like it should work, but the problem is the onclick function that removes anything within post_tags_label. Could I put it in the input area "post_tags" instead? – Tommy Nov 07 '10 at 21:15
  • @Tommy: Yes. But afaik it doesn't delete the content but the whole element. – thejh Nov 07 '10 at 21:55
0

This is really easy to do if you use GreaseMonkey. It's perfect for personal changes you want to make to web pages, etc.

Robusto
  • 31,447
  • 8
  • 56
  • 77
  • I don't think this really answers the question though. You may want to show an example of how you could use GreaseMonkey to do this, and then you are limited on browser support, I believe. – James Black Nov 07 '10 at 21:37
  • @James Black: He did say "laziness" was an issue for him, which militates against the effort it would take to learn to write extensions. As for its limitation to supported browsers, he also said it is for "personal use." And as for the GreaseMonkey script needed to accomplish the task, it's one line: `document.getElementById('post_tags').value = "Music";` He can find out about GreaseMonkey at http://outgoing.mozilla.org/v1/1e29ffc6315f207894916da52f1a3e5dd51b7e77/http%3A//www.greasespot.net/, where he can read the tutorial. – Robusto Nov 07 '10 at 23:44
  • The javascript code would work on a web page as well as GreaseMonkey, but just pointing out a technology with no context may be of limited help, that was all. – James Black Nov 08 '10 at 13:25