Search code examples
jqueryhtmlfancybox

FancyBox text inputs disabled


I have just started using FancyBox and am currently trying to create a series of input fields within. I have found with the following code (extremely trimmed down to try and figure out what is wrong) that when the FancyBox displays, the input[type='text'] element is not editable and I am not sure why.

HTML Markup:

<div id="divFancyBoxTest">
    <input type="text" id="something" value="test" />
</div>

JS:

$.fancybox.open($("#divFancyBoxTest"));

..In the following image the input control is not accessible.

enter image description here

Does anyone know why this is? I have been poring over all CSS and related code and I can't figure out why this is happening.

fancyBox v2.1.4


Solution

  • Take a look at this: http://jsfiddle.net/steelywing/uZCC6/2263/

    $.fancybox.open([{
        content: $('#divFancyBoxTest').html(),
        title: 'Input box'
    }, ], {
        padding: 0
    });