SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Zealot rhlowe's Avatar
    Join Date
    Sep 2006
    Location
    San Diego
    Posts
    116
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE says: Object doesn't support this action

    I am creating a form in JavaScript. Why I am doing this is because the proprietary CMS I have to work in is not very friendly and I cannot just add the html therein, so I am attempting to circumvent the CMSs limitations with JavaScript.


    Near the end of the part that actually creates the form, I have this:

    Code:
    var formElement3 = document.createElement('button');
    formElement3.id = 'conversionButton';
    formElement3.value = 'convert';
    formElement3.name = 'submit';
    formElement3.type = 'button';
    formElement3Text = document.createTextNode('convert');
    formElement3.appendChild(formElement3Text);
    theFormWDiv.appendChild(formElement3);
    I create a button tag, add it's attributes, append it's text and then append it to the form, simple enough. This works perfect in Firefox, but IE6 throws me an error "Object doesn't support this action" on Line 116, which just so happens to be this line:

    Code:
    formElement3.type = 'button';
    Now, I have tried both 'button' and 'submit' for that value and neither work and I cannot not define a value because that throws a different error later in the code. Any idea what might be going on?

    Thanks!
    San Diego Freelance Web Development Contractor
    Great Taste, no Filler. Now with no Trans Fat!

  2. #2
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    have you not noticed that the 6th line is:

    formElement3Text = ...

    rather than

    formElement3.Text = ...

    Plus for buttons the value is the text that is shown.


  3. #3
    SitePoint Zealot rhlowe's Avatar
    Join Date
    Sep 2006
    Location
    San Diego
    Posts
    116
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    formElement3Text is a variable containing the text node to be appended to formElement3. The error I keep getting is in reference to: formElement3.type = 'button';.
    San Diego Freelance Web Development Contractor
    Great Taste, no Filler. Now with no Trans Fat!

  4. #4
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ah, sorry. Why set a button to a type button. Its only when creating an input that you need to use the type.


  5. #5
    SitePoint Guru
    Join Date
    Apr 2006
    Posts
    802
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    a button element doesn't use a value or type.
    if you are trying to make an input element do it this way:

    var formElement3 = document.createElement('input');
    formElement3.type = 'button';
    formElement3.id = 'conversionButton';
    formElement3.value = 'convert';
    formElement3.name = 'submit';

    the value will be the text on the button,
    but the name won't make it submit a form- for that you need to set the type="submit".

  6. #6
    SitePoint Zealot rhlowe's Avatar
    Join Date
    Sep 2006
    Location
    San Diego
    Posts
    116
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I could very well be reading the w3c spec wrong, but I got the distinct impression that the button element does support the value and type attributes.

    Regardless, I tried it as an input element and still got an error at formElement3.type = 'button';
    San Diego Freelance Web Development Contractor
    Great Taste, no Filler. Now with no Trans Fat!

  7. #7
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    IE has issues. Why do you want to use a <button> anyway? Why not use a <input type="submit">?
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  8. #8
    SitePoint Zealot rhlowe's Avatar
    Join Date
    Sep 2006
    Location
    San Diego
    Posts
    116
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Issues

    Quote Originally Posted by Kravvitz View Post
    IE has issues. Why do you want to use a <button> anyway? Why not use a <input type="submit">?
    Man, tall me about it. I prefer <button>s to <input>s for buttons jest because it allows me to separate input boxes from action items in my forms without any additional Classes or Ids. That said, I tried the script with both a <button> and an <input> and it didn't work either way...
    San Diego Freelance Web Development Contractor
    Great Taste, no Filler. Now with no Trans Fat!

  9. #9
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    just for testing purposes i created the following and it works in IE and FF perfectly fine.

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
            <title>Untitled Document</title>
            <link rel="stylesheet" type="text/css" media="screen" />
            <script type="text/javascript">
                var i = 0; // just for test purposes;
                function addNewButton() {
                    var parent = document.getElementById('container');
                    var newElement = document.createElement('input');
                    newElement.type = 'button';
                    newElement.id = 'button_' + i;
                    newElement.value = 'button ' + i;
                    newElement.onclick = function() {
                        alert('I am ' + this.id);
                    };
                    parent.appendChild(newElement);
                    i++;
                }
            </script>
        </head>
        <body>
            
            <input type="button" onclick="addNewButton();" value="Add" />
            <div id="container"></div>
    
        </body>
    </html>



Bookmarks

Posting Permissions

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