Hi folks!

I'm trying to add a new button to the post form so my users can upload images to an external image host, and paste the resulting bbcode in their posts. This is the simple button code I want to add; it just pops open a window containing the upload form of an image host:

<input onclick="window.open('http://www.imagebam.com','imagebam','location=0,status=0,scrollbars=1,width=685,height=640')" value="+ Add Image To Post" type="button">

And this mockup shows where I'd like the button to appear on the post form, just before the Submit & Preview buttons:

Here's the bit of script I've been trying, which I "borrowed" from this topic over at stackoverflow: https://stackoverflow.com/questions/612 … javascript

<script type="text/javascript">
function add() {
    var element = document.createElement("input");
    var p = document.getElementsByName('preview')[0].parentNode;
    element.setAttribute("type", "button");
    element.setAttribute("value", "+ Add Image To Post");
    element.setAttribute("name", "addimage");
    element.setAttribute("onclick", "window.open('http://www.imagebam.com','imagebam','location=0,status=0,scrollbars=1,width=685,height=640')");
    document.post.appendChild(element);
}
</script>

Unfortunately, I'm very good at copy/paste, but not so good at writing up new scripts. Can anyone help me to get this new button into the form please?

Thanks to all!

Added after 1 hour 9 minutes 12 seconds:

UPDATE - Took a different approach and got better results with this code:

<script type="text/javascript">
var button = document.createElement("button");
button.innerHTML = "+Add Images To Post";

var body = document.getElementsByTagName("body")[0];
body.appendChild(button);

button.addEventListener ("click", function() {
  window.open('http://www.imagebam.com','imagebam','location=0,status=0,scrollbars=1,width=685,height=640');
});
</script>

That successfully appends the desired button at the end of the body element. However, try as I might, I haven't been able to get the button inserted into the form element, or preferably the p.formsubmit element inside it, as shown in my mockup above.

I've tried with getElementById, getElementsByClassName, getElementsByName, etc with no luck.

Could still use some help getting the button to appear in the correct container.

Last edited by Buzzer (2017-03-04 11:49:23)