Rich-text Reply

Moving, resizing or arranging a disabled form field

BenH 04-24-14

Moving, resizing or arranging a disabled form field

Hi,

 

I am unable to edit a disabled form field in my page variation. The normal Optimizely blue outline and context menu are not available. Is this a limitation of the system or is there another to rearrange or move a disabled form field?

 

TIA,

 

BenH

Level 1

MJBeisch 04-25-14
 

Re: Moving, resizing or arranging a disabled form field

Disabling a form field prevents user action on that field. From "how a browser deals with that" standpoint, this also usually means that the browser itself doesn't fire events related to user interaction on that field; ie. ignoring mouse hover state, etc. Thus, it's not so much an Optimizely issue as it is that's just how a browser handles dealing with a disabled form field. This may not be 100% true for all browsers, and/or there's something specifically unique to the code on your site causing it.

You can still make changes to the field, but you have to manually write the code into the code editor. Click the little "<edit code>" tab in the bottom right of the experiment editing page. Note that the code in there is specific to the variation that you're currently viewing. The code editor accepts javaScript & jQuery. If you don't have enough experience/knowledge to write the code yourself, explain the changes that you're trying to make and someone should be able to help.
Matt Beischel - E-Commerce Optimization Specialist CohereOne

Level 2
Gus 04-25-14
 

Re: Moving, resizing or arranging a disabled form field

[ Edited ]

EDITED:

 

Just for the record, the editor can deal with disabled input text fields, and the context menu appears too in Chrome and IE. Firefox is showing the outline but not the context menu ( in my case) when the field is disabled, but if you remove the 'disable' attribute and apply, you can see the context menu too.

 

So you can write this in the code box:

$(selector).removeAttr('disabled')

 

Apply it, and then edit as usual. After that, remove that line from your box code and apply again.

Gus Ces
/Web (developer|analyst|CRO specialist)/g

Gus
Level 2