#198 new
Ciprian Pop

Ajax.InPlaceEditor bug on cancel in IE7

Reported by Ciprian Pop | April 28th, 2009 @ 02:52 PM

Problem: - in IE7 when cancelling the InPlaceEditor using a cancel button (not a link) you get a javascript error "tagName is null or not an object"

Reason: - the cancel button is created with type "submit" and IE calls also the boundSubmitHandler after calling the boundCancelHandler (trying to make a submit on a form that doesn't exist anymore)

How to fix: -file controls.js @@ -516,11 +516,15 @@

 var text = this.options[mode + 'Text'];
 if ('button' == control) {
   var btn = document.createElement('input');

  • btn.type = 'submit';
  • btn.value = text; btn.className = 'editor' + mode + 'button';
  • if ('cancel' == mode)
  • if ('cancel' == mode) {
  •  btn.type = 'button';
     btn.onclick = this._boundCancelHandler;
    
    
  • } else {
  • btn.type = 'submit';
    
    
  • }
  • btn.value = text;

scriptaculous v 1.8.2 IE 7.0.5730.11 Win XP SP3

Comments and changes to this ticket

  • james robson

    james robson April 29th, 2009 @ 04:29 PM

    • Tag changed from controls.js, ie, inplaceeditor to controls.js, ie, inplaceeditor

    I've attempted this change but still get an error.

    the error relates to the changing of the btn.type from 'submit' over to 'button' when the cancel == mode is detected.

    the error states that IE7 cannot get the type property.

    if I "change" it to btn.type = 'submit (i.e I'm not actually changing it's type) it "works" without that error.. however trying to set it's type ot anything else does not work..

    James

  • Ciprian Pop

    Ciprian Pop April 30th, 2009 @ 09:45 AM

    Sorry, the patch formatting went wrong on the ticket system (missing - for deleting lines and + for adding lines).

    In IE you can assign the type to a button only once. So the line "btn.type = 'submit';" should be removed before the if... else.

    Here another try of the patch (hoping a good formatting this time):

    controls.js @@ -517,9 +517,13 @@

    
         if ('button' == control) {
           var btn = document.createElement('input');
    -      btn.type = 'submit';
    +      btn.className = 'editor_' + mode + '_button';
    +      if ('cancel' == mode) {
    +        btn.type = 'submit';
    +        btn.onclick = this._boundCancelHandler;
    +      } else {
    +      	btn.type = 'submit';
    +      }
           btn.value = text;
    -      btn.className = 'editor_' + mode + '_button';
    -      if ('cancel' == mode)
    -        btn.onclick = this._boundCancelHandler;
    +      
           this._form.appendChild(btn);
           this._controls[mode] = btn;
    
  • james robson

    james robson May 11th, 2009 @ 11:31 AM

    Hi, That still does not I'm afraid..

    curretn version (based on your post:

    createControl: function(mode, handler, extraClasses) {

    var control = this.options[mode + 'Control'];
    var text = this.options[mode + 'Text'];
      if ('button' == control) {
       var btn = document.createElement('input');
    
    

    // btn.type = 'submit'; btn.className = 'editor' + mode + 'button'; if ('cancel' == mode) { btn.type = 'submit'; btn.onclick = this._boundCancelHandler; } else { btn.type = 'submit'; }

       btn.value = text;
    
    

    //btn.className = 'editor' + mode + 'button'; // if ('cancel' == mode) // btn.onclick = this._boundCancelHandler;

       this._form.appendChild(btn);
    
    } else if ('link' == control) {
      var link = document.createElement('a');
      link.href = '#';
      link.appendChild(document.createTextNode(text));
      link.onclick = 'cancel' == mode ? this._boundCancelHandler : this._boundSubmitHandler;
      link.className = 'editor_' + mode + '_link';
      if (extraClasses)
        link.className += ' ' + extraClasses;
      this._form.appendChild(link);
      this._controls[mode] = link;
    }
    
    

    },

    original version:

    createControl: function(mode, handler, extraClasses) {

    var control = this.options[mode + 'Control'];
    var text = this.options[mode + 'Text'];
    if ('button' == control) {
      var btn = document.createElement('input');
      btn.type = 'submit';
      btn.value = text;
      btn.className = 'editor_' + mode + '_button';
      if ('cancel' == mode)
        btn.onclick = this._boundCancelHandler;
      this._form.appendChild(btn);
      this._controls[mode] = btn;
    } else if ('link' == control) {
      var link = document.createElement('a');
      link.href = '#';
      link.appendChild(document.createTextNode(text));
      link.onclick = 'cancel' == mode ? this._boundCancelHandler : this._boundSubmitHandler;
      link.className = 'editor_' + mode + '_link';
      if (extraClasses)
        link.className += ' ' + extraClasses;
      this._form.appendChild(link);
      this._controls[mode] = link;
    }
    
    

    },

  • james robson

    james robson May 11th, 2009 @ 11:48 AM

    ok this is my current code which is still erroring:

    
        if ('button' == control) {
          var btn = document.createElement('input');
          //btn.type = 'submit';
    	 btn.className = 'editor_' + mode + '_button';
    		if ('cancel' == mode) {
     			btn.type = 'submit';
    			btn.onclick = this._boundCancelHandler;
    		} else {
     			btn.type = 'submit';
    		 }
    		 
    		 
          btn.value = text;
         //if ('cancel' == mode)
            //btn.onclick = this._boundCancelHandler;
          this._form.appendChild(btn);
          this._controls[mode] = btn;
        }
    
    
  • Ciprian Pop

    Ciprian Pop May 11th, 2009 @ 11:50 AM

    Hi James

    Here's the complete updated version of the createControl function. I've tested it on IE7 and IE8 and it works fine. It's already live on our site.

    
    createControl: function(mode, handler, extraClasses) {
        var control = this.options[mode + 'Control'];
        var text = this.options[mode + 'Text'];
        if ('button' == control) {
          var btn = document.createElement('input');
          btn.className = 'editor_' + mode + '_button';
          if ('cancel' == mode) {
            btn.type = 'button';
            btn.onclick = this._boundCancelHandler;
          } else {
          	btn.type = 'submit';
          }
          btn.value = text;
          
          this._form.appendChild(btn);
          this._controls[mode] = btn;
        } else if ('link' == control) {
          var link = document.createElement('a');
          link.href = '#';
          link.appendChild(document.createTextNode(text));
          link.onclick = 'cancel' == mode ? this._boundCancelHandler : this._boundSubmitHandler;
          link.className = 'editor_' + mode + '_link';
          if (extraClasses)
            link.className += ' ' + extraClasses;
          this._form.appendChild(link);
          this._controls[mode] = link;
        }
      },
    

Please Sign in or create a free account to add a new ticket.

With your very own profile, you can contribute to projects, track your activity, watch tickets, receive and update tickets through your email and much more.

New-ticket Create new ticket

Create your profile

Help contribute to this project by taking a few moments to create your personal profile. Create your profile ยป

script.aculo.us is an open-source JavaScript framework for visual effects and interface behaviours.
<br/><b>Source available from github</b>
The Git repository resides at:
<a href="http://github.com/madrobby/scriptaculous">http://github.com/madrobby/scriptaculous</a>
<br/>Check out the current development trunk with:
<code>git clone git://github.com/madrobby/scriptaculous.git</code>
<br/>As <b>script.aculo.us 1.xx is feature-frozen</b>, this development trunk is for <b>bugfixes only</b>.
<br/>New development should happen only for
<b>script.aculo.us 2</b>.
<br/><b>Creating a bug report</b>
When creating a bug report, be sure to include as much relevant information as possible. Post a an example that shows off the problem. Preferably, <b>alter the unit tests</b> and show through either changed or added tests how the expected behavior is not occuring.

People watching this ticket

Pages