jQuery Forum

I'm finding that closing a non-modal dialog by pressing escape closes
other open dialogs too, in some cases but not all. Has anyone else run
into this? Any solutions?
As a guess, maybe non-modal dialogs should cancel that event before
closing.

For some reason, I can no longer reply to this thread, maybe because
it's too old:
http://groups.google.com/group/jquery-ui/browse_thread/thread/09477946d06ea795/e97a9c42b619e246#e97a9c42b619e246
Question is the same: Is there any chance of getting support for fixed
position dialogs any time soon?
I tried the workaround Patrick suggested, but ran into various issues,
incl pieces of the dlg scrolling with the window while other parts
didn't, and other anomalies.
Thanks for reading,

I have a list of records that may be taller than the screen by a lot.
I'm using Dialog to show a non-modal edit form when the user clicks
Edit links in the list.
The problems are that a) if the list is tall and the user is scrolled
down the page when they open it, it opens at the top of the screen,
out of sight, and b) if it's open and they scroll the list, the dlog
scrolls up out of sight too.
I've tried setting position:top in Dialog options, and that does get
it to open at the top of the visible part of the window, solving (a),
but it still scrolls out of sight as in (b).
I also tried setting position:fixed in the dlg's css, which fixes (b),
but the further down the user is scrolled when the dlg opens, the
further down the dlg opens initially. If you're scrolled far enough,
it doesn't appear, or more likely, appears in some alternate dimension
where I can't see it, no matter where I scroll.
Doing both of the above together acts like the css-only solution.
Is there any way to cause the dlg to stay in a fixed position (has to
be css position:fixed I think), but still have it open in a useful
place on the screen when not scrolled to the top?
Thanks,
s

Is it possible to dynamically update the text displayed on a tab?
The only way I could see was something like this:
$('#myTabs').data('tabs.tabs').$tabs[4].firstChild.innerHTML = 'New
Tab Text';
Is there a cleaner approach?
BTW, I tried deleting and re-adding the tab, but the new tab doesn't
get the 'ui-tabs-nav-item' class applied, so it doesn't look at all
tab-like, at least using a modified theme builder theme. Is there
something special that needs to be done for this to work correctly? Or
am I misunderstanding how to use tabs.add() ?
Thanks,
s

I'm looking specifically for a fix to Dialog that I believe is in
1.5.1, but both the builder and dev bundle downloads today offer
1.5.2, which as far as I can tell hasn't been released, and is giving
me problems. Is there any way to download a customized minified
version of 1.5.1 any more?
I'm asking specifically because I get a fatal error with tab code that
works fine in 1.5.0, using jquery 1.2.6 as before. Top part of the
stack trace is this, but I doubt that's very useful:
data(undefined, "load.tabs", undefined)
tabify(true)
init()
Code is complex, not easy to communicate, so for the moment I'm just
trying to get past this apparently new issue.
Thanks for any news,
s

$('#editTabs').tabs
(
    {
        spinner: '',
        load: onTabLoad,
        select: onTabSelect,
        selected: null,
        cache: false,
        fx: {opacity: 'toggle'},
        ajaxOptions: {cache: false}
    }
);
function onTabSelect (options)
{
    var selTab = options.options.selected;
    console.log('onTabSelect', selTab, options);
}
The info logged to the firebug console shows selTab having the index
of the previously selected tab, ie the one selected before this click.
Is that intentional? Is there a way to find out the index of the just-
clicked tab from there?
(Oddly enough, when I drill down into the console dump of the entire
options structure, options.options.selected shows the index of the
newly clicked tab. It seems like the callback gets the old data, and
the act of drilling down in firebug evaluates the options expression
right at that time, getting the state of the tabs object after the
click has taken effect.)
The same code called from the load callback shows the correct data.
Practically speaking, I can do what want to do from there, so this is
a moot point, sort of, but it makes me feel like I may be missing part
of how this is supposed to work.
Thanks again, as always.

I very much like that dialogs dismiss when you press escape; it's very
natural.
However, if you have two dialogs stacked, escape closes both of them.
This isn't so good in my case. The first is a complex edit dlg with
potentially lots of unsaved changes, and the second (topmost) one is a
validation failure alert. The user would want to dismiss the
validation complaint, only, and be left with the edit dlg still there.
So:
- Is it considered a bug that they all dismiss, not just the topmost
one? I would think so, but it's not my design.
- Any suggestions for overriding this behavior in a simple way?
Thanks, as always,

I need to send at least one dynamic parameter as part of the url used
to load ajax data into various tabs, like this:
<a href="?cmd=Type.edit&typeID=[typeID]">Status</a>
...where '[typeID]' needs to be replaced by the actual ID of the item.
What's the best approach?
I tried using javascript urls for the tab hrefs, but no joy.
When I look at the tab urls in the dom after the tabs() call, my
original ons are gone, replaced with ones like this:
<a href="#ui-tabs-40">Status</a>
The tabs plugin must have removed the orignals and attached events
that use these.
Thanks,

Just getting started w jQuery UI and tabs, so excuse if this is basic
and obvious...
My tab html follows the structure of the sample pretty exactly:
<li><a href="#tab_details"><span>Details</span></a></li>
<li><a href="#tab_docs"><span>Docs</span></a></li>
Contrary to what I'd expect, the url hash doesn't change when you
click a tab. An even handler must be getting installed that intercepts
the actual link.
Not sure if back/forward or bookmark-recall would show the related tab
if you navigated to a hash-ful url, but you can't code that yourself
if hash changes are suppressed.
Thoughts?

I'm looking into using Dialog as a replacement for simple alerts, but
at least the way I'm currently doing it, it's very slow. The target
dom object is just an empty div with an ID. Preliminary code is this:
----
jQuery.fn.alert = function(msg, title)
{
    $('#dlg').html('<pre><span>' + msg + '</span></pre>').dialog
    (
        {
            title: title ? title : 'Application Alert',
            buttons: {OK: function(){$(this).dialog('close');}},
            modal: true,
            overlay: {background: '#000', opacity: 0.1},
            width: 450,
            height: 250
        }
    );
};
----
The reason I'm creating the dlg every time is that other code will use
this same div with different options. Is there some way to change
options dynamically once the dialog object is instantiated? Some other
approach?
The above code looks like it works, but creates a new '<div class="ui-
dialog ui-draggable ui-resizable"...' each time, clearly wrong. I
thought I should maybe call destroy instead of close, but that leaves
the content completely blank next time; the original div#dlg still
exists in the dom, but it's hidden.
Re performance, in my particular test case, an ajax round trip
followed by a browser-native alert takes under a second. Using the
above dialog code instead, it takes 5-7 seconds for the alert to
appear. Both results are repeatable, on a fairly fast machine.
That's a huge difference, enough to completely negate the minimalism
of using ajax instead of a full server submission. Do other people see
anything like this? Is dialog so full featured that it's really this
degree of heavy? If so, it might be worth it for big-deal fancy edit
dlgs and such, but no way for simple alerts, pretty as they may be,
and consistent with other themed UI.
Or is it the code that's slowing this down? (Doubt it matters, but I'm
using a slightly modified version of one of the theme roller themes.)

Has anyone found an effective way of getting a dialog to resize itself
automatically to hold arbitrary passed content?
I have a function that's an alert replacement, which places passed
text inside a span inside a pre element in a dialog. The span itself
appears to be the width required to hold its content, but the
surrounding pre and several levels of enclosing div limit how much of
it actually shows.
Any thoughts or prior art?
Thanks much,

It looks to me like when you do this:
$.ajax('someURL', {cache: false})
...jQuery adds a random string to the submitted params, to avoid
browser caching. This is the behavior I want.
But if you do this:
$.ajax('someURL', {cache: false, type: 'post'})
..the random string isn't there.
Is this intentional? Is something different required to set that up
for post requests?
(I'm unable to reach the docs wiki at the moment, connection resets.)
Thanks

[Apologies if this shows up twice; didn't see it after 5 hours+, sending again]
I have some server-side code that responds to certain ajax requests by
returning the html of new rows to insert into an existing table. This
works really well, but I've been thinking about ways to handle
"errors" on the server side. By "errors" I mean both actual bugs, and
business rule violations that mean you can't save a record (for
instance).
Prior ajax apps I've done have returned xml data that gets rendered by
the client, not html. Each response has both data and status sections,
and status does nicely for passing back errorCode, errorText, and
errorDetails.
In my current case, the expected ajax response is pretty specific dom
content -- a set of table rows, as html. It can't just suddenly be the
html of a failure alert, or an xml or json data structure, at least
not with establishing some conventions about how the client can know
that that's what it is.
If we want to stay in the html-response domain, I was thinking of
having two classes of non-dom-insert response, indicated by containing
the response in a div with an agreed-upon css class. So if the
response starts with <div class="ajaxMsg">, the client should present
it as an unobtrusive msg to the user (jGrowl etc), instead of doing
whatever it usually does with these responses. Similarly, if it starts
with <div class="ajaxError">, it should be presented as a blocking,
in-your-face "dialog".
An alternative would be for the server no to return html in these
cases, but instead return xml or json with some agreed-upon structure,
which the client would then package visually. That would standardize
the structure and appearance of these msgs, instead of relying on
server-side code to always return similar-looking content (you could
standardize that on the server side instead), at the cost of encoding
the info on the server and decoding it on the client, and some
restriction on the structure of what you could return.
A third alternative, similar to the xml/json strategy, would be for
the server to deliver error/msg content as http headers, a "parallel
channel" alongside the expected html. That's super easy to do on the
server (ColdFusion back end), but so far, I haven't figure out how to
access the http headers in a jQuery ajax response. (There's a separate
thread here about this, no responses yet.)
How do you folks generally handle this? Any best practices to follow,
minefields not to fall into? Anything at all standard in jQuery, or
the jQuery community?
Thanks.

I have some server-side code that responds to certain ajax requests by
returning the html of new rows to insert into an existing table. This
works really well, but I've been thinking about ways to handle
"errors" on the server side. By "errors" I mean both actual bugs, and
business rule violations that mean you can't save a record (for
instance).
Prior ajax apps I've done have returned xml data that gets rendered by
the client, not html. Each response has both data and status sections,
and status does nicely for passing back errorCode, errorText, and
errorDetails.
In my current case, the expected ajax response is pretty specific dom
content -- a set of table rows, as html. It can't just suddenly be the
html of a failure alert, or an xml or json data structure, at least
not with establishing some conventions about how the client can know
that that's what it is.
If we want to stay in the html-response domain, I was thinking of
having two classes of non-dom-insert response, indicated by containing
the response in a div with an agreed-upon css class. So if the
response starts with <div class="ajaxMsg">, the client should present
it as an unobtrusive msg to the user (jGrowl etc), instead of doing
whatever it usually does with these responses. Similarly, if it starts
with <div class="ajaxError">, it should be presented as a blocking,
in-your-face "dialog".
An alternative would be for the server no to return html in these
cases, but instead return xml or json with some agreed-upon structure,
which the client would then package visually. That would standardize
the structure and appearance of these msgs, instead of relying on
server-side code to always return similar-looking content (you could
standardize that on the server side instead), at the cost of encoding
the info on the server and decoding it on the client, and some
restriction on the structure of what you could return.
A third alternative, similar to the xml/json strategy, would be for
the server to deliver error/msg content as http headers, a "parallel
channel" alongside the expected html. That's super easy to do on the
server (ColdFusion back end), but so far, I haven't figure out how to
access the http headers in a jQuery ajax response. (There's a separate
thread here about this, no responses yet.)
How do you folks generally handle this? Any best practices to follow,
minefields not to fall into? Anything at all standard in jQuery, or
the jQuery community?
Thanks.

I need to build a new app right now. Some of what's in UI would be
helpful, and it seems wise to use the most recent and standard
technology (rather than third-party plugins), if it's stable.
However, my impression is that issues and fixes are still pretty
frequent, and I have no sense of a final release will happen.
I hate to ask, but is UI stable enough, *now* to build into a
production app? If not, any idea how soon it would get there?
Thanks.

Hi all,
I know that jquery's ajax calls set the X-Requested-With header to
'XMLHttpRequest' for ajax requests, making it really easy for the
server side to detect them.
Is there any way for jquery to read the http headers out an ajax
response back from the server? I can see the ones I'm interested in in
the firebug console, but when I dump the XMLHttpRequest object out
from inside my ajax complete method, I don't see them anywhere.
Does jquery provide any tools for this? Is it possible at all in
javascript?
Thanks

Hi folks, simple question I think.
Given this html:
<p id="foo">THIS IS THE TEXT I WANT<span class="bar> not this</span>
or this

...how do you access the text 'THIS IS THE TEXT I WANT' through
jQuery?
In DOM-speak, it's this:
document.getElementById('foo').childNodes[0].nodeValue
This finds span.bar, as I expected, but not what I want:
jQuery('#zzz :first')
Problem is that I want the text of the first child node, not the first
child element.
Thanks,