Options and input form fields in Inline div not working

[p9939068-2]

I have the following codes:

Click me

The inline div opens, but with 2 problems:
1) modal:false and displayNav:false are ineffective. Clicking on the area outside of the shadowbox still closes it, and it still display the close button at the bottom
2) I have a textarea and text field inside inline_one_div. Although they appear just fine in the shadowbox, you cannot type in them. They are behaving exactly like as if "readonly" is true. This used to work fine before upgrading to version 2.0

Any advise on this is very greatly appreciated.

ps: I *have* to setup and call shadowbox exactly the way I did (inside an anchor's href) because the links are dynamically loaded (AJAX)

[Wizzud]

< a href="javascript:Shadowbox.open({ player: 'inline', modal: false, displayNav: false, content: '#inline_one_div', height: 160, width: 430, title: 'My Title' });" target="_top" rel="nofollow">Click me< /a>

1.

modal and displayNav are options, not properties of the object expected by open().

place them in your init() call instead...

Shadowbox.init({modal:false, displayNav:false}); //plus skipSetup:false? plus others?

2.

try this solution

[p9939068-2]

I found out that problem 2 is related to problem 1. Because I cannot set the option enableKeys to false, shadowbox is recognizing all keystrokes as keyboard navigations! The "solution" is to set enableKeys to false by default in shadowbox.js

I can't use the Shadowbox.init method, because there are other shadowboxes on the same page that require different options. I believe this is a bug though, because it used to work before version 2.0, and the API page clearly states that options can be called in .open().

[Wizzud]

Right...

a. The documentation for the modal option is a**e-about-face. The default is actually false, and to disable click-on-overlay-to-close you have to set modal to true!

b. You are calling open() with an object. You have defined that object as having properties player, displayNav, content, height, width and title. All bar modal and displayNav are valid properties for an object passed into open(), but modal and displayNav are properties of the options object, not the cache object which is what is required by open()!

Define your open() object as...
{player:___, content:___, width:___, height:___, options:{enableKeys:false, displayNav:false}}
...and you should find that keys and navigation are disabled.

This will also work for setting the modal option, but only for media not being displayed as part of a gallery. Once Shadowbox is activated (opened), the functionality governed by the setting of the modal option cannot be changed until Shadowbox is closed and re-opened.

I agree that the use of the word 'options' throughout the documentation is ambiguous, because it can mean slightly different things depending on the context. However, the advanced usage section does give an indication of the properties required/expected of an object passed into open(), even though it misses out the options property (which is an object of options!?).

[p9939068-2]

The syntax {player:___, content:___, width:___, height:___, options:{enableKeys:false, displayNav:false}}  works! Thank you very much!! :)

[nazerry]

i'm sorry. i have the same problem, i tried to follow instructions in this thread, but i still can't get it right.  can you please show the working code? (n00b version please )

[p9939068-2]

Hmmm depends if you want to call it separately inside a <script> element, or call it inside the anchor's href.

[nazerry]

i call it in anchor href
a href="javascript:Shadowbox.open({ player: 'inline', content: '#box', height: 750, width: 650, title: 'My Title', option:{enableKeys:false,displayNav:false} });" target="_top" rel="nofollow"

i use the default <script> element.
<script type="text/javascript">
Shadowbox.loadSkin('classic', '<?php bloginfo('template_url');?>/script/shadowbox/skin');
Shadowbox.loadLanguage('en', '<?php bloginfo('template_url');?>/script/shadowbox/lang');
Shadowbox.loadPlayer(['flv', 'html', 'iframe', 'img', 'qt', 'swf', 'wmp'], '<?php bloginfo('template_url');?>/script/shadowbox/player');

window.onload = Shadowbox.init;
</script>

please help.

[nazerry]

to be precise, my problem is i can't type anything in input/textarea.

[Wizzud]

It's options:{...} (plural), not option:{...}

[nazerry]

thank for the reply.

oh my bad! that problem fixed! thank you!
but i have new problem.

i'm making shadowbox to popup my shoutbox.
now that i can type in the input/textarea, when i click on smilieys or the submit button, nothing happen.

please help

[p9939068-2]

Shot in the dark: if you're using an inline div, make sure the form is *inside* the hidden div, not encapsulating it.

[Wizzud]

One thing to be wary of - and I don't know if it applies to you or not - is that when using 'inline' code in Shadowbox, the 'inlined' code cannot contain any elements with an id, and any events that have been attached using script will not work within the Shadowbox.
This is because Shadowbox takes a copy of the inline HTML. If any copied element has an id, then you have 2 elements with the same id and browsers will get confused because ids are supposed to be unique - generally, browsers tend to still find the original element when asked (getElementById) but there is no guarantee. Also because of the copy, any events (not things like onclick='___', but addEventListener/attachEvent(___) calls) will stay with the original elements, not the copied elements.

[mkellyxp]

Yes yes.  I had the same problem and just turned off Enable Keys.  Worked like a charm

Line 269:
enableKeys:         false,