CODEWITHSUNDEEP
javascriptjquery
dlofrodloh
dlofrodloh

Reputation: 1744

Button not working when placing it with javascript

I've got a file upload button which works absolutely fine when I put it directly into the HTML body with

<input type="button" id="uploader" value="Upload">

But when I try and place it in a div using javascript the button appears in the right place but no longer works when you press it:

centerWindow.innerHTML="<input type='button' id='uploader' value='Upload'>";

The script for making the button upload a file is the following:

   <script type="text/javascript"> 
              var element = document.getElementById('uploader');
              upclick(
                  {
                  element:element, 
                  action: '/mailer/file_upload.php', 
                  onstart: 
                    function(filename) 
                    {
                      alert('Uploading: '+filename);
                    },
                  oncomplete:
                    function(response_data) 
                    {
                      alert('Data upload complete.');
                    }
                  } 
              );
    </script>

How can I fix this?

Upvotes: 2

Views: 80

Answers (2)

howderek
howderek

Reputation: 2244

You have to have your upclick() called after the button is part of the DOM, where right now I believe you are calling it before

//code to make button
var element = document.createElement('input');
element.value = 'Upload';
element.id = 'uploader';
element.type = 'button';
document.body.appendChild(element);
upclick({
    element: element,
    action: '/mailer/file_upload.php',
    onstart: function (filename) {
        alert('Uploading: ' + filename);
    },
    oncomplete: function (response_data) {
        alert('Data upload complete.');
    }
});

Demo: http://jsfiddle.net/howderek/tCcQL/

Upvotes: 1

Ammog
Ammog

Reputation: 124

Place the button inside the html directly like you did before. Style it to have visibility:hidden with css. Use JS to make it visible when you want it visible.

Your script will work fine with this

Upvotes: 0

Related Questions