[jQuery] Re: keyup() fires multiple times?
Looks like the problem is OS-specific. In Ubuntu 9.10, for example,
there is an option that is enabled by default in the user's keyboard
preferences
which causes key-holds to simulate multiple key-presses. Turning this
off results in the expected behavior. On Windows, the default behavior
is for key-holds to behave like key-holds so no problem exists.
Any suggestions for normalizing behavior across platforms?
Keith
On Jan 5, 3:38 pm, Keith Hughitt keith.hugh...@gmail.com wrote:
Hi all,
I'm creating a method for the first time which causes some action to
happen while a key is pressed. I've noticed, however, that the 'keyup'
event which I would normally use to determine when the key is
released is fired continually, even when the key is still being
pressed.
e.g.
!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN http://www.w3.org/
TR/html4/strict.dtd
html
head
titlejQuery Keyup Test/title
script src=http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/
jquery.js type=text/javascript/script
/head
body
script type=text/javascript
$(function () {
$(document).keydown(function (e) {
console.log(keydown);
}).keyup(function (e) {
console.log(KEYUP);
});});
/script
/body
/html
Instead of seeing keydown, keydown...keydown, KEYUP. It
switches back and forth between the two continually. So far I've
tested the same demo in FF 3.5, 3.7 and Chrome 3.x.
Any ideas?
Thanks!
[jQuery] keyup() fires multiple times?
Hi all,
I'm creating a method for the first time which causes some action to
happen while a key is pressed. I've noticed, however, that the 'keyup'
event which I would normally use to determine when the key is
released is fired continually, even when the key is still being
pressed.
e.g.
!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN http://www.w3.org/
TR/html4/strict.dtd
html
head
titlejQuery Keyup Test/title
script src=http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/
jquery.js type=text/javascript/script
/head
body
script type=text/javascript
$(function () {
$(document).keydown(function (e) {
console.log(keydown);
}).keyup(function (e) {
console.log(KEYUP);
});
});
/script
/body
/html
Instead of seeing keydown, keydown...keydown, KEYUP. It
switches back and forth between the two continually. So far I've
tested the same demo in FF 3.5, 3.7 and Chrome 3.x.
Any ideas?
Thanks!
[jQuery] Re: Help with Datepicker
You also need to tell it to use a button to trigger the popup using
the showOn setting. Set it to 'button' to only popup on the button
click and not on focus, or 'both' to show on either.
('#MembershipWizard1_Wizard1_ctl05_ClubConfirmation1_txtStartDate').datepicker
({ dateFormat: 'dd/mm/yy',gotoCurrent: true,minDate: 0, showOn:
'both', buttonImage:
'App_Themes/Images/Ecommerce/datepicker.gif', buttonImageOnly:
true });});
[jQuery] Refreshing droppable locations
I have a list, with many levels of child lists within some LI elements. These child lists are set to display:none until you click on their parent to display the first level of children. I'm implementing the ability to drag the LI elements around in order to change their parent to a different item. This works fine for the first level of elements. I added to the 'over' event of droppable to change child lists to display: block if you drag over an LI with children. My problem is when this list appears, and I continue dragging down to the first child element, it actually hightlights the next root level element (sibling to the parent that just expanded) which used to be in that location before changing the display. Is there any way to refresh the locations of the droppable items?
[jQuery] Re: Inline Datepicker Help
1) Within the onSelect function, 'this' refers to the input field. So
you can find the field's position using standard jQuery: $(this).offset
(). Then place your popup of events accordingly.
2) You can use the beforeShowDay setting to highlight dates. This is a
function that takes a date and returns an array with the first entry
being true if selectable, false if not, and the second entry being a
CSS class to apply. For example:
$(selector).datpicker({beforeShowDay: function(date) {
return [true, hasEvents(date) ? 'starred' : ''];
});
[jQuery] Re: listnav letter question?
Ok... I think I got it. I tweaked the addClasses function to eval a list
items attribute instead of the text value. I'm using the attrib LANG for
now. I populate this server side with either the first character of the
persons firstname or lastname depending on what order was selected on the
page. So now I can generate a dynamic list of anything I like without
needing to ensure the first char matches the navigation line selected
character. I'm sure there is allot wrong with this approach, and I
apologize in advance. My enviornment is strictly Intranet with mandated
browser and version, so I can normally get away with much less test
overhead than the will wild west... =)
Cheers,
Keith
///
function addClasses() {
var str, firstChar;
var temp;
$($list).children().each(function() {
// ORIGINAL
// $(this).text().replace(/\s+/g, ''); //.toLowerCase();
// strip all white space (including tabs and linebreaks that might have
been in the HTML)
// thanks to Liam Byrne, l...@onsight.ie
// NEW
str = $(this).attr(lang);
if (str != '') {
// ORIGINAL
// firstChar = str.slice(0, 1).toLowerCase();
// NEW
firstChar = str.toLowerCase();
if (!isNaN(firstChar)) firstChar = '_'; // use '_' if the first char is a
number
$(this).addClass('ln-' + firstChar);
if (counts[firstChar] == undefined) counts[firstChar] = 0;
counts[firstChar]++;
allCount++;
}
});
}
On Jul 20, 2009 11:33pm, keith keith.westb...@gmail.com wrote:
Great solution to managing large lists... 3 thumbs up! =)
After playing with it this evening, I found myself wondering what it
would take to possibly target another attribute to determine its
placement? For instance if I were to use an image instead of a link
or some other type of content without any text, how would I tweak the
plugin to eval this area instead of its text. Do you believe this
would be a simple endeavor?
Before I really dig in, I thought I would first ask yourselves and see
if this was even possible without a huge rewrite.
Thank you again for a really great tool... I look forward to using it
in future projects.
Respectfully,
Keith
[jQuery] Re: JQUERY ListNav, can't figure how to make it work
It looks like you have the listnav script file loaded three times... this may be causeing it. Prob only need one of these. script type=text/javascript src=/customer/caorsu/customerpages/jquery.listnav-2.0.js/script script type=text/javascript src=/customer/caorsu/customerpages/jquery.listnav.pack-2.0.js/script script type=text/javascript src=/customer/caorsu/customerpages/jquery.listnav.min-2.0.js/script Keith On Wed, Jul 22, 2009 at 5:20 PM, Carinacarinaroche...@gmail.com wrote: http://www.cascade-usa.com/default.aspx?page=customerfile=customer/caorsu/customerpages/salesflyer.html# I am trying to do it here but I am not getting the nav at the top, I am just getting them in the squares. I am not sure what exactly I am doing wrong.
[jQuery] listnav letter question?
Great solution to managing large lists... 3 thumbs up! =) After playing with it this evening, I found myself wondering what it would take to possibly target another attribute to determine its placement? For instance if I were to use an image instead of a link or some other type of content without any text, how would I tweak the plugin to eval this area instead of its text. Do you believe this would be a simple endeavor? Before I really dig in, I thought I would first ask yourselves and see if this was even possible without a huge rewrite. Thank you again for a really great tool... I look forward to using it in future projects. Respectfully, Keith
[jQuery] TreeView - New Color
Hello, Is there a psd or some other kind of editable image that someone can send me so I can make different colored themes? Thanks. Keith
[jQuery] Re: TreeView Problems
Thanks Jon. This works perfectly.
On Jul 7, 1:17 pm, Jon Banner banali...@googlemail.com wrote:
i had a similar problem this morning. I updated the call to the write cookie
to include a path (i was getting a cookie written for each page in the app)
line 172 in the uncompressed plugin.
$.cookie(settings.cookieId, data.join(), { path: '/' } );
Jon
2009/7/6 Keith keithhen...@gmail.com
Here is the menu that I'm trying to implement. I'm not sure what I'm
doing wrong, I've followed all of the demos and still the menu is not
properly setting the cookie, which is causing the menu to open
incorrectly when the page loads.
Please let me know if there is something wrong in my code or if anyone
has a suggestion that I can try out that would be great. Thanks for
your help.
head
link rel=stylesheet href=/mars/css/jquery.treeview.css /
link rel=stylesheet href=/mars/css/screen.css /
script src=/mars/js/lib/jquery.js
type=text/javascript/script
script src=/mars/js/lib/jquery.cookie.js
type=text/javascript/
script
script src=/mars/js/jquery.treeview.js type=text/javascript/
script
script type=text/javascript
jQuery.noConflict();
// fourth example
jQuery(document).ready(function(){
// fourth example
jQuery(#black, #gray).treeview({
control: #treecontrol,
persist: cookie,
cookieId: treeview-black
});
});
/script
/head
body
div id=main
div id=treecontrol
a title=Collapse the entire tree below href=#img
src=/mars/
img/nav/minus.gif / Collapse All/a
a title=Expand the entire tree below href=#img
src=/mars/img/
nav/plus.gif / Expand All/a
a title=Toggle the tree below, opening closed branches,
closing
open branches href=#Toggle All/a
/div
ul id=black class=treeview-black
li
spanCustomer Selection/span
ul
li
a
href=/mars/jsp/viewflightcalcrit.jsp Flight Search/a
/li
li
a
href=/mars/index.jsp?viewdash=1Dashboard/a
/li
/ul
/li
/ul
ul id=gray class=treeview-gray
li
spanContrax/span
ul
li
a
href=/mars/contrax/contractselection.jsp?
isRenewal=1Contracts (Renewals)/a
/li
li
a
href=/mars/contrax/systemselect.jspNew Contract/Estimate/
a
/li
/ul
/li
/ul
/div
/body
Keith
[jQuery] TreeView Problems
Here is the menu that I'm trying to implement. I'm not sure what I'm
doing wrong, I've followed all of the demos and still the menu is not
properly setting the cookie, which is causing the menu to open
incorrectly when the page loads.
Please let me know if there is something wrong in my code or if anyone
has a suggestion that I can try out that would be great. Thanks for
your help.
head
link rel=stylesheet href=/mars/css/jquery.treeview.css /
link rel=stylesheet href=/mars/css/screen.css /
script src=/mars/js/lib/jquery.js type=text/javascript/script
script src=/mars/js/lib/jquery.cookie.js type=text/javascript/
script
script src=/mars/js/jquery.treeview.js type=text/javascript/
script
script type=text/javascript
jQuery.noConflict();
// fourth example
jQuery(document).ready(function(){
// fourth example
jQuery(#black, #gray).treeview({
control: #treecontrol,
persist: cookie,
cookieId: treeview-black
});
});
/script
/head
body
div id=main
div id=treecontrol
a title=Collapse the entire tree below href=#img
src=/mars/
img/nav/minus.gif / Collapse All/a
a title=Expand the entire tree below href=#img
src=/mars/img/
nav/plus.gif / Expand All/a
a title=Toggle the tree below, opening closed branches,
closing
open branches href=#Toggle All/a
/div
ul id=black class=treeview-black
li
spanCustomer Selection/span
ul
li
a
href=/mars/jsp/viewflightcalcrit.jsp Flight Search/a
/li
li
a
href=/mars/index.jsp?viewdash=1Dashboard/a
/li
/ul
/li
/ul
ul id=gray class=treeview-gray
li
spanContrax/span
ul
li
a
href=/mars/contrax/contractselection.jsp?
isRenewal=1Contracts (Renewals)/a
/li
li
a
href=/mars/contrax/systemselect.jspNew Contract/Estimate/
a
/li
/ul
/li
/ul
/div
/body
Keith
[jQuery] Re: jQuery Countdown and close button
The problem is that the closeButton setup is called immediately it is
encountered - before the button itself exists - so no match and
nothing happens. You need to move the $('#closeButton').click(function
() { ... }); inside the document ready call: $(function () { ...}).
[jQuery] Re: TreeView Cookie Persistence Problem
Can anyone point me in the right direction with this problem?
TIA
On Jun 30, 1:38 pm, Keith keithhen...@gmail.com wrote:
Hello,
I'm having some issues using the cookie persistence, it appears that
as long as the link is in the jsp directory the menu renders properly,
however if the link is not in the jsp directory the cookie is set to
null and when the page loads all of the trees are expanded. Any help
would be greatly appreciated.
Here is the abridged version of the file that I'm using, this is
included on all pages of my application.
div id=maina href=.Main Demo/a
div id=sidetree
div class=treeheadernbsp;/div
div id=sidetreecontrola href=?#Collapse All/a | a href=?
#Expand All/a/div
ul id=tree
lispanCustomer Accounts/span
ul
li
a href=/jsp/viewflightcalcrit.jsp
Flight Search/a
/li
%if (request.getRemoteUser() != null){%
li
a
href=/jsp/accountselection.jspCustomer Selection/a
/li
%}%
%if (session.getValue(customer) != null) {
%
li
a href=/jsp/cards.jspOwner
Profile/a
/li
li
a
href=/jsp/communicationnotes.jspOwner Communication/a
/li
%}%
%if (session.getValue(customer) != null
session.getValue
(jetcard) != null) {%
li
a
href=/jsp/viewflightactivity.jspView Flight Activity/a
/li
%}%
%if ((request.isUserInRole(OwnerServices)
||
request.isUserInRole(Finance))) { %
li
a
href=/jsp/ownerprofile.jsp?new=%=userRegion%Add New
Customer/a
/li
%if (session.getValue(customer) != null
userRegion ==
custRegion){ %
li
a
href=/jsp/clientcardentry.jspAdd New Card/a
/li
%}%
%}%
%if (request.isUserInRole(OwnerServices)
|| request.isUserInRole
(Finance)) {%
%if
(request.isUserInRole(Finance)) { %
li
a
href=/jsp/jetcardexpired.jspExpired Cards/a
/li
%}%
%}%
%if(session.getValue(customer) != null
(request.isUserInRole
(Finance) || request.isUserInRole(Administrator) ||
request.isUserInRole(Sales) || request.isUserInRole(OSManager) ||
request.isUserInRole(OwnerServices))){ %
li
a
href=/jsp/welcomecall.jspWelcome Call/a
/li
%}%
%if(request.isUserInRole(Sales) ||
request.isUserInRole
(Administrator)){%
li
a
href=/jsp/index.jsp?viewdash=1Dashboard/a
/li
%}%
/ul
/li
%if (userRegion == 0 request.isUserInRole(Finance)) {
//begin
Accounts Block %
lispanAccounts/span
ul
%if (request.getRemoteUser() != null) { %
li
a
href=/jsp/njaccountsummary.jspAccount Summary/a
/li
%}%
%if(session.getValue(njcontract) !=
null){%
li
a
href=/jsp/viewnjflightactivity.jspView Activity/a
/li
%}%
%if(request.isUserInRole(Finance) ||
request.isUserInRole
(Administrator)) { %
li
a
href=/mars/jsp/brioreader.jspLoad Brio File/a
/li
[jQuery] TreeView Cookie Persistence Problem
Hello,
I'm having some issues using the cookie persistence, it appears that
as long as the link is in the jsp directory the menu renders properly,
however if the link is not in the jsp directory the cookie is set to
null and when the page loads all of the trees are expanded. Any help
would be greatly appreciated.
Here is the abridged version of the file that I'm using, this is
included on all pages of my application.
div id=maina href=.Main Demo/a
div id=sidetree
div class=treeheadernbsp;/div
div id=sidetreecontrola href=?#Collapse All/a | a href=?
#Expand All/a/div
ul id=tree
lispanCustomer Accounts/span
ul
li
a href=/jsp/viewflightcalcrit.jsp
Flight Search/a
/li
%if (request.getRemoteUser() != null){%
li
a
href=/jsp/accountselection.jspCustomer Selection/a
/li
%}%
%if (session.getValue(customer) != null) { %
li
a href=/jsp/cards.jspOwner
Profile/a
/li
li
a
href=/jsp/communicationnotes.jspOwner Communication/a
/li
%}%
%if (session.getValue(customer) != null
session.getValue
(jetcard) != null) {%
li
a
href=/jsp/viewflightactivity.jspView Flight Activity/a
/li
%}%
%if ((request.isUserInRole(OwnerServices) ||
request.isUserInRole(Finance))) { %
li
a
href=/jsp/ownerprofile.jsp?new=%=userRegion%Add New
Customer/a
/li
%if (session.getValue(customer) != null
userRegion ==
custRegion){ %
li
a href=/jsp/clientcardentry.jspAdd
New Card/a
/li
%}%
%}%
%if (request.isUserInRole(OwnerServices) ||
request.isUserInRole
(Finance)) {%
%if (request.isUserInRole(Finance))
{ %
li
a
href=/jsp/jetcardexpired.jspExpired Cards/a
/li
%}%
%}%
%if(session.getValue(customer) != null
(request.isUserInRole
(Finance) || request.isUserInRole(Administrator) ||
request.isUserInRole(Sales) || request.isUserInRole(OSManager) ||
request.isUserInRole(OwnerServices))){ %
li
a href=/jsp/welcomecall.jspWelcome
Call/a
/li
%}%
%if(request.isUserInRole(Sales) ||
request.isUserInRole
(Administrator)){%
li
a
href=/jsp/index.jsp?viewdash=1Dashboard/a
/li
%}%
/ul
/li
%if (userRegion == 0 request.isUserInRole(Finance)) {
//begin
Accounts Block %
lispanAccounts/span
ul
%if (request.getRemoteUser() != null) { %
li
a
href=/jsp/njaccountsummary.jspAccount Summary/a
/li
%}%
%if(session.getValue(njcontract) != null){%
li
a
href=/jsp/viewnjflightactivity.jspView Activity/a
/li
%}%
%if(request.isUserInRole(Finance) ||
request.isUserInRole
(Administrator)) { %
li
a href=/mars/jsp/brioreader.jspLoad
Brio File/a
/li
%}%
/ul
/li
%}%
%if(request.isUserInRole(Administrator)){//begin Admin Tools
Block
%
li
span
[jQuery] jQuery unbind not working in greasemonkey ... simple test case included
Hi all,
Thanks for any help with this one. I've developed a very simple test
case to demonstrate the behavior.
First I created unbind.html (below) that includes jQuery, binds, then
immediately unbinds all anchor tags to tmpfunc that would print 'hello
world' on the firebug console. It works as expected.
On unbind.html, I include a link to unbind.user.js (below) that does
exactly what the script on unbind.html does. That is it binds and then
immediately unbinds all anchor tags to tmpfunc.
Expected behavior when running the GM script: nothing. It should bind,
then immediately unbind the same tmpfunc.
What actually happens, it binds, and I see 'hello world' on the
console. It DOES NOT unbind.
Can anyone help me with this test case or explain what's going on?
I'm using FF 3 and GM 0.8.
(You can modify unbind.html once you have the GM scrip loaded
comment out its jQuery script and head script to make sure that there
is no conflict. You see the same behavior.)
Thanks,
Keith
ps. I realize this may be a GM isse and not a jQuery issue, but any
insight is appreciated.
unbind.html src:
!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional//EN
html
head
titleTesting unbind/title
script src=http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/
jquery.min.js
/script
script
$(document).ready(function (){
var CL = console.log
CL('running on '+location.href+' without GM');
var tmpfunc = function () {
CL('hello world');
return false;
}
$('a').bind('click', tmpfunc);
$('a').unbind('click', tmpfunc);
});
/script
/head
body
a href=./unbind.user.jstest/
/body
/html
unbind.user.js src:
// ==UserScript==
// @name unbind
// @namespace myname
// @descriptiontesting jQuery unbind in GM
// @includehttp://*/unbind.html
// @require
http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js
// ==/UserScript==
$(document).ready(function (){
var CL = unsafeWindow.console.log
CL('GM running on '+location.href);
var tmpfunc = function () {
CL('hello world');
return false;
}
$('a').bind('click', tmpfunc);
$('a').unbind('click', tmpfunc);
});
--
Keith Bentrup
http://www.keithbentrup.com
http://www.c21gt.com
[jQuery] Temporarily disabling events?
Hi all, I was wondering if anyone had any suggestions as to a method to temporarily disable/prevent certain events from firing once one event is fired? E.g. when pressing one button, I want to disable all other button presses until an animation has finished. One idea is to temporarily add some class (e.g. disabled) to each other button, and remove it once the animation is done. There are probably better ways than this, however. Any ideas? Thanks, Keith
[jQuery] Passing around sibling nodes in jQuery?
Hi all,
I was wondering if anyone knows how I might be able to pass around two
sibling nodes constructed on the fly? I'm building a definition list,
and have a function which creates two adjacent domnodes, something
like:
var term = $('dtterm/dt');
var defn = $('dddefn/dd');
I was hoping to return them to be inserted into the list:
return term.after(defn);
However only one of the nodes gets returned. I could wrap them in a
single container, return that container, and then take them back out,
but that is somewhat roundabout.
Any ideas?
Thanks,
Keith
[jQuery] Re: Selecting unusual CSS identifiers
Thanks!
It worked perfectly with with jQuery. I had tried using single
backslashes to escape,
but never thought to try two. I appreciate the explanation as well :)
Take care,
Keith
On Aug 19, 4:26 pm, Michael Geary [EMAIL PROTECTED] wrote:
Use two backslashes before each special character.
A backslash in a jQuery selector escapes the next character. But you need
two of them because backslash is also the escape character for JavaScript
strings. The first backslash escapes the second one, giving you one actual
backslash in your string - which then escapes the next character for jQuery.
$('.first\\:\\:second')
The rules for jQuery may be slightly different than CSS, but the double
backslash should do the trick.
-Mike
From: Keith Hughitt
Does anyone know if it possible to select elements with id's
or classname's that include colons or other similar
characters? So far I haven't found any evidence that :: is
not valid as part of a CSS identifier, but have been unable
to select elements with a class first::second.
Any ideas?
Thanks,
Keith
[jQuery] Selecting unusual CSS identifiers
Hey all, Does anyone know if it possible to select elements with id's or classname's that include colons or other similar characters? So far I haven't found any evidence that :: is not valid as part of a CSS identifier, but have been unable to select elements with a class first::second. Any ideas? Thanks, Keith
[jQuery] Re: Feedback for new plugin idea: ui.querybuilder
Chris-
I looked into OpenSearch some. It seems like a pretty promising
standard. For the plugin I want to be able to leave
it up to the developer exactly how the actual queries are generated.
Ideally, once the plugin is done, it could easily be extended
to handle OpenSearch, or any other type of queries. The important
question to consider initially is what minimum set of meta-data
is sufficient to enable these queries to be built (again, the
developer could extend the SearchCriterion objects being passed
around
to include any other data they would like).
Rene-
I'm also worried it could be hard to use once finished.. That's why
I'm trying to take some time now to plan it out carefully
and make it as easy to use as possible.
How does the UI know what graphics to display for a criterion?
Good point. I had thought of allowing image or thumbnails as a
type
of SearchCriterion (text and date/date-range being the other types).
The thumbnails could
either be stored in a separate array thumbnails, or possibly a hash
with the name of
the choice pointing to the thumbnail to use for that choice. I know
this is already fairly complex,
but to be able to offer this functionality in an automated way, there
isn't really any way to avoid it.
An instance of a thumbnailed SearchCriterion might then look like:
{
name: 'material',
type : 'thumbnails'
description: 'Please select a type of material'
choices: [wood, plastic, metal],
selected: null,
priority: 1,
requires: null,
provides: [
wood - [SearchCriterion, SearchCriterion],
plastic - [SearchCriterion]
],
thumbnails: [
wood - tree.gif,
plastic - bottle.gif,
metal - steel.gif
]
}
How do you plan to communicate a search-query to the server?
This part I would leave completely up to the developer. Basically,
each choice for a given SearchCriterion would be associated
with some value. Once the user hits search, the developer would have
a list of search keys and values (e.g. material - wood).
It is then up to them on how to deal with this. They would be allowed
to assign an event handler to the search button of course,
so it could be simply a matter of iterating through the search keys
and values and appending them to a url query string:
http://www.somesite.com/search.php?material=woodetc
In my case, I will be generating some XML to send off to the server. I
will leave it completely up the the developer though how the
query itself it formed. The plugin simply helps to get a collection of
keys and values from the user from which that query can easily
be built.
And what kind of results-display do you propose?
Again this isn't something I plan to handle. Although it certainly
would be possibly to envision a search plugin that not only generates
and
sends off queries, but also displays the results, I plan to focus only
on the query interface end of things. The results interface will be up
to the developer to create.
Thank you both for the feedback and suggestions. Please let me know if
you have any other thought or ideas.
Take care,
Keith
And what kind of results-display do you propose?
On Jul 18, 3:13 pm, Rene Veerman [EMAIL PROTECTED] wrote:
I like the idea for this plugin, but fear it might be hard to use once done.
Searches can be about anything.
How does the UI know what graphics to display for a criterion?
How do you plan to communicate a search-query to the server?
And what kind of results-display do you propose?
On Fri, Jul 18, 2008 at 5:11 PM, Keith Hughitt [EMAIL PROTECTED]
wrote:
Hi all,
I've started designing a jQuery UI plugin for building complex search
queries in a visual fashion, and wanted to see what people though, or
if people had any suggestions. Once the plugin is finished, anyone is
welcome to use it of course. I also posted this message in the jQuery
UI group, but I thought I'd post it here as well for those who aren't
members of the UI group.
I. Overview
The goal of the plugin is to create a UI component for piecing
together complex multi-component search queries and a simple and
visual way. The plugin will allow the user to select some set of
desired search criterion, and then when then submit a query when
ready (the rest of the logic thereafter is out of the realm of this
plugin, and will be handled by the developer).
To handle this, the plugin will be broken into three components:
Inactive, active, and current search criterion. The inactive and
active criterion are lists of criterion (will come back to exactly
what these are later) that either have or have not been applied, and
the current search criterion is a single criterion currently in
focus. Although the Developer will have control over where these
various components sit, one simple setup would be to have a single
container split horizontally into the three components:
(See Gimp mock-up at
http://i61
[jQuery] Feedback for new plugin idea: ui.querybuilder
Hi all, I've started designing a jQuery UI plugin for building complex search queries in a visual fashion, and wanted to see what people though, or if people had any suggestions. Once the plugin is finished, anyone is welcome to use it of course. I also posted this message in the jQuery UI group, but I thought I'd post it here as well for those who aren't members of the UI group. I. Overview The goal of the plugin is to create a UI component for piecing together complex multi-component search queries and a simple and visual way. The plugin will allow the user to select some set of desired search criterion, and then when then submit a query when ready (the rest of the logic thereafter is out of the realm of this plugin, and will be handled by the developer). To handle this, the plugin will be broken into three components: Inactive, active, and current search criterion. The inactive and active criterion are lists of criterion (will come back to exactly what these are later) that either have or have not been applied, and the current search criterion is a single criterion currently in focus. Although the Developer will have control over where these various components sit, one simple setup would be to have a single container split horizontally into the three components: (See Gimp mock-up at http://i61.photobucket.com/albums/h78/hughitt1/uiquerybuilderannotated.png) II. Use case: 1. When the application initially loads, and the inactive search criterion section is populated with a list of criterion the user can use to search by. The current section displays a single search criterion (the most useful one to begin with), possibly with thumbnails for each choice. The inactive section is empty to begin with. 2. The user clicks option 2 and the filter moves from current - active (possibly with some animation), and a new filter from the inactive section moves to current. 3. User selects again and there are now two active search criterion. The current search criterion isn't something the user cares about so they click on one of the other inactive filters and it is swapped with the current one. 4. This process continues until the user is satisfied with the chosen parameters. The inactive list may be updated dynamically with new search criterion that are relevant to some criterion already chosen. 5. (Optionally) If the developer has access to a method that returns only the *number* of results for a given query, then this value can be queried each time the user adjusts the query and displayed on screen. 6. The user hits search and some function provided by the developer pieces together the active search criterion to produce and query string and sends it off. III. Some useful methods to have: addCriterion removeCriterion activateCriterion deactivateCriterion swapCurrent updateAvailableCriterion updateNumResults submitQuery Event handlers could be available for each action (adding, removing, swapping, etc.) to give the developer further control. IV. How to represent a search criterion? There are many different ways you could handle this. While I would like the keep the plugin very general, and make as few assumptions as possible, I also want the plugin to handle most of the work. So far, what I'm thinking would be best would be to pass around SearchCriterion objects which have the following properties: name: int type : string description: string choices: array selected: (int, string, date, etc). priority: int requires: array provides: array I don't know if I will implement all of these, but using this structure will make things pretty straight-forward for the plugin. -name would act as both a display name for the search criterion, and possibly also as a unique ID. -type would allow specifying what to display when the filter is the current one displayed: text only, thumbnails and text, a datepicker, or a daterange picker. - description: for tooltips - choices: available choices to display (special case: dates and date ranges) - selected: when active, this will hold the value the user selected. - priority: can be set to give some search criterion priority over others for when to be displayed (0 being the initial criterion to display under current. - requires (optional) Names of other criterion required for this one to be used - provides (optional) If present criterion becomes active, add these to the list of inactive. E.g. If the user choses Automobile, add the search criterion Number of Wheels. to the list. V. Conclusion There are still some details that need to be hammered out, but this is the idea in a nut-shell. What do people think about it? Any ideas or suggestions? Any feedback would be greatly appreciated. Take care, Keith
[jQuery] Re: Dynamically change slide transitions in before callback function
Hi again,
I've gotten a little bit further with this to the point where it
displays my new effect but unfortunately it also seems to be trying to
do the old effect as well which looks awful.
Has anyone got any ideas???
Thanks
Keith
On 24 Jun, 17:08, Keith [EMAIL PROTECTED] wrote:
Hi,
I've just started using jQuery with the cycle plugin for displaying a
slideshow. It works really well and does everything that I need to
apart from one thing.
I have a requirement to be able to change the display duration of each
slide and the transition used for each slide on the fly. Changing the
display duration is done easily enough by setting opts.timeout in a
before callback function. I also thought that in the same function I
would be able to set opts.fx to whatever I wanted but it doesn't seem
to work that way.
Having looked through the cycle plugin code it seems pretty obvious
that the timeout is used each time at the end of the go function but
the transition type is only setup the once in the cycle function. I've
tried replicating the code for initialising the transition by putting
the following in the go function (with globals declared for the
container and slides) but this doesn't work:
// run transition init fn
var init = $.fn.cycle.transitions[opts.fx];
if ($.isFunction(init))
init($g_cont, $g_slides, opts);
else if (opts.fx != 'custom')
log('unknown transition: ' + opts.fx);
I've also tried replicating almost all of the cycle function into a
new function taking out the parts that I don't think are necessary and
calling this new function at the top of the go function but again this
didn't work.
I'd be grateful if someone could point me in the right direction on
this and/or explain a bit more about how the transitions are setup so
that I can code in the functionality that I need.
Thanks for your time in advance.
Keith
[jQuery] Dynamically change slide transitions in before callback function
Hi,
I've just started using jQuery with the cycle plugin for displaying a
slideshow. It works really well and does everything that I need to
apart from one thing.
I have a requirement to be able to change the display duration of each
slide and the transition used for each slide on the fly. Changing the
display duration is done easily enough by setting opts.timeout in a
before callback function. I also thought that in the same function I
would be able to set opts.fx to whatever I wanted but it doesn't seem
to work that way.
Having looked through the cycle plugin code it seems pretty obvious
that the timeout is used each time at the end of the go function but
the transition type is only setup the once in the cycle function. I've
tried replicating the code for initialising the transition by putting
the following in the go function (with globals declared for the
container and slides) but this doesn't work:
// run transition init fn
var init = $.fn.cycle.transitions[opts.fx];
if ($.isFunction(init))
init($g_cont, $g_slides, opts);
else if (opts.fx != 'custom')
log('unknown transition: ' + opts.fx);
I've also tried replicating almost all of the cycle function into a
new function taking out the parts that I don't think are necessary and
calling this new function at the top of the go function but again this
didn't work.
I'd be grateful if someone could point me in the right direction on
this and/or explain a bit more about how the transitions are setup so
that I can code in the functionality that I need.
Thanks for your time in advance.
Keith
[jQuery] Re: Using ScrollTo to Scroll to DIV and center it in thw window
the idea is to have the entire window scroll and have a menu inside each div that you scroll to. can anyone help out? On Jan 28, 3:17 pm, Ariel Flesler [EMAIL PROTECTED] wrote: Do you need to scroll the whole window ? Can't you have a fixed menu and you only scroll the content ? Ariel Flesler On 25 ene, 18:20, Keith [EMAIL PROTECTED] wrote: I would like to have a navigation in my DIV's that allows me to jump around to other DIV's placed around the screen. Right now here is what I have using ScrollTo:http://www.keithmuth.net/jquery/ I would like to keep the DIV's centered in the screens at all times, whether you jump to it through the navigation or resize the browser window (similar what I was trying to do in mootools here:http://www.keithmuth.net/zooming/). I thought I would try this out in JQuery because everyone tells me how great these forums are for help. I assume I need to somehow get the height and width of the window and then apply that to an offset? Not sure the best what the best way is to do that in JQuery but if you all could help I would appreciate it. Thanks!
[jQuery] Using ScrollTo to Scroll to DIV and center it in thw window
I would like to have a navigation in my DIV's that allows me to jump around to other DIV's placed around the screen. Right now here is what I have using ScrollTo: http://www.keithmuth.net/jquery/ I would like to keep the DIV's centered in the screens at all times, whether you jump to it through the navigation or resize the browser window (similar what I was trying to do in mootools here: http://www.keithmuth.net/zooming/). I thought I would try this out in JQuery because everyone tells me how great these forums are for help. I assume I need to somehow get the height and width of the window and then apply that to an offset? Not sure the best what the best way is to do that in JQuery but if you all could help I would appreciate it. Thanks!
[jQuery] Better way of finding another descendant of an ancestor?
Hi everyone,
I find myself doing this a lot, and thinking there must be a more
elegant way...
div class=A
div class=A1
a href= id=clickmeClick me/a
/div
div class=A2
div class=findme/div
/div
/div
$(#clickme).bind('click', function() {
var container = $(this).parents('.A');
var findme = $('.findme', container);
});
Is there a way to make those two traversals into a single jQuery line,
without knowing what the structure is beneath '.A', only that there is
a '.findme' in there somewhere?
$(this).parents('.A').children('.findme'); doesn't work because
children just looks at the immediate children.
A traversal function like .descendants() (to children() as parents()
is to parent()) would be cool.
Thanks for any suggestions.
[jQuery] Text Flickering/Distorting with Drop Down Menu (Superfish Javascript)
The rollovers and drop down items on my menu are causing the text on my site to distort and move. Not only the text in the menu, but also text underneath it, which I don't understand at all. Right now I am using the Superfish menu and the problem mainly occurs in Firefox: http://www.keithmuth.net/centennial/tests/ Please let me know if there is a fix for this, it is really distracting and looks terrible. I've been told that it is the way Firefox handles the alpha channel, but wasn't sure if there is a solution. Also, if anyone has another horizontal menus like this one, please let me know. I could do it in CSS but would like to have a nice slide and/or fade transition like the Superfish menu offers. Thanks, Keith
