[jQuery] Re: (validate plugin) dependency callback not being triggered
Thanks Jules I'll give it a try now.
I was looking for something that would trigger the validation but I
thought it was automagically triggered onblur/keyup but perhaps thats
only after the initially validate via submit
* thanks for the typo spotting!.. totally missed that
ta
Brad
On Nov 6, 11:14 am, Jules jwira...@gmail.com wrote:
Hi,
Validation only triggered if you call submit the page or call the $
(form).valid() function. I didn't see any submit() or $
(form).valid() call in your page.
Try adding this to your page
js script inside ready()
$(#validateMe).click(function(){
if($(form).valid())
alert(All data are valid);
else
alert(Invalid data);
});
html
input type=button id=validateMe name=validateMe
value=Validate /
Hope this help.
BTW: you misspelled territory in ACT :)
On Nov 6, 12:06 pm, Brad Hile brad.h...@gmail.com wrote:
Bump
Hi
I've tried every way I can think of to use dependency to enable
additional elements to be required and have had no luck at all. I
simply want to enable required on a number of fields when a specific
radio button is selected and for it to be disabled when its not.
(These fields are hidden when the radio button is deselected)
I've tested the response from the functions and it appears correct but
after hours of staring at this I just can't figure it out.
Help.. please?
original code is onhttp://promotionalpenshop.com.au/testorder.php?p=4
though I may have changed it by the time you look at this.
So basically I've tried an inline function something like:
organisation:{required: function(element) {
return $(.payment_type:checked).val() == 'invoice');
}
}
- - - - - - - - - - - - - -
Setting a var to true/false when the radio button is clicked and
testing that:
var invoice;
$(.payment_type).change(function () {
if($(this).val() != 'paypal'){
$(#paybyinvoicefields).slideDown('slow');
invoice = true;
} else {
$(#paybyinvoicefields).slideUp('slow');
invoice = false;
}
organisation:{required: invoice}
- - - - - - - - - - - - - -
Using an enternal function
organisation:{required: invoiceme() }
function invoiceme() {
return ($(.payment_type:checked).val() == 'invoice')?
true : false;
}
[jQuery] Re: (validate plugin) dependency callback not being triggered
Bump
Hi
I've tried every way I can think of to use dependency to enable
additional elements to be required and have had no luck at all. I
simply want to enable required on a number of fields when a specific
radio button is selected and for it to be disabled when its not.
(These fields are hidden when the radio button is deselected)
I've tested the response from the functions and it appears correct but
after hours of staring at this I just can't figure it out.
Help.. please?
original code is onhttp://promotionalpenshop.com.au/testorder.php?p=4
though I may have changed it by the time you look at this.
So basically I've tried an inline function something like:
organisation:{required: function(element) {
return $(.payment_type:checked).val() == 'invoice');
}
}
- - - - - - - - - - - - - -
Setting a var to true/false when the radio button is clicked and
testing that:
var invoice;
$(.payment_type).change(function () {
if($(this).val() != 'paypal'){
$(#paybyinvoicefields).slideDown('slow');
invoice = true;
} else {
$(#paybyinvoicefields).slideUp('slow');
invoice = false;
}
organisation:{required: invoice}
- - - - - - - - - - - - - -
Using an enternal function
organisation:{required: invoiceme() }
function invoiceme() {
return ($(.payment_type:checked).val() == 'invoice')?
true : false;
}
[jQuery] Re: Slideshow Dies in 1.3.2 but works in 1.3.1 and below
Bumping this question back up because I still have not found an answer
to my problem
On Aug 13, 11:14 am, Brad brad.es...@gmail.com wrote:
Didn't work. thanks for trying though, Liam.
I believe the bug may be in jQuery 1.3.2 itself because this is the
first time I've ever had a bug I can't just narrow down to a section
of code.
On Aug 13, 11:00 am, Liam Potter radioactiv...@gmail.com wrote:
try changing
$(a.sl_next).click(slNext);
$(a.sl_back).click(slBack);
to
$(a.sl_next).click(function(){slNext});
$(a.sl_back).click(function(){slBack});
no idea if this will work btw
Brad wrote:
Basically, I can click the next button and go forward until it reaches
the last slide then it sticks. The Back button is also broken. This
code works great with 1.3.1 and 1.2.6 but has the aforementioned bugs
in 1.3.2
$(document).ready(function() {
var fadeSpeed = 1000;
var currentSlide = 0;
var setSeconds = 1200;
var pauseAuto = setSeconds;
setInterval(slAuto, 1000);
$(a.sl_next).click(slNext);
$(a.sl_back).click(slBack);
$(#slideshow li).hide();
$(#slideshow li:first).show();
var totalSlides = $(#slideshow li).length;
$(#slideshow li).each(function() {
var slIndex = $(#slideshow li).index(this);
slIndex++;
$(this).find(.sl_of).text( + slIndex + of +
totalSlides);
});
function slAuto() {
if (pauseAuto != 0) { pauseAuto--; } else {
pauseAuto = setSeconds;
moveNext();
return false;
}
}
function slNext() {
pauseAuto = setSeconds;
moveNext();
return false;
}
function slBack() {
pauseAuto = setSeconds;
moveBack();
return false;
}
function moveNext() {
$(#slideshow li:eq( + currentSlide + )).fadeOut(fadeSpeed);
if (currentSlide == (totalSlides - 1)) { currentSlide = 0; }
else
{ currentSlide++; }
$(#slideshow li:eq( + currentSlide + )).fadeIn(fadeSpeed);
}
function moveBack() {
$(#slideshow li:eq( + currentSlide + )).fadeOut(fadeSpeed);
if (currentSlide == 0) { currentSlide = (totalSlides - 1); }
else
{ currentSlide--; }
$(#slideshow li:eq( + currentSlide + )).fadeIn(fadeSpeed);
}
});
[jQuery] Slideshow Dies in 1.3.2 but works in 1.3.1 and below
Basically, I can click the next button and go forward until it reaches
the last slide then it sticks. The Back button is also broken. This
code works great with 1.3.1 and 1.2.6 but has the aforementioned bugs
in 1.3.2
$(document).ready(function() {
var fadeSpeed = 1000;
var currentSlide = 0;
var setSeconds = 1200;
var pauseAuto = setSeconds;
setInterval(slAuto, 1000);
$(a.sl_next).click(slNext);
$(a.sl_back).click(slBack);
$(#slideshow li).hide();
$(#slideshow li:first).show();
var totalSlides = $(#slideshow li).length;
$(#slideshow li).each(function() {
var slIndex = $(#slideshow li).index(this);
slIndex++;
$(this).find(.sl_of).text( + slIndex + of +
totalSlides);
});
function slAuto() {
if (pauseAuto != 0) { pauseAuto--; } else {
pauseAuto = setSeconds;
moveNext();
return false;
}
}
function slNext() {
pauseAuto = setSeconds;
moveNext();
return false;
}
function slBack() {
pauseAuto = setSeconds;
moveBack();
return false;
}
function moveNext() {
$(#slideshow li:eq( + currentSlide + )).fadeOut(fadeSpeed);
if (currentSlide == (totalSlides - 1)) { currentSlide = 0; }
else
{ currentSlide++; }
$(#slideshow li:eq( + currentSlide + )).fadeIn(fadeSpeed);
}
function moveBack() {
$(#slideshow li:eq( + currentSlide + )).fadeOut(fadeSpeed);
if (currentSlide == 0) { currentSlide = (totalSlides - 1); }
else
{ currentSlide--; }
$(#slideshow li:eq( + currentSlide + )).fadeIn(fadeSpeed);
}
});
[jQuery] Re: Slideshow Dies in 1.3.2 but works in 1.3.1 and below
Didn't work. thanks for trying though, Liam.
I believe the bug may be in jQuery 1.3.2 itself because this is the
first time I've ever had a bug I can't just narrow down to a section
of code.
On Aug 13, 11:00 am, Liam Potter radioactiv...@gmail.com wrote:
try changing
$(a.sl_next).click(slNext);
$(a.sl_back).click(slBack);
to
$(a.sl_next).click(function(){slNext});
$(a.sl_back).click(function(){slBack});
no idea if this will work btw
Brad wrote:
Basically, I can click the next button and go forward until it reaches
the last slide then it sticks. The Back button is also broken. This
code works great with 1.3.1 and 1.2.6 but has the aforementioned bugs
in 1.3.2
$(document).ready(function() {
var fadeSpeed = 1000;
var currentSlide = 0;
var setSeconds = 1200;
var pauseAuto = setSeconds;
setInterval(slAuto, 1000);
$(a.sl_next).click(slNext);
$(a.sl_back).click(slBack);
$(#slideshow li).hide();
$(#slideshow li:first).show();
var totalSlides = $(#slideshow li).length;
$(#slideshow li).each(function() {
var slIndex = $(#slideshow li).index(this);
slIndex++;
$(this).find(.sl_of).text( + slIndex + of + totalSlides);
});
function slAuto() {
if (pauseAuto != 0) { pauseAuto--; } else {
pauseAuto = setSeconds;
moveNext();
return false;
}
}
function slNext() {
pauseAuto = setSeconds;
moveNext();
return false;
}
function slBack() {
pauseAuto = setSeconds;
moveBack();
return false;
}
function moveNext() {
$(#slideshow li:eq( + currentSlide + )).fadeOut(fadeSpeed);
if (currentSlide == (totalSlides - 1)) { currentSlide = 0; } else
{ currentSlide++; }
$(#slideshow li:eq( + currentSlide + )).fadeIn(fadeSpeed);
}
function moveBack() {
$(#slideshow li:eq( + currentSlide + )).fadeOut(fadeSpeed);
if (currentSlide == 0) { currentSlide = (totalSlides - 1); } else
{ currentSlide--; }
$(#slideshow li:eq( + currentSlide + )).fadeIn(fadeSpeed);
}
});
[jQuery] Re: How to bind text to trigger checkbox?
I'm not sure if this is a question or not... but if you want to be able to click a block of text to activate a checkbox, you can use the label tag to associate a text block with a checkbox. input id=checkbox1 type=checkbox /label for=checkbox1Check Checkbox/label No jQuery needed here.. On Aug 13, 10:16 am, Liam Potter radioactiv...@gmail.com wrote: http://docs.jquery.com/Events/trigger Denis Abramov wrote: Couldn't find it in documentation. For example i have spantext/span and when someone clicks on it, it should trigger checkbox to checked or unchecked. Thanks! :)
[jQuery] Re: Get append() result
Thanks. That is cleaner than my workaround. I had
var row = trtd.../td/tr;
$('#docs tbody').append(row);
return row;
I now have
var row = trtd.../td/tr;
return row.appendTo('#docs tbody')
On Aug 3, 4:52 pm, James james.gp@gmail.com wrote:
How about:
$row = $(trtd.../td/tr);
var newrow = $row.appendTo(#docs tbody);
On Aug 3, 11:51 am, Brad nrmlcrpt...@gmail.com wrote:
If I add a row to a table in the following manner, how can I get a
reference to the added row?
var row = trtd.../td/tr;
var newrow;
newrow = $('#docs tbody').append(row);
With the above code new row references the tbody and not the tr.
[jQuery] Re: Get append() result
Minor correction
I now have
var row = trtd.../td/tr;
return $(row).appendTo('#docs tbody')
[jQuery] Get append() result
If I add a row to a table in the following manner, how can I get a
reference to the added row?
var row = trtd.../td/tr;
var newrow;
newrow = $('#docs tbody').append(row);
With the above code new row references the tbody and not the tr.
[jQuery] Re: table cells selector question
I should have mentioned this site is still on 1.2.6, so I can't use
closest.
However, replacing closest w/ parents does work for me.
Thanks!
On Jul 13, 1:54 pm, James james.gp@gmail.com wrote:
Try closest():http://docs.jquery.com/Traversing/closest
table
trtd class=someclasstext 1/td/tr
trtd class=someclasstext 2/td/tr
trtd class=someclasstext 3/td/tr
/table
$(td.someclass).click(function() {
var parentTable = $(this).closest(table);
// and you can get the cells in several ways, here's one
var cells = parentTable.find(td.someclass);
});
On Jul 13, 9:39 am, Brad nrmlcrpt...@gmail.com wrote:
I can do this to select all td's with a class of someclass
var cells = $(td.someclass);
My page my have more than one table so this would select all matching
td's. What I need to do is isolate the selection to only the cells in
the table where a row was clicked.
I've tried
var cells = $(td.someclass).filter(this.parents(table));
but that is throwing an error w/in jQuery.
[jQuery] Autocomplete Behavior clarification
I have an Autocomplete on a form that uses local data. However, the
input allows users to enter values that are not in the local data
array. If the user enters and selects matching data the .result
callback function sets a corresponding key value that is submitted
with the form. The intent is to help enter known values, but others
are allowed.
What I'm observing is that if a match is entered, the corresponding
key will be set. But if the user further edits the matched value the
autocomplete doesn't fire again. This creates a problem because the
key never changes. Is that expected autocomplete behavior? If so, is
there a workaround?
Here's the code:
$(#calibration_location_name).autocomplete( locations, {
minChars: 0,
width: 310,
selectFirst: false,
scroll: true,
matchContains: word,
mustMatch: false,
autoFill: false,
formatItem: function(row, i, max) {
return row.name;
},
formatMatch: function(row, i, max) {
return row.name;
},
formatResult: function(row) {
return row.name;
}
})
.result(LocationAutoCompleteCallback)
.blur( function(){
if($(this).val() === '') {
$(#calibration_locationkey).val(0);
}
});
Thanks
[jQuery] Expand/Collapse multi-line table cell from 1 to all lines
Consider a table of locations where one column is a mailing address. Each address is at least 2 lines, a few addresses are 6 lines and everything else falls in between. I have a request to display the table with only one address line with the option to expand/collapse the address cell to show the full address. I can imagine a number of solutions to this. (1) only output the first line and use Ajax to pull the full address on demand. (2) only output the first line, but store an array of all addresses client side and use that to toggle 1 line/full address display. (3) output the full address in the table, but use CSS to initially set display to one line, and jQuery to toggle between 1 line/full address display. I like this solution because it won't involve any changes in the backend code (solution 1 and 2 will). (4) another solution? I know how to do 1 and 2, but am curious about 3, and welcome other suggestions. Admittedly this is more of a CSS question than pure jQuery, but I'm curious if someone may have done this or if a plugin might exist?
[jQuery] validation showErrors error
I'm using the validation plugin to perform client side validation on a
form that uses $.post.
To be safe, I also re-validate all inputs on the server side. Ideally
I'll never have a case where client-side validation passes but server-
side validation fails, but in case I do, I want to display errors back
that the browser.
I have my server side code returning a JSON object. It contains a
status, an errors object, and an info object. The errors object may
contain multiple errors.
$.post(ajax.php,
formdata += 'from=calibtype=submit',
function(data){
if(data.status == false) {
// update form errors
$.each(data.errors, function(fld,msg) {
console.log(fld,msg); // See what's coming back. Looks OK!
var v = $(#calib_entry).validate(); // because of scoping
issues I need to redefine validator
v.showErrors({fld:msg}); // = This is throwing a jQuery error
});
}
...
},
'json'
);
I'm testing my server side validation and have hard-coded bad value so
validation will fail.
When I call v.showErrors Firebug is showing an error within jQuery
itself. Unfortunately the server I'm working against has a minified
version installed (I've requested they install the full version).
Until I can see where jQuery is failing, can someone who is more
familiar with showErrors tell if the problem is how I'm calling it?
The console.log call shows that fld and msg are both strings.
Thanks,
Brad
[jQuery] Re: validation showErrors error
The .each is the problem:
if(data.status == false) {
// update form errors
$(#calib_entry).validate().showErrors(data.errors);
}
On May 7, 10:35 am, Brad nrmlcrpt...@gmail.com wrote:
I'm using the validation plugin to perform client side validation on a
form that uses $.post.
To be safe, I also re-validate all inputs on the server side. Ideally
I'll never have a case where client-side validation passes but server-
side validation fails, but in case I do, I want to display errors back
that the browser.
I have my server side code returning a JSON object. It contains a
status, an errors object, and an info object. The errors object may
contain multiple errors.
$.post(ajax.php,
formdata += 'from=calibtype=submit',
function(data){
if(data.status == false) {
// update form errors
$.each(data.errors, function(fld,msg) {
console.log(fld,msg); // See what's coming back. Looks OK!
var v = $(#calib_entry).validate(); // because of scoping
issues I need to redefine validator
v.showErrors({fld:msg}); // = This is throwing a jQuery error
});
}
...
},
'json'
);
I'm testing my server side validation and have hard-coded bad value so
validation will fail.
When I call v.showErrors Firebug is showing an error within jQuery
itself. Unfortunately the server I'm working against has a minified
version installed (I've requested they install the full version).
Until I can see where jQuery is failing, can someone who is more
familiar with showErrors tell if the problem is how I'm calling it?
The console.log call shows that fld and msg are both strings.
Thanks,
Brad
[jQuery] Re: validation showErrors error
Oops, hit send accidentally. The problem was that I didn't need to
iterate over each error. A single call to showErrors handles them all.
if(data.status == false) {
// update form errors
$(#calib_entry).validate().showErrors(data.errors);
}
On May 7, 10:39 am, Brad nrmlcrpt...@gmail.com wrote:
The .each is the problem:
if(data.status == false) {
// update form errors
$(#calib_entry).validate().showErrors(data.errors);
}
On May 7, 10:35 am, Brad nrmlcrpt...@gmail.com wrote:
I'm using the validation plugin to perform client side validation on a
form that uses $.post.
To be safe, I also re-validate all inputs on the server side. Ideally
I'll never have a case where client-side validation passes but server-
side validation fails, but in case I do, I want to display errors back
that the browser.
I have my server side code returning a JSON object. It contains a
status, an errors object, and an info object. The errors object may
contain multiple errors.
$.post(ajax.php,
formdata += 'from=calibtype=submit',
function(data){
if(data.status == false) {
// update form errors
$.each(data.errors, function(fld,msg) {
console.log(fld,msg); // See what's coming back. Looks OK!
var v = $(#calib_entry).validate(); // because of scoping
issues I need to redefine validator
v.showErrors({fld:msg}); // = This is throwing a jQuery error
});
}
...
},
'json'
);
I'm testing my server side validation and have hard-coded bad value so
validation will fail.
When I call v.showErrors Firebug is showing an error within jQuery
itself. Unfortunately the server I'm working against has a minified
version installed (I've requested they install the full version).
Until I can see where jQuery is failing, can someone who is more
familiar with showErrors tell if the problem is how I'm calling it?
The console.log call shows that fld and msg are both strings.
Thanks,
Brad
[jQuery] Re: SuperFish Arrows
it's set in the css file at the bottom. Just change the file name and dimensions to suit On Apr 24, 12:09 am, Praveen praveen.rajendrab...@gmail.com wrote: How is the arrows displayed in the superfish menus? If I would like to change to an image of my choice, how do I go about? Regards, Praveen
[jQuery] jQuery Validation Plugin - rule metadata documentation?
Are the options, usage and limitations for the jQuery Validation rules using metadata in markup, e.g., class=required date, documented anywhere? There is http://docs.jquery.com/Plugins/Validation#List_of_built-in_Validation_methods, but that is for setting up rules in the JS.
[jQuery] Re: jQuery Validation Plugin - rule metadata documentation?
Thanks Jorn. Since I wrote I've been looking at the additional-
methods.js to get ideas on how to write some custom filter and found
this example:
class={required:true,vinUS:true}
Is that object syntax required when using custom filters as opposed to
simply
class=required vinUS?
re: where no parameters are needed I assume you can't do something
like this:
class=required:true,minlength:2?
On Apr 23, 1:57 pm, Jörn Zaefferer joern.zaeffe...@googlemail.com
wrote:
The list applies to metadata as well. You can specify any method as an
attribute, and where there are no parameters needed, use a class
instead.
Jörn
On Thu, Apr 23, 2009 at 9:49 PM, Brad nrmlcrpt...@gmail.com wrote:
Are the options, usage and limitations for the jQuery Validation rules
using metadata in markup, e.g., class=required date, documented
anywhere?
There
ishttp://docs.jquery.com/Plugins/Validation#List_of_built-in_Validation...,
but that is for setting up rules in the JS.
[jQuery] Validation plugin - Using with 'button' buttons?
I'm trying to integrate the Validation plugin into an existing project. The forms use AJAX and the buttons are not of type 'submit', but type 'button'. If I change the type to 'submit' I can see validation works, but doing so will require other code changes. Is there any way to get it to work with a 'button' button?
[jQuery] Re: Validation plugin - Using with 'button' buttons?
To be more specific, validation is working prior to clicking the button. For example I have a date field in the form and entering garbage will present an enter a valid date message, but I also have some fields that are simply required. Clicking the button doesn't appear to run any pre-submit validation. BTW, I'm totally new to this plugin. On Apr 22, 9:39 am, Brad nrmlcrpt...@gmail.com wrote: I'm trying to integrate the Validation plugin into an existing project. The forms use AJAX and the buttons are not of type 'submit', but type 'button'. If I change the type to 'submit' I can see validation works, but doing so will require other code changes. Is there any way to get it to work with a 'button' button?
[jQuery] Re: Validation plugin - Using with 'button' buttons?
In the button's click handler:
if ($(#myform).validate().form()) {
// submit form
}
On Apr 22, 9:48 am, Brad nrmlcrpt...@gmail.com wrote:
To be more specific, validation is working prior to clicking the
button. For example I have a date field in the form and entering
garbage will present an enter a valid date message, but I also have
some fields that are simply required. Clicking the button doesn't
appear to run any pre-submit validation.
BTW, I'm totally new to this plugin.
On Apr 22, 9:39 am, Brad nrmlcrpt...@gmail.com wrote:
I'm trying to integrate the Validation plugin into an existing
project. The forms use AJAX and the buttons are not of type 'submit',
but type 'button'. If I change the type to 'submit' I can see
validation works, but doing so will require other code changes. Is
there any way to get it to work with a 'button' button?
[jQuery] Form validation help
Can anyone tell me how to validate a form field with a Minimium(2)
characters required? Here is what I have below, thank you in advance
for your help!
$().ready(function() {
// validate signup form on keyup and submit
$(#signupForm).validate({
rules: {
firstname: required,
lastname: required,
url: {
required: false,
url: true
},
businessname: required,
address: required,
city: required,
state: {
required: true,
digits: false
},
zip: {
required: true,
minlength: 5,
digits: true
},
messages: {
firstname: Enter contact firstname,
lastname: Enter contact lastname,
surl: Enter a valide URL Ex: http://domain.com;,
businessname: Enter your business name,
address: Enter address,
city: Enter City,
state: Enter State,
zip: Enter Zip
}
});
[jQuery] element type of matched id
I'm working on a page that dynamically changes many form elements. Because of the way that different browsers style disabled or readonly text inputs, I'm swapping the input with a span that displays more consistently. I don't need to submit those fields. However, when I do this the affected element's ID does not change. There are also some other cases where a control may change from a free text input to a select menu and vice versa, but again with the same ID. If there a way for me to figure out what the type of element for a matched ID? For example if $(#foo) matches input id=foo ... I'd like to know it is an input, but if $(#foo) matches span id=foo ... I'd like to know it is a span?
[jQuery] Re: element type of matched id
Thanks for this too. I was looking for the documentation for .is the
other day and couldn't find it.
On Mar 25, 12:26 pm, jerone jeron...@gmail.com wrote:
You can do:
$(input#foo)
$(span#foo)
or you can use the is function:http://docs.jquery.com/Traversing/is#expr
if($(#foo).is(span)){
// code
}else if($(#foo).is(input)){
// code
}
On 25 mrt, 19:15, Brad nrmlcrpt...@gmail.com wrote:
I'm working on a page that dynamically changes many form elements.
Because of the way that different browsers style disabled or readonly
text inputs, I'm swapping the input with a span that displays more
consistently. I don't need to submit those fields. However, when I do
this the affected element's ID does not change. There are also some
other cases where a control may change from a free text input to a
select menu and vice versa, but again with the same ID.
If there a way for me to figure out what the type of element for a
matched ID? For example if
$(#foo)
matches
input id=foo ...
I'd like to know it is an input, but if
$(#foo)
matches
span id=foo ...
I'd like to know it is a span?
[jQuery] Re: element type of matched id
Exactly what I need. Thanks! On Mar 25, 12:25 pm, James james.gp@gmail.com wrote: $(#foo)[0].nodeName;
[jQuery] Testing if a .data('key') is defined?
I'm using .data to store some information and occasionally hit a case where I'll try to do something with the stored data and will get an error e.g., $(#foo).data(bar) is undefined. I need to fix my code so that doesn't happen, but would like to know the best way to test if bar has been defined for $(#foo) so that I can catch these errors before they happen.
[jQuery] Re: Testing if a .data('key') is defined?
typeof( $(#foo).data(bar) ) will return 'undefined' On Mar 23, 5:29 pm, I wrote: I'm using .data to store some information and occasionally hit a case where I'll try to do something with the stored data and will get an error e.g., $(#foo).data(bar) is undefined. I need to fix my code so that doesn't happen, but would like to know the best way to test if bar has been defined for $(#foo) so that I can catch these errors before they happen.
[jQuery] Re: Data Array
You can use an array of objects, e.g.
var choices= [
{ name: foo, id: 1 },
{ name: bar, id: 2 },
{ name: baz, id: 3 }
];
Your autocomplete callback might look like this
function MyAutoCompleteCallback (event, data, formatted) {
$(#my_hidden_fld).val(data.id);
...
}
On Mar 23, 5:58 pm, Nick njor...@gmail.com wrote:
Hello,
I am attempting to use the autocomplete plugin to allow users to pick
a text value from an input box and have the db id of that value
populated to a hidden field that can then be posted back to the
application. I have this working fine with a url data source, but am
confused how to do it with a JS array.
Here is what I have:
$(#suggest).autocomplete(/dev/autotest.php)
.result(function (evt, data, formatted) {
$(#sugghidden).val(data[1]);
});
Again, this works fine as autotest.php returns data in the format of:
Something|1
Another|2
Test|3
My question is in what way can I format the data if it is passed as an
array and still populate the hidden form?
Thanks.
[jQuery] Re: Preventing A link clicks before document.ready();
Other have offered solutions where you hide the links, etc.
A variation of that theme would be to originally display the links
with some inline JS, e.g.,
a href=mysite.html onclick=myPrematureClickSentinel()
Where myPrematureClickSentinel simply returns false.
In your document.ready()
$(a).removeAttr(onclick); // get rid of all
myPrematureClickSentinel
$(a).click( function() {
// your actual click handler goes here.
});
You could chain those if you want.
Of course as James pointed out this will not work if the user has JS
turned off...
On Mar 20, 9:48 am, HippieX jlrober...@gmail.com wrote:
I have a problem I am sure others have encountered. I have .click()
events attached to a links in my web page, but the user is clicking
the links before the document.ready(); fires causing unexpected
results. Is there anyway to stop this from happening?
Thanks,
Jeff
[jQuery] Plugin or examples to filter display of table data?
I searched this group and Googled for examples but haven't what I was looking for. Consider this use case: A database-driven backend presents a page with a table containing many rows (100's or more). Instead of having the user enter new search criteria and send another request to the backend, I'd like to provide client side filtering to narrow the displayed results, with the option to restore the original results. There is (was?) a TableFilter plugin, but it offers different functionality. Are there any plugins or examples that do this? I'm especially interested in something that could peacefully co-exist with TableSorter.
[jQuery] Re: Plugin or examples to filter display of table data?
Sorry for the noise, I should have looked at the jQuery plugins site first. There are a number of offerings there that may do what I want. DataTables looks very promising. On Mar 20, 12:44 pm, I wrote: I searched this group and Googled for examples but haven't what I was looking for. Consider this use case: A database-driven backend presents a page with a table containing many rows (100's or more). Instead of having the user enter new search criteria and send another request to the backend, I'd like to provide client side filtering to narrow the displayed results, with the option to restore the original results. There is (was?) a TableFilter plugin, but it offers different functionality. Are there any plugins or examples that do this? I'm especially interested in something that could peacefully co-exist with TableSorter.
[jQuery] Email Validation Dies with 1.3 Upgrade
I wrote this function to check an input field. I can fire it when the
field blurs or when the form is submitted. If an .error is visible
when the submit button is clicked, it won't be submitted until they
are all gone.
When I try to update to 1.3 this function no longer works.
jQuery.fn.form_realemail = function () {
return this.each(function (){
if ($(this).attr('value') != ) {
error2 = 0;
if ($(this).is([...@value$='@hotmail.com']))
{ error2 = 1; }
if ($(this).is([...@value$='@gmail.com'])) {
error2 = 1; }
if ($(this).is([...@value$='@yahoo.com'])) {
error2 = 1; }
if ($(this).is([...@value$='@msn.com'])) {
error2 = 1; }
if ($(this).is([...@value*='@'])) { } else {
error2 = 2; }
if ($(this).is([...@value*='.'])) { } else {
error2 = 2; }
if (error2 == 0) {
$(this).parent().find('.error').hide();
}
if (error2 == 1) {
$(this).parent().find('.error').show();
$(this).parent().find('.error').text(Company Emails Only.);
}
if (error2 == 2) {
$(this).parent().find('.error').show();
$(this).parent().find('.error').text(Enter A Valid Email
Address.);
}
}
if ($(this).attr('value') == ) {
$(this).parent().find('.error').show();
$(this).parent().find('.error').text(Email Address is
Required.);
}
});
}
[jQuery] Re: Email Validation Dies with 1.3 Upgrade
Tried it, still doesn't work. I went through the 1.3 change log and
can't find what change could have effected it.
On Mar 19, 11:59 am, Jörn Zaefferer joern.zaeffe...@googlemail.com
wrote:
Remove the @ symbol in the attribute selector, it was deprecated in
1.2 and removed in 1.3
Jörn
On Thu, Mar 19, 2009 at 3:06 PM, Brad brad.es...@gmail.com wrote:
I wrote this function to check an input field. I can fire it when the
field blurs or when the form is submitted. If an .error is visible
when the submit button is clicked, it won't be submitted until they
are all gone.
When I try to update to 1.3 this function no longer works.
jQuery.fn.form_realemail = function () {
return this.each(function (){
if ($(this).attr('value') != ) {
error2 = 0;
if
($(this).is([...@value...@hotmail.com'])) { error2 = 1; }
if ($(this).is([...@value...@gmail.com']))
{ error2 = 1; }
if ($(this).is([...@value...@yahoo.com']))
{ error2 = 1; }
if ($(this).is([...@value...@msn.com'])) {
error2 = 1; }
if ($(this).is([...@value*='@'])) { } else
{ error2 = 2; }
if ($(this).is([...@value*='.'])) { } else
{ error2 = 2; }
if (error2 == 0) {
$(this).parent().find('.error').hide();
}
if (error2 == 1) {
$(this).parent().find('.error').show();
$(this).parent().find('.error').text(Company Emails Only.);
}
if (error2 == 2) {
$(this).parent().find('.error').show();
$(this).parent().find('.error').text(Enter A Valid Email
Address.);
}
}
if ($(this).attr('value') == ) {
$(this).parent().find('.error').show();
$(this).parent().find('.error').text(Email Address
is Required.);
}
});
}
[jQuery] Re: Email Validation Dies with 1.3 Upgrade
There's a lot more code wrapped around this, I just pulled out the
area I know isn't working correctly.
On Mar 19, 2:00 pm, MorningZ morni...@gmail.com wrote:
Why so complex with jQuery objects? simple JavaScript makes much
more sense, plus the fact that ultimately all the ends with and
contains selectors use basic JavaScript in the end anyways
http://paste.pocoo.org/show/108697/
On Mar 19, 12:07 pm, Brad brad.es...@gmail.com wrote:
Tried it, still doesn't work. I went through the 1.3 change log and
can't find what change could have effected it.
On Mar 19, 11:59 am, Jörn Zaefferer joern.zaeffe...@googlemail.com
wrote:
Remove the @ symbol in the attribute selector, it was deprecated in
1.2 and removed in 1.3
Jörn
On Thu, Mar 19, 2009 at 3:06 PM, Brad brad.es...@gmail.com wrote:
I wrote this function to check an input field. I can fire it when the
field blurs or when the form is submitted. If an .error is visible
when the submit button is clicked, it won't be submitted until they
are all gone.
When I try to update to 1.3 this function no longer works.
jQuery.fn.form_realemail = function () {
return this.each(function (){
if ($(this).attr('value') != ) {
error2 = 0;
if
($(this).is([...@value...@hotmail.com'])) { error2 = 1; }
if
($(this).is([...@value...@gmail.com'])) { error2 = 1; }
if
($(this).is([...@value...@yahoo.com'])) { error2 = 1; }
if
($(this).is([...@value...@msn.com'])) { error2 = 1; }
if ($(this).is([...@value*='@'])) { }
else { error2 = 2; }
if ($(this).is([...@value*='.'])) { }
else { error2 = 2; }
if (error2 == 0) {
$(this).parent().find('.error').hide();
}
if (error2 == 1) {
$(this).parent().find('.error').show();
$(this).parent().find('.error').text(Company Emails Only.);
}
if (error2 == 2) {
$(this).parent().find('.error').show();
$(this).parent().find('.error').text(Enter A Valid Email
Address.);
}
}
if ($(this).attr('value') == ) {
$(this).parent().find('.error').show();
$(this).parent().find('.error').text(Email
Address is Required.);
}
});
}
[jQuery] Re: Best way to Table Sort using server side calls
By Toggle the sort I'm assuming you want to change a visual sort
order indicator in the clicked th?
As MorningZ suggested your click will fire an ajax .load. The .load's
callback will:
* populate the tables tbody with the return result set
* manipulate the clicked th css to indicate a sort order change
I know you mentioned you can't do client side sorting, but I would
study the Table Sorter plugin and see how they change the sort order
display. IIRC it involves toggling (or removing/adding) a class that
has either a background up or down image. You can test the asc or desc
state of the column by testing for a specific class, .e.g.,
$('th').hasClass('asc');
$('th').hasClass('desc');
On Mar 17, 12:59 pm, Tony K tony.kowal...@gmail.com wrote:
What would be the best way to Toggle the sort using jQuery?
Know of any samples that can determine if the sort is asc, then have a
toggle update the link to desc?
I appreciate all your help!
Thanks,
Tony
On Mar 17, 2:35 pm, MorningZ morni...@gmail.com wrote:
Sounds like jQuery's .load event would be best for you
make the call to list.cfm?show=Allcolumn=namesort=asc, create the
HTML table in your server side code, then put that HTML into a div
or the like
On Mar 17, 2:31 pm, Tony K tony.kowal...@gmail.com wrote:
I'd like to not have page reloads on the client side, as well as the
ability to toggle the TH with the sort direction.
Make sense?
On Mar 17, 2:05 pm, MorningZ morni...@gmail.com wrote:
If you are looking to do the sorting on the server-side, then where/
how do you think jQuery comes into the equation?
On Mar 17, 1:20 pm, Tony K tony.kowal...@gmail.com wrote:
I am looking to display a table of data and have my table headers we
links to sort.
I CANNOT use client side sorting, the table is up to 10,000 rows.
I have the table built and headers are links to pass a query param.
My question is what is the best method to pass the params and load the
page w/o a refresh.
I'd really like the header to know its a toggle, so that ordering
toggles between asc/desc.
My example is passing something like this list.cfm?
show=Allcolumn=namesort=asc
This is my first time using jQuery, so any help is appreciated.
Thanks,
Tony K
[jQuery] Re: Ajax call problem with Firefox
Try the $.ajax cache: false option.
On Mar 17, 5:29 pm, cindy ypu01...@yahoo.com wrote:
There is a device with web server running. My code will check
periodically the status of the device.When I pull the network cable
from my laptop. I found that firefox can still response the request
sometimes. It seems firefox has cache some response. IE works fine.
Does some one have same experience?
My code is following:
asyncRequest:function(queryStr, cb, errorfn)
{
return $.ajax({
type: get,
url: rap_util.urlroot,
data: queryStr,
error: errorfn,
success: cb,
async: true,
dataType: 'xml'});
},
function getDefaultPageHandle(rXml, textStatus)
{
$(rXml).find(response).each(function()
{
var pageType=$(main_page_type,this).text();
showPage(pageType);
});
if(defaultErr==true pageStatus==ld)
{
$.unblockUI();
defaultErr=false;
}
setTimeout(isFactoryDefault(),getDefaultPageTime);
};
function getDefaultPageErrHandle(XMLHttpRequest, textStatus,
errorThrown)
{
if(pageStatus==ld)
{
$.blockUI({ message: div class='reboot_div'div
class='ap_reboot_title'Message/divdiv class='ap_reboot_body_1'AP
is down or web browser lost connection to AP.../div/div });
defaultErr=true;
}
setTimeout(isFactoryDefault(),getDefaultPageTime);
};
function isFactoryDefault()
{
rap_util.asyncRequest
(opcode=get_default_page_type,getDefaultPageHandle,getDefaultPageErrHandle);
};
[jQuery] Re: Modifying href attribute values
There is probably a more concise way to do this, but I'll break down
the steps
// regular expression pattern to get the hash value
var patt = new RegExp([^#]+$);
// The href of your attribute. This is a generic example, you will
// probably need to provide a more specific jQuery selector to get the
a you
// want to manipulate
var href = $('a').attr('href');
// search for hash value in href
var hashval = patt.exec(href);
// Again, you'll probably need a more specific jQuery selector
// overwrite the existing href of the selected a
$('a').attr('href','path/to/' + hashval + '.html');
On Mar 15, 10:22 am, Jonny Stephens goo...@bloog.co.uk wrote:
Can anyone provide guidance on how to modify href attributes in this
way:
Markup: a href=22_foo.html#foo22-name
Modify to: a href=path/to/foo22-name.html
i.e. removing everything up to and including the #, prepending a fixed
path value and appending .html
Thanks
Jonny
[jQuery] modifying parts of cloned inserted content
I have a div containing a form label and field. I'm building a feature where the user can add as many of these fields as they need. div style=padding: 1px; clear: both; label class=left for=f_calibration_url[1]span[+]/span Calibration URL:/label textarea rows=2 cols=40 id=f_calibration_url[1] name=f_calibration_url[1]/ /div If the user clicks the [+] in the for label a clone of the field is inserted into the form. I've got the cloning and inserting logic down but what I end up with is this: div style=padding: 1px; clear: both; label class=left for=f_calibration_url[1] Calibration URL:/ label textarea rows=2 cols=40 id=f_calibration_url[1] name=f_calibration_url[1]/ /div div style=padding: 1px; clear: both; label class=left for=f_calibration_url[1]span[+]/span Calibration URL:/label textarea rows=2 cols=40 id=f_calibration_url[1] name=f_calibration_url[1]/ /div What I need to get is this. The only difference is that when clonded the index of the label for and textarea name and id attributes needs to increment by 1. div style=padding: 1px; clear: both; label class=left for=f_calibration_url[1]Calibration URL:/ label textarea rows=2 cols=40 id=f_calibration_url[1] name=f_calibration_url[1]/ /div Once I've cloned something is there a simple way to search and replace mixed attribute values? div style=padding: 1px; clear: both; label class=left for=f_calibration_url[2]span[+]/span Calibration URL:/label textarea rows=2 cols=40 id=f_calibration_url[2] name=f_calibration_url[2]/ /div
[jQuery] Global Object, Scope question
This is really a javascript question, but will use jQuery.
When a page first displays I would like to save a bunch of data about
a form. For example the IDs of all of the inputs and how they are
originally defined. Depending on user actions I may need to restore
individual form fields to their original state. I don't need to reset
the entire form. I know how to use jQuery to select the original form
elements, but am struggling with how to store them into an object that
I can refer to and retrieve individual input data for later.
// a global object that stores form data
What goes here? How do I make it global and persistent?
// a function that resets an field to its original state
function resetField(id) {
// refers to the global object, but how?
}
$(document).ready(function(){
// save initial form configuration
how called?
});
[jQuery] Re: Global Object, Scope question
Thanks. All of my attempts were trying to overly complicate things.
On Mar 10, 9:52 am, MorningZ morni...@gmail.com wrote:
simply saying
var ThisVar = whatever;
makes it global
so in your code, it would be like
script type=text/javascript
var FormData = {};
$(document).ready(function(){
$(:input).each(function() {
FormData[this.id] = $(this).val();
});
});
function resetField(id) {
if (FormData[id] != null) {
$(# + id).val(FormData[id]);
}}
/script
On Mar 10, 11:38 am, Brad nrmlcrpt...@gmail.com wrote:
This is really a javascript question, but will use jQuery.
When a page first displays I would like to save a bunch of data about
a form. For example the IDs of all of the inputs and how they are
originally defined. Depending on user actions I may need to restore
individual form fields to their original state. I don't need to reset
the entire form. I know how to use jQuery to select the original form
elements, but am struggling with how to store them into an object that
I can refer to and retrieve individual input data for later.
// a global object that stores form data
What goes here? How do I make it global and persistent?
// a function that resets an field to its original state
function resetField(id) {
// refers to the global object, but how?
}
$(document).ready(function(){
// save initial form configuration
how called?
});
[jQuery] Reset individual form objects to their original display state
I have a need to reset individual form objects to their original
state. When the document loads I save the element like this:
var origFormData = {};
$(document).ready(function(){
// Save original form data for each input field
$(:input).each(function(){
origFormData[this.name] = $(this);
});
});
For example I have a form with fields named name, age, and dept
selectable by $(#name), $(#age), and $(#dept) respectably.
How would I go about later restoring/resetting a specific field. Is
there a simple way to overwrite the object represented by $(#name)
with origFormData.name?
[jQuery] Re: Reset individual form objects to their original display state
Thanks for the help on the other question. I missed the part about
reverting the value.
Actually I don't think that I need to explicitly store the value. If I
store the value of $(this) as shown I can later retrieve the value
for a specific field by e.g., calling ...
$(origFormData['age']).val()
..., but I need to explain my requirement in more detail.
Restoring the input field's value is only one part of the problem.
There are a number of other attributes that might need to be restored.
Depending on how the backend code originally displays the form, a
field can start out enabled or disabled. It can start out with a
special class assignment. These attributes can dynamically change as
the form is used. Therefore resetting a field may involve more than
restoring the field's original value.
What I was hoping I could do was store an jQuery object that contained
all of the information about the field and somehow (magically) use
that to overwrite the current representation of that same field.
Am I dreaming?
Thinking of other ways to solve this problem, is there a way with
jQuery to get the full html of an input element? The .html() method
doesn't do it.
On Mar 10, 12:02 pm, MorningZ morni...@gmail.com wrote:
You forgot an important part of the line
origFormData[this.name] = $(this);
and this is you need to store the value, so
origFormData[this.name] = $(this).val();
and on your other topic, the code was also provided to revert the
value back to the saved value
On Mar 10, 1:36 pm, Brad nrmlcrpt...@gmail.com wrote:
I have a need to reset individual form objects to their original
state. When the document loads I save the element like this:
var origFormData = {};
$(document).ready(function(){
// Save original form data for each input field
$(:input).each(function(){
origFormData[this.name] = $(this);
});
});
For example I have a form with fields named name, age, and dept
selectable by $(#name), $(#age), and $(#dept) respectably.
How would I go about later restoring/resetting a specific field. Is
there a simple way to overwrite the object represented by $(#name)
with origFormData.name?
[jQuery] Re: Reset individual form objects to their original display state
Thanks for pointing out about that $(this) is pointer.
On Mar 10, 12:50 pm, MorningZ morni...@gmail.com wrote:
Reading up on the documentation would be a good thing, as knowing the
basics, like knowing what .html() does, is absolutely required if
you want to learn to use this library to the fullest
As for
If I store the value of $(this) as shown I can later retrieve the
value
for a specific field by e.g., calling ..
No, that's not what is going to happen
saying: origFormData[some key] = $(this);
saves a pointer to that object, not a copy to the object itself.
so if later on you change anything on $(this), you changed the value
(but is really just a pointer to the object) of origFormData[some
key] as well
On Mar 10, 2:43 pm, Brad nrmlcrpt...@gmail.com wrote:
Thanks for the help on the other question. I missed the part about
reverting the value.
Actually I don't think that I need to explicitly store the value. If I
store the value of $(this) as shown I can later retrieve the value
for a specific field by e.g., calling ...
$(origFormData['age']).val()
..., but I need to explain my requirement in more detail.
Restoring the input field's value is only one part of the problem.
There are a number of other attributes that might need to be restored.
Depending on how the backend code originally displays the form, a
field can start out enabled or disabled. It can start out with a
special class assignment. These attributes can dynamically change as
the form is used. Therefore resetting a field may involve more than
restoring the field's original value.
What I was hoping I could do was store an jQuery object that contained
all of the information about the field and somehow (magically) use
that to overwrite the current representation of that same field.
Am I dreaming?
Thinking of other ways to solve this problem, is there a way with
jQuery to get the full html of an input element? The .html() method
doesn't do it.
On Mar 10, 12:02 pm, MorningZ morni...@gmail.com wrote:
You forgot an important part of the line
origFormData[this.name] = $(this);
and this is you need to store the value, so
origFormData[this.name] = $(this).val();
and on your other topic, the code was also provided to revert the
value back to the saved value
On Mar 10, 1:36 pm, Brad nrmlcrpt...@gmail.com wrote:
I have a need to reset individual form objects to their original
state. When the document loads I save the element like this:
var origFormData = {};
$(document).ready(function(){
// Save original form data for each input field
$(:input).each(function(){
origFormData[this.name] = $(this);
});
});
For example I have a form with fields named name, age, and dept
selectable by $(#name), $(#age), and $(#dept) respectably.
How would I go about later restoring/resetting a specific field. Is
there a simple way to overwrite the object represented by $(#name)
with origFormData.name?
[jQuery] Re: Reset individual form objects to their original display state
I'll have a look. It sounds like this is the basis for what I need.
Thanks.
On Mar 10, 12:58 pm, mkmanning michaell...@gmail.com wrote:
Haven't tried it but you could use my getAttributes plugin (http://
plugins.jquery.com/project/getAttributes) to store the current
attributes in the data as I suggested, and then retrieve it later.
That would get you not only the value but all other attributes.
$(document).ready(function(){
$(:input).each(function(){
$(this).data('orig',$.getAttributes($(this)))
});
//to access original attributes of the input later, including value
console.log( $('some_input').data('orig').value );
console.log( $('some_input').data('orig').name);
});
On Mar 10, 11:43 am, Brad nrmlcrpt...@gmail.com wrote:
Thanks for the help on the other question. I missed the part about
reverting the value.
Actually I don't think that I need to explicitly store the value. If I
store the value of $(this) as shown I can later retrieve the value
for a specific field by e.g., calling ...
$(origFormData['age']).val()
..., but I need to explain my requirement in more detail.
Restoring the input field's value is only one part of the problem.
There are a number of other attributes that might need to be restored.
Depending on how the backend code originally displays the form, a
field can start out enabled or disabled. It can start out with a
special class assignment. These attributes can dynamically change as
the form is used. Therefore resetting a field may involve more than
restoring the field's original value.
What I was hoping I could do was store an jQuery object that contained
all of the information about the field and somehow (magically) use
that to overwrite the current representation of that same field.
Am I dreaming?
Thinking of other ways to solve this problem, is there a way with
jQuery to get the full html of an input element? The .html() method
doesn't do it.
On Mar 10, 12:02 pm, MorningZ morni...@gmail.com wrote:
You forgot an important part of the line
origFormData[this.name] = $(this);
and this is you need to store the value, so
origFormData[this.name] = $(this).val();
and on your other topic, the code was also provided to revert the
value back to the saved value
On Mar 10, 1:36 pm, Brad nrmlcrpt...@gmail.com wrote:
I have a need to reset individual form objects to their original
state. When the document loads I save the element like this:
var origFormData = {};
$(document).ready(function(){
// Save original form data for each input field
$(:input).each(function(){
origFormData[this.name] = $(this);
});
});
For example I have a form with fields named name, age, and dept
selectable by $(#name), $(#age), and $(#dept) respectably.
How would I go about later restoring/resetting a specific field. Is
there a simple way to overwrite the object represented by $(#name)
with origFormData.name?
[jQuery] Re: Reset individual form objects to their original display state
mkmanning's plugin, along with his recommendation to use jQuery's data
method instead of a global object, will work nicely.
To answer my other question re: getting the full html of an element,
there is this plugin: http://plugins.jquery.com/project/outerhtml.
On Mar 10, 1:16 pm, Brad nrmlcrpt...@gmail.com wrote:
I'll have a look. It sounds like this is the basis for what I need.
Thanks.
On Mar 10, 12:58 pm, mkmanning michaell...@gmail.com wrote:
Haven't tried it but you could use my getAttributes plugin (http://
plugins.jquery.com/project/getAttributes) to store the current
attributes in the data as I suggested, and then retrieve it later.
That would get you not only the value but all other attributes.
$(document).ready(function(){
$(:input).each(function(){
$(this).data('orig',$.getAttributes($(this)))
});
//to access original attributes of the input later, including value
console.log( $('some_input').data('orig').value );
console.log( $('some_input').data('orig').name);
});
On Mar 10, 11:43 am, Brad nrmlcrpt...@gmail.com wrote:
Thanks for the help on the other question. I missed the part about
reverting the value.
Actually I don't think that I need to explicitly store the value. If I
store the value of $(this) as shown I can later retrieve the value
for a specific field by e.g., calling ...
$(origFormData['age']).val()
..., but I need to explain my requirement in more detail.
Restoring the input field's value is only one part of the problem.
There are a number of other attributes that might need to be restored.
Depending on how the backend code originally displays the form, a
field can start out enabled or disabled. It can start out with a
special class assignment. These attributes can dynamically change as
the form is used. Therefore resetting a field may involve more than
restoring the field's original value.
What I was hoping I could do was store an jQuery object that contained
all of the information about the field and somehow (magically) use
that to overwrite the current representation of that same field.
Am I dreaming?
Thinking of other ways to solve this problem, is there a way with
jQuery to get the full html of an input element? The .html() method
doesn't do it.
On Mar 10, 12:02 pm, MorningZ morni...@gmail.com wrote:
You forgot an important part of the line
origFormData[this.name] = $(this);
and this is you need to store the value, so
origFormData[this.name] = $(this).val();
and on your other topic, the code was also provided to revert the
value back to the saved value
On Mar 10, 1:36 pm, Brad nrmlcrpt...@gmail.com wrote:
I have a need to reset individual form objects to their original
state. When the document loads I save the element like this:
var origFormData = {};
$(document).ready(function(){
// Save original form data for each input field
$(:input).each(function(){
origFormData[this.name] = $(this);
});
});
For example I have a form with fields named name, age, and dept
selectable by $(#name), $(#age), and $(#dept) respectably.
How would I go about later restoring/resetting a specific field. Is
there a simple way to overwrite the object represented by $(#name)
with origFormData.name?
[jQuery] Re: How do I adapt this code for multiple uses?
Ian, See the docs on how to develop a jQuery Plugin. http://docs.jquery.com/Plugins/Authoring. However, since your code applies to each instance of a given class and not specific elements it already appears to do what you want. For example I changed your form to have two inputs and gave the second one a maxlength of 40 for fun. I didn't change any JS code and both text inputs reflected remaining characters correctly. As long as you use that label input span structure and give the input class=word_count you can reuse that code. form action= method=post div class=input label for=field1Text:/label input type=text name=field1 id=field1 maxlength=50 class=word_count / span class=counter/span character(s) available /div !-- New Text Input here -- div class=input label for=field2Text:/label input type=text name=field3 id=field1 maxlength=40 class=word_count / span class=counter/span character(s) available /div /form On Mar 10, 5:42 pm, IanR i...@ianroke.co.uk wrote: I have got some codehttp://pastebin.com/mc99132cwhich counts how many characters have been entered in a textbox and subtracts it from the maxlength to show how many characters are left. If I add a new textbox I don't want to copy and paste the code down and rename the variables so is there a way of navigating the DOM tree to change just the element currently being edited? Cheers, Ian.http://pastebin.com/mc99132c
[jQuery] Re: A loading image in the centre of the screen
There is a way for the BlockUI to also show an image. By passing in an empty message (and possibly tweaking the CSS) I believe you can get it to do what you want. On Mar 9, 4:18 pm, phicarre gam...@bluewin.ch wrote: Ok but it is for a message, not for a loading image On 9 mar, 19:26, James james.gp@gmail.com wrote: Check out the BlockUI plugin:http://malsup.com/jquery/block/ On Mar 9, 8:21 am,phicarregam...@bluewin.ch wrote: I would like with jQuery to show a loading image in the centre of the screen that waits for everything to load. And whatever the browser ! Any solutions ? plugins ?
[jQuery] new Whitehouse.gov uses jQuery 1.2.9
just wanted to share that with everyone who doesn't follow me on identi.ca
[jQuery] .eq() vs .slice()
I'm making some modifications to an older project that originally used jQuery 1.1.2. I've installed 1.2.6 and am in the process of reviewing and upgrading the code based on the changes documented at http://docs.jquery.com/Release:jQuery_1.2#Removed_Functionality There are many places in this project where .eq(n) is used. From reading this group I've seen that .eq( ) went away with 1.2 but was brought back in 1.2.1? I also don't see any mention of .eq being deprecated in the latest docs at http://docs.jquery.com/Traversing/eq#index. Do I still need replace all instances of .eq with .slice? IMO, .eq reads easier. If I do, then for any integer n I simply replace .eq(n) with .slice(n, 1)? Thanks
[jQuery] Re: .eq() vs .slice()
Thanks for the confirmation. Maybe http://docs.jquery.com/Release:jQuery_1.2#Removed_Functionality should be revised to indicate that it was restored, unlike lt() and gt ()? On Dec 8, 9:28 am, ricardobeat [EMAIL PROTECTED] wrote: eq() is present in 1.2.6, you won't face any issues using it. - ricardo On Dec 8, 2:13 pm, Brad [EMAIL PROTECTED] wrote: I'm making some modifications to an older project that originally used jQuery 1.1.2. I've installed 1.2.6 and am in the process of reviewing and upgrading the code based on the changes documented athttp://docs.jquery.com/Release:jQuery_1.2#Removed_Functionality There are many places in this project where .eq(n) is used. From reading this group I've seen that .eq( ) went away with 1.2 but was brought back in 1.2.1? I also don't see any mention of .eq being deprecated in the latest docs athttp://docs.jquery.com/Traversing/eq#index. Do I still need replace all instances of .eq with .slice? IMO, .eq reads easier. If I do, then for any integer n I simply replace .eq(n) with .slice(n, 1)? Thanks
[jQuery] [autocomplete] local data source question
I'm using autocomplete and have some local data that looks like
var locations = [
{ name: ABB Bomem CAN, locationkey: 10049 },
{ name: ANL, locationkey: },
{ name: Applied Sys Eng, locationkey: 10028 },
{ name: BNL, locationkey: 10053 },
{ name: Campbell AUS, locationkey: 10012 },
{ name: Campbell UTAH, locationkey: 10015 },
...
];
This array is structures similar to the local data used in the
autocomplete 'email' example.
The problem I have is with how the plugin matches this data. I want
the matches restricted to the names only and not the locationkeys. For
example if someone types 100 all the locations with keys contain 100
show up as matches. That isn't desirable.
Is this possible or do I need to have two local arrays: one with the
names only and another that can be used to lookup the keys? I'll use
the keys to make an AJAX call to get all the data for a chosen
location.
Thanks
[jQuery] Re: local data source question
To answer my own question, set the formatMatch option.
...
,formatMatch: function(row, i, max) {
return row.name;
},
...
On Dec 8, 4:18 pm, Brad [EMAIL PROTECTED] wrote:
I'm using autocomplete and have some local data that looks like
var locations = [
{ name: ABB Bomem CAN, locationkey: 10049 },
{ name: ANL, locationkey: },
{ name: Applied Sys Eng, locationkey: 10028 },
{ name: BNL, locationkey: 10053 },
{ name: Campbell AUS, locationkey: 10012 },
{ name: Campbell UTAH, locationkey: 10015 },
...
];
This array is structures similar to the local data used in the
autocomplete 'email' example.
The problem I have is with how the plugin matches this data. I want
the matches restricted to the names only and not the locationkeys. For
example if someone types 100 all the locations with keys contain 100
show up as matches. That isn't desirable.
Is this possible or do I need to have two local arrays: one with the
names only and another that can be used to lookup the keys? I'll use
the keys to make an AJAX call to get all the data for a chosen
location.
Thanks
[jQuery] photoshop like image navigator
Just wondering if anyone can point me in the right direction for something that works a bit like the image navigation in Photoshop? I'm working with a large image and need a way for a user to be able to zoom it in and out and view the large image in relation to a thumbnail. The magnify plugin from Josh Nathanson (great plugin!) is nearly there but I need the large image visible initially and ideally be able to zoom in and drag around. thanks in advance Brad
[jQuery] blockUI, select box and IE6 (again)
I'm having the same problem that is documented at http://groups.google.com/group/jquery-en/browse_thread/thread/976e49897120d95c?tvc=2, but can't reply to that thread (too old?). To summarize the problem, with IE6, when blockUI is called the select boxes dissappear. When unblockUI is called they reappear. I have a form that has a number of multi-line select boxes, therefore this problem is very noticeable. The referenced thread above hinted at a fix, but didn't provide any details. Any ideas would be appreciated.
[jQuery] Re: Who knows how to use jQuery in Dreamweaver CS4?
http://dreamweaverforum.info/dreamweaver-application-development/117531-cs4-jquery-support.html On Nov 9, 1:49 pm, Shawphy [EMAIL PROTECTED] wrote: Thx~ But it is said that dwcs4support jQuery directly without extension On Nov 10, 2:17 am, Brad [EMAIL PROTECTED] wrote: This might be what your looking for: http://xtnd.us/dreamweaver/jquery(foundvia Google) On Nov 9, 1:44 am, Shawphy [EMAIL PROTECTED] wrote: Now I'm coding javascript in dwcs4,and it says dwcs4support jQuery code hinting, but I have no idea how to make it work, Any ideas?
[jQuery] Re: Who knows how to use jQuery in Dreamweaver CS4?
This might be what your looking for: http://xtnd.us/dreamweaver/jquery (found via Google) On Nov 9, 1:44 am, Shawphy [EMAIL PROTECTED] wrote: Now I'm coding javascript in dw cs4,and it says dw cs4 support jQuery code hinting, but I have no idea how to make it work, Any ideas?
[jQuery] Re: loading an array via Ajax
This thread contains the answer to my question: http://groups.google.com/group/jquery-en/browse_thread/thread/db0fb4fabce6630b/5eb2c5ac8b7f46f7?lnk=gstq=getJSON#5eb2c5ac8b7f46f7 On Nov 7, 4:40 pm, Brad [EMAIL PROTECTED] wrote: I have a case where I need to have a few global arrays and/or objects which will be used by numerous scripts. One example would be as a local lookup source for an autocompleter, while the same data might be used to populate a selection menu. The data isn't likely to change during a user's session, but might. I can get this data remotely every time I need it, but I'm hitting some performance problems in doing so. What I'd like to do is load these arrays/objects on page load, but make them globally accessible to other scripts for fast lookup. I also would like to do this in a generic fashion that would allow me to reload those arrays or objects if needed. I'm stumped on how to do this though? .getJSON? One of the other jQuery Ajax functions? Where I'm lost is that the array or object would be populated in a callback. Do to scoping, I don't see how to make it global?
[jQuery] loading an array via Ajax
I have a case where I need to have a few global arrays and/or objects which will be used by numerous scripts. One example would be as a local lookup source for an autocompleter, while the same data might be used to populate a selection menu. The data isn't likely to change during a user's session, but might. I can get this data remotely every time I need it, but I'm hitting some performance problems in doing so. What I'd like to do is load these arrays/objects on page load, but make them globally accessible to other scripts for fast lookup. I also would like to do this in a generic fashion that would allow me to reload those arrays or objects if needed. I'm stumped on how to do this though? .getJSON? One of the other jQuery Ajax functions? Where I'm lost is that the array or object would be populated in a callback. Do to scoping, I don't see how to make it global?
[jQuery] Re: hover question
That doesn't work in my case, but thanks again for the
recommendation. I should note that the code
// Insert HTML row into table
var tbody = $('tbody').appendTo('#' + target_id + ' table');
tbody.attr('id','id-' + row.shipment_id);
// This will highlight a tbody's rows on mouseEnter.
// The original row coloring will be restored on mouseLeave.
// A tbody may have numerous rows.
tbody.hover(function () { // -- tbody is a jQuery function
$(this).children('tr').addClass('hovered');
}, function () {
$(this).children('tr').removeClass('hovered');
});
is part of a larger loop. I'm binding the hover to each tbody as it is
dynamically inserted into the table.
My original example, does work. I was just looking for a way to make
the code smaller.
Thanks
On Oct 2, 2:01 pm, Leonardo K [EMAIL PROTECTED] wrote:
Try this:
$(tbody).find('tr').hover(function () {
$(this).addClass('hovered');
}, function () {
$(this).removeClass('hovered');
});
On Thu, Oct 2, 2008 at 16:39, Brad [EMAIL PROTECTED] wrote:
Leonardo,
I should have shown some more code. In my original example, tbody is a
reference to an jQuery object.
I'm working with a page that has many tables. Each table can have many
tbody elements. The number of rows in each tbody can vary, but in
all case there is more than 1. Unfortunately the site is behind a
firewall or I'd give a page.
// Insert HTML row into table
var tbody = $('tbody').appendTo('#' + target_id + ' table');
tbody.attr('id','id-' + row.shipment_id);
// This will highlight a tbody's rows on mouseEnter.
// The original row coloring will be restored on mouseLeave.
// A tbody may have numerous rows.
tbody.hover(function () { // -- tbody is a jQuery function
$(this).children('tr').addClass('hovered');
}, function () {
$(this).children('tr').removeClass('hovered');
});
What I was curious about is if I could do something like the
following, which doesn't work.
tbody.hover(function () {
// over
// wish rows will be exposed on 'out' (it won't)
var rows = $(this).children('tr');
tr.addClass('hovered');
}, function () {
// out
rows.removeClass('hovered'); // this doesn't work
});
Your example inspired me to try
$(tbody).children('tr').hover(function () {
$(this).addClass('hovered');
}, function () {
$(this).removeClass('hovered');
});
but that doesn't work either.
Thanks
On Oct 2, 11:56 am, Leonardo K [EMAIL PROTECTED] wrote:
$('tbody tr').hover(function () {
$(this).addClass('hovered');
}, function () {
$(this).removeClass('hovered');
});
[jQuery] Re: hover question
I'll check out livequery.
On Oct 2, 6:19 pm, ricardobeat [EMAIL PROTECTED] wrote:
The livequery plugin (http://brandonaaron.net/docs/livequery/) might
help you. You only bind the hover function once for a selector, and
all TR's subsequently added to the tables will have the event covered
with no need to bind it again.
And just so you know, this
tbody.hover(function () {
// over
// wish rows will be exposed on 'out' (it won't)
var rows = $(this).children('tr');
tr.addClass('hovered');
}, function () {
// out
rows.removeClass('hovered'); // this doesn't work
});
doesn't work because the 'rows' var is only known inside the first
function. You have to either declare it again on the other one or use
the jquery object directly.
- ricardo
On Oct 2, 5:44 pm, Brad [EMAIL PROTECTED] wrote:
Leonardo,
I looked at my actual code again and wondered what would happen if I
bound the hover at the end of the loop. Your recommendations partially
work if I do that. Since each tbody can have a variable number of
rows, my intent is to highlight all rows when hovered. Your examples
only highlight the first row, which isn't the desired affect. I could
simply style the whole tbody, but the results when doing that are
undesirable.
I'm most likely dealing with a special case here with some unusual
requirements. In most cases I would expect your recommendations to
work.
Thanks Again
On Oct 2, 2:25 pm, Brad [EMAIL PROTECTED] wrote:
That doesn't work in my case, but thanks again for the
recommendation. I should note that the code
// Insert HTML row into table
var tbody = $('tbody').appendTo('#' + target_id + ' table');
tbody.attr('id','id-' + row.shipment_id);
// This will highlight a tbody's rows on mouseEnter.
// The original row coloring will be restored on mouseLeave.
// A tbody may have numerous rows.
tbody.hover(function () { // -- tbody is a jQuery function
$(this).children('tr').addClass('hovered');
}, function () {
$(this).children('tr').removeClass('hovered');
});
is part of a larger loop. I'm binding the hover to each tbody as it is
dynamically inserted into the table.
My original example, does work. I was just looking for a way to make
the code smaller.
Thanks
On Oct 2, 2:01 pm, Leonardo K [EMAIL PROTECTED] wrote:
Try this:
$(tbody).find('tr').hover(function () {
$(this).addClass('hovered');
}, function () {
$(this).removeClass('hovered');
});
On Thu, Oct 2, 2008 at 16:39, Brad [EMAIL PROTECTED] wrote:
Leonardo,
I should have shown some more code. In my original example, tbody is a
reference to an jQuery object.
I'm working with a page that has many tables. Each table can have many
tbody elements. The number of rows in each tbody can vary, but in
all case there is more than 1. Unfortunately the site is behind a
firewall or I'd give a page.
// Insert HTML row into table
var tbody = $('tbody').appendTo('#' + target_id + ' table');
tbody.attr('id','id-' + row.shipment_id);
// This will highlight a tbody's rows on mouseEnter.
// The original row coloring will be restored on mouseLeave.
// A tbody may have numerous rows.
tbody.hover(function () { // -- tbody is a jQuery function
$(this).children('tr').addClass('hovered');
}, function () {
$(this).children('tr').removeClass('hovered');
});
What I was curious about is if I could do something like the
following, which doesn't work.
tbody.hover(function () {
// over
// wish rows will be exposed on 'out' (it won't)
var rows = $(this).children('tr');
tr.addClass('hovered');
}, function () {
// out
rows.removeClass('hovered'); // this doesn't work
});
Your example inspired me to try
$(tbody).children('tr').hover(function () {
$(this).addClass('hovered');
}, function () {
$(this).removeClass('hovered');
});
but that doesn't work either.
Thanks
On Oct 2, 11:56 am, Leonardo K [EMAIL PROTECTED] wrote:
$('tbody tr').hover(function () {
$(this).addClass('hovered');
}, function () {
$(this).removeClass('hovered');
});
[jQuery] hover question
This isn't so much about hover, but about the selectors I've had to
use within its 'over' and 'out' functions.
Consider the following. I'm working on a project where I'll have to
repeat this pattern often.
I'll hover over a table's tbody, but will need to affect rows or even
specific row cells within that tbody.
// This will highlight a tbody's rows on mouseEnter.
// The original row coloring will be restored on mouseLeave.
// A tbody may have numerous rows.
tbody.hover(function () {
$(this).children('tr').addClass('hovered');
}, function () {
$(this).children('tr').removeClass('hovered');
});
In the above I had to repeatedly specify
$(this).children('tr')
Is there a shorthand way to only specify it once in the over function
and refer to that in the out?
Similar patterns would apply to toggle, etc.
Thanks!
[jQuery] Re: hover question
Leonardo,
I should have shown some more code. In my original example, tbody is a
reference to an jQuery object.
I'm working with a page that has many tables. Each table can have many
tbody elements. The number of rows in each tbody can vary, but in
all case there is more than 1. Unfortunately the site is behind a
firewall or I'd give a page.
// Insert HTML row into table
var tbody = $('tbody').appendTo('#' + target_id + ' table');
tbody.attr('id','id-' + row.shipment_id);
// This will highlight a tbody's rows on mouseEnter.
// The original row coloring will be restored on mouseLeave.
// A tbody may have numerous rows.
tbody.hover(function () { // -- tbody is a jQuery function
$(this).children('tr').addClass('hovered');
}, function () {
$(this).children('tr').removeClass('hovered');
});
What I was curious about is if I could do something like the
following, which doesn't work.
tbody.hover(function () {
// over
// wish rows will be exposed on 'out' (it won't)
var rows = $(this).children('tr');
tr.addClass('hovered');
}, function () {
// out
rows.removeClass('hovered'); // this doesn't work
});
Your example inspired me to try
$(tbody).children('tr').hover(function () {
$(this).addClass('hovered');
}, function () {
$(this).removeClass('hovered');
});
but that doesn't work either.
Thanks
On Oct 2, 11:56 am, Leonardo K [EMAIL PROTECTED] wrote:
$('tbody tr').hover(function () {
$(this).addClass('hovered');
}, function () {
$(this).removeClass('hovered');
});
[jQuery] Re: hover question
Leonardo,
I looked at my actual code again and wondered what would happen if I
bound the hover at the end of the loop. Your recommendations partially
work if I do that. Since each tbody can have a variable number of
rows, my intent is to highlight all rows when hovered. Your examples
only highlight the first row, which isn't the desired affect. I could
simply style the whole tbody, but the results when doing that are
undesirable.
I'm most likely dealing with a special case here with some unusual
requirements. In most cases I would expect your recommendations to
work.
Thanks Again
On Oct 2, 2:25 pm, Brad [EMAIL PROTECTED] wrote:
That doesn't work in my case, but thanks again for the
recommendation. I should note that the code
// Insert HTML row into table
var tbody = $('tbody').appendTo('#' + target_id + ' table');
tbody.attr('id','id-' + row.shipment_id);
// This will highlight a tbody's rows on mouseEnter.
// The original row coloring will be restored on mouseLeave.
// A tbody may have numerous rows.
tbody.hover(function () { // -- tbody is a jQuery function
$(this).children('tr').addClass('hovered');
}, function () {
$(this).children('tr').removeClass('hovered');
});
is part of a larger loop. I'm binding the hover to each tbody as it is
dynamically inserted into the table.
My original example, does work. I was just looking for a way to make
the code smaller.
Thanks
On Oct 2, 2:01 pm, Leonardo K [EMAIL PROTECTED] wrote:
Try this:
$(tbody).find('tr').hover(function () {
$(this).addClass('hovered');
}, function () {
$(this).removeClass('hovered');
});
On Thu, Oct 2, 2008 at 16:39, Brad [EMAIL PROTECTED] wrote:
Leonardo,
I should have shown some more code. In my original example, tbody is a
reference to an jQuery object.
I'm working with a page that has many tables. Each table can have many
tbody elements. The number of rows in each tbody can vary, but in
all case there is more than 1. Unfortunately the site is behind a
firewall or I'd give a page.
// Insert HTML row into table
var tbody = $('tbody').appendTo('#' + target_id + ' table');
tbody.attr('id','id-' + row.shipment_id);
// This will highlight a tbody's rows on mouseEnter.
// The original row coloring will be restored on mouseLeave.
// A tbody may have numerous rows.
tbody.hover(function () { // -- tbody is a jQuery function
$(this).children('tr').addClass('hovered');
}, function () {
$(this).children('tr').removeClass('hovered');
});
What I was curious about is if I could do something like the
following, which doesn't work.
tbody.hover(function () {
// over
// wish rows will be exposed on 'out' (it won't)
var rows = $(this).children('tr');
tr.addClass('hovered');
}, function () {
// out
rows.removeClass('hovered'); // this doesn't work
});
Your example inspired me to try
$(tbody).children('tr').hover(function () {
$(this).addClass('hovered');
}, function () {
$(this).removeClass('hovered');
});
but that doesn't work either.
Thanks
On Oct 2, 11:56 am, Leonardo K [EMAIL PROTECTED] wrote:
$('tbody tr').hover(function () {
$(this).addClass('hovered');
}, function () {
$(this).removeClass('hovered');
});
[jQuery] Dialog Box Too Small
Thanks for taking the time to read my question.
I have a dialog box on my page that pops up after clicking the link.
My problem is that when it comes up, it is too small. My content requires
the size of the dialog box to be both wider and taller.
I've downloaded jquery-ui-themeroller.css from Themeroller.
I've tried to add width and height to .ui-dialog, but it doesn't make a
difference to the size. I can change the border width, and that changes...
I've tried resizing the background image, but that doesn't change anything
either. I made it 200px high and kept the width.
How can I make my dialog box larger?
Thanks,
Brad
.ui-dialog {
/*resets*/margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3;
text-decoration: none; font-size: 100%; list-style: none;
font-family: Verdana, Arial, sans-serif;
font-size: 12px;
background: #ff url(Images/Dialog/ff_40x100_textures_01_flat_0.png)
0 0 repeat-x;
color: #22;
border: 10px solid #dd;
position: re
--
Brad McIntyre
[jQuery] Re: Can I use a variable to reference object properties?
var myCategory;
If (eating cheese)
myCategory = data.cheese;
If (eating bread)
myCategory = data.bread;
...
$.each(myCategory, function(i, item)
{ do a ton of stuff
}
Another option is to use eval(), but that command is evil. :)
myType = cheese;
eval(myCategory = data. + myType + ;); // untested
$.each(myCategory, function(i, item)
{ do a ton of stuff
}
On Sep 11, 1:10 pm, cbandes [EMAIL PROTECTED] wrote:
Hi - I have a function which iterates through a json file in order to
build an FAQ page. Within the json are several different categories,
and I want to make a generic function that will return only the
appropriate items from the chosen category.
Currently it looks like this:
$.getJSON(faq_json.js, function(data)
{
$.each(data.cheese, function(i, item)
{ do a ton of stuff
}
But let's say I want to display stuff that isn't in data.cheese - like
the stuff from data.meat or data.bread - currently I would need to
hardcode those in.
What I had hoped to do was this:
var myCategory = cheese;
$.each(data.myCategory, function(i, item)
{ do a ton of stuff
}
But that doesn't work. I'm sure there's a simple fix, but I have no
idea where to look... (Yeah, I'm a n3wB ;) thanks for your patience!)
[jQuery] uiTabs - Reference to self during Init.
I have the following uiTabs initialization code in my $
(document).ready function:
var $tabs = $(#tabarea ul).tabs(
{ selected: 0
, disabled:[2]
, spinner:''
, cache:true
, ajaxOptions: { cache: false }
, load: function(e,ui) {
handleTabLoad(ui.index,this); // this doesn't =
$tabs?
}
, select: function(e,ui) {
handleTabSelect(ui.index);
}
, show: function(e,ui) {
handleTabShow(ui.index);
}
});
I've created functions to handle tab loading, selecting, etc. For
example handleTabLoad will to be able to do reference $tabs?
The problem I'm having is that in the handleTabLoad function I need a
reference to the tab area that is being initialized. Is that possible?
[jQuery] Re: uiTabs - Reference to self during Init.
Let me try to better explain what I'm trying to do.
I have a page that has 5 tabs on it. These tabs are loaded via Ajax.
Each loaded tab can contain a relatively complex form. These forms
also use AJAX.
Some of these forms contain help text that may refer a user to
features in another tab. I'd like to include links in the help text
that can be used as tab switch shortcuts. The UI Tabs docs give an
example of how to do this.
var $tabs = $('#example ul').tabs(); // first tab selected
$('#my-text-link').click(function() { // bind click event to link
$tabs.tabs('select', 2); // switch to third tab
return false;
});
The problem I'm having is that if declare that first line when I load
a tab that has the help text, it appears that it it totally
reinitializing the tab object.
I note that .tabs' load, select, and show option functions do have
visibility to ui. I've changed my initialization code to this:
var $tabs = $(#tabarea ul).tabs(
{ selected: 0
, disabled:[2]
, spinner:''
, cache:true
, ajaxOptions: { cache: false }
, load: function(e,ui) {
handleTabLoad(ui); // this doesn't =
$tabs?
}
, select: function(e,ui) {
handleTabSelect(ui);
}
, show: function(e,ui) {
handleTabShow(ui);
}
});
My hope was that passing ui to handleTabLoad would somehow provide a
reference to that tab control so that I could do something like this:
$('#my-text-link').click(function() { // bind click event to link
tabctl.tabs('select', 2); // switch to third tab, where tabctl was
determined from ui
return false;
});
I've poked around with Firebug, but I'm not seeing what I need.
Any ideas would be appreciated.
On Sep 10, 12:01 pm, I wrote:
I have the following uiTabs initialization code in my $
(document).ready function:
var $tabs = $(#tabarea ul).tabs(
{ selected: 0
, disabled:[2]
, spinner:''
, cache:true
, ajaxOptions: { cache: false }
, load: function(e,ui) {
handleTabLoad(ui.index,this); // this doesn't
= $tabs?
}
, select: function(e,ui) {
handleTabSelect(ui.index);
}
, show: function(e,ui) {
handleTabShow(ui.index);
}
});
I've created functions to handle tab loading, selecting, etc. For
example handleTabLoad will to be able to do reference $tabs?
The problem I'm having is that in the handleTabLoad function I need a
reference to the tab area that is being initialized. Is that possible?
[jQuery] Re: Working on website trying to make a list.
Aaron, Normally you control that output server-side by limiting the result in your SQL. Look at help for the SELECT statement and the LIMIT clause. If you really want to send everything back at once, you'll need to set up the table HTML so that it looks something like table thead trth.../thth.../thth.../th/tr /thead thead trtd.../thtd.../tdth.../td/tr /thead /table On Sep 10, 2:03 pm, Aaron [EMAIL PROTECTED] wrote: I am working on a website and I am trying to create a table. I plan to use php to generate the table with data from the mysql database to fill up the table however I want to set a max on that amount and if it goes over I want to generate other pages or create on the fly links to load to take the data that is in the table and load in the other data. I can't fully explain it. SO examples would be like ebay or any board form if you notice like on ebay if you searched cars and you get all the listings of cars and notice that their are links on top of the table saying 1,2,3,4,5,6,next ect. How can I generate something like that where I can list data that has been stored. I just want to make a table which when it is to the limit it would generate a link or something that would display the new information. I was hoping I could do this with javascript. SO for example lets say I have 100 posts listed but I want to make the code in a way where it divides this 100 posts into pages so if I can fit only 20 per page then this would mean I would need to generate 5 pages that display 20 posts each page. What could you suggest to me is the best way on doing this??
[jQuery] Re: Working on website trying to make a list.
Aaron, Normally you control that output server-side by limiting the result in your SQL. Look at help for the SELECT statement and the LIMIT clause. If you really want to send everything back at once, you'll need for PHP to output the table HTML so that it looks something like this skeleton. table thead trth.../thth.../thth.../th/tr /thead tbody id=page1 trtd.../tdtd.../tdtd.../td/tr ... trtd.../tdtd.../tdtd.../td/tr /tbody tbody id=page2 trtd.../tdtd.../tdtd.../td/tr ... trtd.../tdtd.../tdtd.../td/tr /tbody ... etc ... tbody id=page10 trtd.../tdtd.../tdtd.../td/tr ... trtd.../tdtd.../tdtd.../td/tr /tbody /table Each tbody will contain 20 rows of output. The last one will contain from 1-20 rows depending on your page size. You'll need to also output links that correspond to the various pages. Your Javascript will hide all all tbody, except for the page you want to display. Look at the jQuery show() and hide() functions. You'll need to bind a click event to each of the page links. That event would have a function that hides the pages you don't want to show, and shows the page you do. You might also want to look at this plugin. http://plugins.jquery.com/project/pagination On Sep 10, 2:03 pm, Aaron [EMAIL PROTECTED] wrote: I am working on a website and I am trying to create a table. I plan to use php to generate the table with data from the mysql database to fill up the table however I want to set a max on that amount and if it goes over I want to generate other pages or create on the fly links to load to take the data that is in the table and load in the other data. I can't fully explain it. SO examples would be like ebay or any board form if you notice like on ebay if you searched cars and you get all the listings of cars and notice that their are links on top of the table saying 1,2,3,4,5,6,next ect. How can I generate something like that where I can list data that has been stored. I just want to make a table which when it is to the limit it would generate a link or something that would display the new information. I was hoping I could do this with javascript. SO for example lets say I have 100 posts listed but I want to make the code in a way where it divides this 100 posts into pages so if I can fit only 20 per page then this would mean I would need to generate 5 pages that display 20 posts each page. What could you suggest to me is the best way on doing this??
[jQuery] Fwd: Dialog
Hi,
I'm just learning how to use jquery and really like the Modal Dialog with
Overlay widget. (
http://dev.jquery.com/view/trunk/ui/demos/functional/#ui.dialog) I'm having
problems getting it to work though, and am unsure what I'm doing wrong.
I want a dialog box with a form in it to pop up when text LogMeIn is
clicked.
The code runs until:
alert(Hi);
Then the status bar at the bottom says Done but has the yellow triangle
beside it denoting that the code didn't complete correctly, and the *div*id=
*LID *does not appear.
*Here is my JavaScript (**LogInDialog.js**):*
$(*document*).*ready*(*function*(){
$(*#LIDlink*).*click*(*function*(){
*alert*(*Hi*);
$(*#LID*).*dialog*({ *modal*: *true*, *overlay*: { *opacity*:
0.5, *background*: *black* } });
//Taken from
http://dev.jquery.com/view/trunk/ui/demos/functional/#ui.dialog
//Then select Modal Dialog with Overlay from the combo box and
click on view source
});
});
*Here is my HTML:*
*link* href=*ZA.css* rel=*stylesheet* type=*text/css* */*
*script* type=*text/javascript* src=*
Javascript/jquery-1.2.6.min.js/script*
*script* type=*text/javascript* src=*
Javascript/LogInDialog.js/script*
* *
*- - - - - - - *
*h4* id=*LIDlink* class=*CSLink*LogMeIn*/h4*
*div* id=*LID
* *form* name=*'logmeinsupport'* action=*'**
https://secure.logmeinrescue.com/Customer/Code.aspx**'* method=*'post'*
*table*
*trtd*Enter your 6-digit PIN code: */tdtdinput* type=*
'text'* name=*'Code'* value=*''* *//td/tr*
*trtd* colspan=*'2'input* type=*'submit'* value=*'Connect to
technician'* *//td/tr*
*/table*
*input* type=*'hidden'* name=*'tracking0'* maxlength=*'64'* value=
*''* */* *!-- optional --
* *input* type=*'hidden'* name=*'language'* maxlength=*'5'* value=*
''* */* *!-- optional --*
*input* type=*'hidden'* name=*'hostederrorhandling'* value=*''* *
/* *!-- optional --*
*/form*
*/div*
*Here is my CSS:*
*#LID** {*
*display**:* none*;*
*background-color**:* *#8194CC**;*
*width**:* *375*px*;*
*height**:* *75*px*;*
*border**:* *#cc* solid *2*px*;*
*padding**:* *4*px*;*
*margin**:* *0*px*;*
*z-index**:* *2**;*
*position**:* absolute*;*
*/*top: -90px;
left: 300px;*/*
*}*
*#LIDlink** {*
*cursor**:* pointer*;*
*display**:* block*;*
*width**:* *110*px*;*
*background-color**:* green*;*
*}*
I've spent many hours trying to figure out what I'm doing wrong, but have
not come up with the solution. Any help would be appreciated.
Thanks,
Brad
--
Brad McIntyre
[jQuery] Re: Determine if a Javascript has loaded?
Here is a different approach. Include the javascript source for the
weather.ibegin.com in the body of your page. On load run a delayed
function to see if it has written its forecast to your page. I ran
this on a test page and it worked. I could never get the ibegin source
to fail, therefore I had to change the script source to something else
like http://foo.weather.ibegin.com/... to simulate failure. BTW, I was
playing with the widget, so my example gets a different forecast than
yours.
script
var ibeginHTML;
function ibeginLoaded() {
ibeginHTML = $(#ibegin div).html();
if (ibeginHTML == null) {
alert('Widget not loaded');
// You'd do something useful here like insert your
missing widget
image
}
}
function ibeginTest() {
// Give the widget a few seconds to load
setTimeout('ibeginLoaded();',2000);
}
$().ready(function(){
ibeginTest();
});
/script
/head
body
... other content ...
div id=ibegin
script type=text/javascript src=http://foo.weather.ibegin.com/js/
us/nm/santa+fe/1/1/1/1/1/
custom.jsbackground_color=ffcolor=00width=175padding=10border_width=1border_color=00font_size=11font_family=Tahomashowicons=1/
scriptnoscripta href=http://weather.ibegin.com/;Weather
Information by iBegin/a/noscript
/div
... more content ...
/body
/html
On Sep 7, 3:55 pm, bcbounders [EMAIL PROTECTED] wrote:
OK... so here's what I've got so far. I'm trying to work out the
jQuery so that if the iBegin weather widget is successfully loaded,
then the div id=weather is shown... otherwise, it's hidden.
script type=text/javascript
jQuery.ready(function(){
jQuery(#weather).replaceWith({
jQuery.ajax({
type: GET,
dataType: script,
url:
http://weather.ibegin.com/js/us/ak/ninilchik/0/0/1/1/0/
custom.jsbackground_color=transparentcolor=093384width=200padding=0border_width=0border_color=transparentfont_size=18font_family=inheritshowicons=1,
success: function(){
jQuery(#weather).show()
},
error: function(){
jQuery(#weather).hide()
}
});
});
});
/script
But... what I've got isn't working. And, being new to jQuery (and
Javascript), I'm not sure why it's not working... or even if this is
the best route to try and achieve what I want.
Can someone take a look and provide some feedback? I'd really
appreciate it!
Thanks a lot!
- John
On Sep 6, 10:49 am, bcbounders [EMAIL PROTECTED] wrote:
Rene,
Thanks so much for posting.
I got the site up, using the iBegin weather widget on it's own. If it
helps, here's a link: http://tinyurl.com/5n8mco
I'll take a stab at doing what you suggest... wish me luck! :D But...
expect to hear more questions from me soon.
- John
[jQuery] blockUI styling question
I'd like to accomplish a couple of things with BlockUI. I suspect
these can be done by changing styles and other settings but I haven't
been able to achieve the desired affect.
1. I want the mask to be transparent. IOW, the user should not be
aware of the overlay, but also shouldn't be able to interact with the
page during blocking. In some cases my blocking is very short. Some
users have commented What was that?
What background color and opacity settings would I need to achieve
this?
2. I'd like to position the blocking message so that it always appears
in the upper right hand corner of the viewport. I also would like the
message to not have any borders and would like for the message to be
preceded by a spinning gif. Example text would be Reloading...,
Saving..., Updating...
Has anyone done anything close to this, do you have a style example?
Is it best to
$.blockUI.defaults.css = {};
and use my own style sheet?
Thanks
[jQuery] Re: blockUI styling question
Thanks for the feedback. I'm getting closer How do I set a delay on the unblock? Is that the fadeOut setting? On Sep 4, 2:24 pm, MorningZ [EMAIL PROTECTED] wrote: #1: http://malsup.com/jquery/block/#options the overlayCSS-s opcaity is what you need to adjust #2: you'd set the css properties of top and left to point you up closer to the top right corner and just a side note, thinking as an end user, i would think more people would be what was that by *not* seeing the overlay, than seeing no change in the page (save your top right Saving.., Uploading.., etc) and not being able to click/whatever things on the page perhaps setting a slight delay on the unblock call so they see it for at least a second or so?
[jQuery] Not selector help (Solved)
How to use :not in the selector was throwing me. Docs were down, but
back up (but very slow).
$
([type=checkbox]:not('#specific_checkbox_id')).removeAttr('checked')
On Sep 3, 12:57 pm, Brad [EMAIL PROTECTED] wrote:
I'm looking for the quickest way to uncheck all of the checkboxes on a
page except for one with a given idea. I realize I could uncheck all,
then check one, but I'm curious if I can leverage not: to accomplish
what I want to do?
[jQuery] Not selector help
I'm looking for the quickest way to uncheck all of the checkboxes on a page except for one with a given idea. I realize I could uncheck all, then check one, but I'm curious if I can leverage not: to accomplish what I want to do?
[jQuery] Re: Store a Css class as a variable?
Matthew,
.css() doesn't return a class Name. In your example it might return
the background image url. Here's an example console dump from a banner
of a site I work on:
var foo = $(#banner).css('background-image');
foo
url(http://www.mysite.com/img/homebanner.jpg)
You can try something like this:
var className = $(this).attr('class')
and then use addClass, but that is assuming the matched element(s) has
a class. I can see circumstances where that will return more than one
class or could result in unexpected results.
I don't know if there is a way to iterate over each of a jQuery
objects CSS properties. If there is you could conceivably read each
then set the css attribute of the target div.
On Sep 3, 2:35 pm, Matthew [EMAIL PROTECTED] wrote:
Hi, I just started playing with jquery yesterday and I'm interested in
assigning the css class of an a element to a variable and then
applying that class to a div in another section.
While I've been looking through multiple tutorials and searching on
the discussion board I haven't seen it.
i.e.
$(#exampleClass a).click(function()
{
var className = $(this).css(background-image);
$(#TargetDiv).addClass(className); // where
className is the variable
});
});
Any guidance/help would be much appreciated!
[jQuery] Re: Multiple AJAX calls problem
Basically, that article, and its Part 1 which is linked at its beginning, talk about the various ways to work around the behavior you are seeing. See http://docs.jquery.com/Frequently_Asked_Questions#Re-binding Yes that solution is mentioned. Even though micah's suggesting his is quick and dirty it is a viable solution. The Part 1 article, which can be found here: http://www.learningjquery.com/2008/03/working-with-events-part-1, contains 3 links to plugins that may help you manage this situation. Note that the plugin links are in the first paragraph and labeled these three plugins. Note that each word in that link is a separate link. On Sep 1, 4:37 pm, me-and-jQuery [EMAIL PROTECTED] wrote: Hi Brad. Here I can see the same hint as micah was talking about (unbind and then bind). Or do you have any other solution in mind? Thanks. On Aug 31, 2:51 am, Brad [EMAIL PROTECTED] wrote: Have a look at the article athttp://www.learningjquery.com/2008/05/working-with-events-part-2.
[jQuery] Re: simple fade in/out
Chris,
I don't have access to a public test server to create a demo, but I'll
see if I can create a test case.
You might also want to look at the .hover command.
Can't you do this with normal CSS, or must you have a fancy fadein/
fadeout effect?
Have you considered the the case where someone rolls over the link
quickly? Any fade in or fade out will have some execution time
associated with it.
Brad
On Aug 31, 10:42 am, chris [EMAIL PROTECTED] wrote:
thanks for your help but I can't get it to work.
Anyway you can make a test case or something for me, I am just looking
for a link to have a background color and when you rollover the link
it fades in a new background color, than on rollout it fades that
background color out.
On Aug 30, 8:09 pm, Brad [EMAIL PROTECTED] wrote:
Untested, but it may be as simple as something like this:
$(.classname).mouseover(function(){
$(this).fadein();
}).mouseout(function(){
$(this).fadeout();
});
Look at the page examples for fadein and fadeout at docs.jquery.com.
If you need more control over the effects or want different fadein and
fadeout colors you may need to use the animate effect instead.
On Aug 30, 10:56 am, chris [EMAIL PROTECTED] wrote:
anyone have a script or tutorial that just targets a .class so
on :hover it fades in a background color than fades out a background
color on roll out.
thanks :)
[jQuery] Re: simple fade in/out
Chris,
A simple example that shows the background color of a link changing on
hover. This same effect could be achieved through pure CSS.
html
head
meta http-equiv=Content-Type content=text/html;
charset=iso-8859-1 /
titleUntitled Document/title
script src=jquery-1.2.6.min.js type=text/javascript/script
script type=text/javascript
$(document).ready(function(){
var bg = $(a).css('background-color'); // save to restore
$(a).hover(
function () {
$(this).css({'background-color':'red'});
},
function () {
$(this).css({'background-color': bg });
}
);
});
/script
/head
body
a href=#one/a
a href=#two/a
a href=#three/a
/body
/html
This doesn't fade in and out but simply changes the background color.
I tried animate instead of css, but I don't think that animate can
change colors. If you really want a fade affect you may have to write
a function that progressively changes the background color from
orginal to final and vice versa. Search this form for animate change
color. There might even be a plugin that will do what you want.
hth
I don't have access to a public test server to create a demo, but I'll
see if I can create a test case.
[jQuery] Re: IE Problem with jquery in dynamically loaded iframe.
I can't tell from your example, but in my experience works in other
browsers but not IE6 can usually be traced to invalid HTML markup.
Also if your actual code has any more object literals than shown make
sure they don't contain a trailing comma, e.g.,
{
name: 'foo',
status: 'bar',
}
On Aug 31, 5:10 pm, ScottyUCSD [EMAIL PROTECTED] wrote:
This is a simplified example of an app that I'm working on. Can anyone
figure out why this isn't working in IE6?
[jQuery] Re: jquery - adding flexibility to a function
The selector is a string. Therefore with a slight modification you
should be able to do this
script type=text/javascript
function loadContent(id) {
$(#contentArea+id).load(rpc.php?o=+id+);
}
/script
On Aug 31, 6:47 pm, TheOriginalH [EMAIL PROTECTED] wrote:
script src=jquery-latest.js type=text/javascript/script
script type=text/javascript
function loadContent(id) {
$(#contentArea).load(rpc.php?o=+id+);
}
/script
Works well, but I'd like the function to work for an area with a
variable div. So if the function is called with an id of 6, it loads
the content to #contentArea6. Any ideas on how to achieve it? TIA.
[jQuery] Re: simple fade in/out
Untested, but it may be as simple as something like this:
$(.classname).mouseover(function(){
$(this).fadein();
}).mouseout(function(){
$(this).fadeout();
});
Look at the page examples for fadein and fadeout at docs.jquery.com.
If you need more control over the effects or want different fadein and
fadeout colors you may need to use the animate effect instead.
On Aug 30, 10:56 am, chris [EMAIL PROTECTED] wrote:
anyone have a script or tutorial that just targets a .class so
on :hover it fades in a background color than fades out a background
color on roll out.
thanks :)
[jQuery] Re: Multiple AJAX calls problem
Have a look at the article at http://www.learningjquery.com/2008/05/working-with-events-part-2.
[jQuery] UI Tabs IE Style Problem
I'm using the latest Tabs in a project that already has an established page layout. I'm using the tab styles like the ones at http://stilbuero.de/jquery/tabs_3/. On Mozilla, Opera and Safari the tabs display fine, but on IE 6 the space below the tab label and tab bottom is missing. As a result in IE 6 the tab height is less than in the other browsers, and the font descenders touch the tab base. BTW, Is there a way to include screenshots in this forum? I'm certain that something in the page's existing CSS is cascading to the Tab's CSS, but since it doesn't happen in the other browsers, I'm having a hard time figuring out what it is. I'm not a CSS expert but know that there are some quirks in IE. I have included the special IE CSS file, as shown below, but that doesn't help. !--[if lte IE 7] link rel=stylesheet href=tabs_ie.css type=text/css media=projection, screen / ![endif]-- If anyone can offer any suggestions I'd greatly appreciate it.
[jQuery] Re: UI Tabs IE Style Problem
After a lot of trial and error I determined that the site's existing CSS was NOT at fault. From there I started looking at page markup. What I eventually found was that every page is dynamically generated and shares a common header. The first line in every page is: ?xml version=1.0 encoding=iso-8859-1? Removing it fixes the problem. -- Brad On Aug 29, 9:13 am, Brad [EMAIL PROTECTED] wrote: I'm using the latest Tabs in a project that already has an established page layout. I'm using the tab styles like the ones athttp://stilbuero.de/jquery/tabs_3/. On Mozilla, Opera and Safari the tabs display fine, but on IE 6 the space below the tab label and tab bottom is missing. As a result in IE 6 the tab height is less than in the other browsers, and the font descenders touch the tab base. BTW, Is there a way to include screenshots in this forum? I'm certain that something in the page's existing CSS is cascading to the Tab's CSS, but since it doesn't happen in the other browsers, I'm having a hard time figuring out what it is. I'm not a CSS expert but know that there are some quirks in IE. I have included the special IE CSS file, as shown below, but that doesn't help. !--[if lte IE 7] link rel=stylesheet href=tabs_ie.css type=text/css media=projection, screen / ![endif]-- If anyone can offer any suggestions I'd greatly appreciate it.
[jQuery] [Autocomplete] Detecting mustMatch failure.
I have a number of fields that are using the AutoComplete plugin
instead of select menus. When a user enters and selects a match a
number of other fields are populated via a .getJSON.
$(#f_orig_lookup)
.autocomplete(
index.php,
loc_lookup_obj) // loc_lookup_obj is a shared
configuration object.
.result(function(event, data, formatted) {
if (data){
$.getJSON(
?type=remoteaction=location_by_idid=+data[1],
function(data){
loadLocationInfo(data,'orig');
});
} else {
// debug
alert ('no data'); // - THIS NEVER ALERTS
}
});
The problem I have is this. A user does a lookup, then returns to the
same field and enters non-matching text. The mustMatch causes the
autocomplete field to clear, but the autocomplete .result doesn't
fire
What I need to do is clear any pre-filled fields if mustMatch. Is
there any easy way to detect that the mustMatch did it's job?
[jQuery] AutoComplete Detecting mustMatch failure.
Changing subject.
I had originally entered [AutoComplete] Detecting mustMatch failure
and the forum ate [AutoComplete].
On Aug 20, 2:40 pm, Brad [EMAIL PROTECTED] wrote:
I have a number of fields that are using the AutoComplete plugin
instead of select menus. When a user enters and selects a match a
number of other fields are populated via a .getJSON.
$(#f_orig_lookup)
.autocomplete(
index.php,
loc_lookup_obj) // loc_lookup_obj is a shared
configuration object.
.result(function(event, data, formatted) {
if (data){
$.getJSON(
?type=remoteaction=location_by_idid=+data[1],
function(data){
loadLocationInfo(data,'orig');
});
} else {
// debug
alert ('no data'); // - THIS NEVER ALERTS
}
});
The problem I have is this. A user does a lookup, then returns to the
same field and enters non-matching text. The mustMatch causes the
autocomplete field to clear, but the autocomplete .result doesn't
fire
What I need to do is clear any pre-filled fields if mustMatch. Is
there any easy way to detect that the mustMatch did it's job?
[jQuery] Re: AutoComplete Detecting mustMatch failure.
I found a workaround, but it isn't great.
If I attach a .blur(handler) to the autocomplete field I can clear the
related fields when the user leaves that field by checking for
val()==''.
I'd love to hear that there is a way to do the same when mustMatch
clears the autocomplete field. I'd like to clear the related fields
immediately and not wait for the user to go to another field.
On Aug 20, 2:45 pm, Brad [EMAIL PROTECTED] wrote:
Changing subject.
I had originally entered [AutoComplete] Detecting mustMatch failure
and the forum ate [AutoComplete].
On Aug 20, 2:40 pm, Brad [EMAIL PROTECTED] wrote:
I have a number of fields that are using the AutoComplete plugin
instead of select menus. When a user enters and selects a match a
number of other fields are populated via a .getJSON.
$(#f_orig_lookup)
.autocomplete(
index.php,
loc_lookup_obj) // loc_lookup_obj is a shared
configuration object.
.result(function(event, data, formatted) {
if (data){
$.getJSON(
?type=remoteaction=location_by_idid=+data[1],
function(data){
loadLocationInfo(data,'orig');
});
} else {
// debug
alert ('no data'); // - THIS NEVER ALERTS
}
});
The problem I have is this. A user does a lookup, then returns to the
same field and enters non-matching text. The mustMatch causes the
autocomplete field to clear, but the autocomplete .result doesn't
fire
What I need to do is clear any pre-filled fields if mustMatch. Is
there any easy way to detect that the mustMatch did it's job?
[jQuery] Re: JQuery 1.2.6 and JQuery Form Plugin in IE7
Has there been any progress on this issue? I'm having the same 1.2.6/
jquery.forms issue, and commenting out line 203 doesn't work for me.
I'd really like to use the newer jQuery build, but I need the forms
functionality.
~bck
On Jul 7, 1:04 pm, fgubert [EMAIL PROTECTED] wrote:
I have a similar problem.
I've changed my server from linux (apache2.2/php5) to a windows server (with
apache2.2/php5).
SAME CODE works fine on linux server at IE7/FF3, but doesnt works on windows
server only at IE7.
I have another server (xampp, with windows vista business) that runs ok for
both browsers.
I try the downgrade to older jquery versions, but doesnt work as well.
Anyone have any ideia of how to correct this problem?
My entire intranet is using jquery/form plugin and doesnt work anymore.
My code is very simple:
var options = {
success: function(data) {
alert(data);
}};
$(document).ready(function() {
$('#ponto').ajaxForm(options);});
--
View this message in
context:http://www.nabble.com/JQuery-1.2.6-and-JQuery-Form-Plugin-in-IE7-tp18...
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Iterating returned JSON?
I'm using getJSON and PHP is returning JSON that looks like this (I
inserted returns for readability)
[{
id:220,
choice_name:Foobar,
loc_affiliation:Foobar Inc.,
address:c\/o Some Co, Inc.\r\n999 W. 104th Street\r\nInglewood, CA
90304\r\nU.S.A.,
is_usa_address:1,
phone_no:562-555-5965,
fax_no:null,
email_addr:null,
contact_name:John Doe
}]
What I would like to do is iterate each name value pair in the object
and process it accordingly.
If tried jQuery's each() and a for (val in object) but I'm only seeing
id, choice_name, etc. I can't access the values.
What am I missing?
[jQuery] Re: Select option name attribute
Your options should have value attributes and not name. select value=textselector option value=11Text/option option value=12Text 2/option /select Try something like $(textselectoroption:selected).val(); On Jun 25, 6:03 pm, Chas [EMAIL PROTECTED] wrote: How do I retrieve the name attribute of a selected option using jquery. IE: select name=textselector option name=11Text/option option name=12Text 2/option /select In this example, I would be trying to get 12 when the Text option is selected.
[jQuery] Google Code Download not working - Any Mirrors?
I'm trying to download the latest jQuery from the links on the jQuery home page. My browser gets to Google Code, but all listed downloads are failing w Firefox can't establish a connection to the server at jqueryjs.googlecode.com. I've been trying for a while now with no luck. Are there any mirrors available?
[jQuery] Re: Google Code Download not working - Any Mirrors?
Rey, I can get to that URL, but if I try to download the actual libraries in any form Firefox (and IE and Safari) give me Unable to Connect (or similar) errors. I just checked and I'm still seeing failures. Note that the download links on http://code.google.com/p/jqueryjs/ point to http://jqueryjs.googlecode.com/files/jquery-1.2.6.js etc. Those links don't work. I manage to get files by looking at the html source of jquery.com. http://code.jquery.com/jquery-latest.pack.js http://code.jquery.com/jquery-latest.min.js http://code.jquery.com/jquery-latest.js Thanks, Brad On Jun 20, 12:50 pm, Rey Bango [EMAIL PROTECTED] wrote: Brad, I just tried it and it worked fine for me:
[jQuery] Re: Google Code Download not working - Any Mirrors?
Yes, on further investigation, it appears to be a DNS issue. Brad On Jun 20, 1:21 pm, Rey Bango [EMAIL PROTECTED] wrote: Hi Brad, Seems like it may be something on your end as I was able to download it.
[jQuery] Re: php mysql
I'm certainly not a jquery.guru but do use jquery for database update
(php/mysql)
I think from your post your thinking of jquery in the same league as
server side languages like php ruby and its not.
Its client side javascript with all the restrictions that brings but a
much nicer way of dealing with it.
Ashley's mention of understanding how you would do it using standard
forms is really good as you are essentially enhancing not replacing
that.
jquery will still send information in much the same way as a form
would though with the benefit of extracting page info from the DOM not
just in form fields, not refreshing the page and hiding a lot of the
background work.
so for a very simplified psuedocode example in a row you want to
update.
Use jquery to grab the data in the row with something like $
(this).parent('td').text
then put into a post call and use the callback to check the response
from the php script which does the work with the database update
$.post(, { name: data from row },
function(data){
if(data == 'crapped out') {
alert(Damn it the script + data);
} else {
alert(Hey it worked, the database row is + data);
}
});
In your_script_that_works_with_the_sql.php you would check the post
values and work with them exactly as you would with a standard form
then just echo out the response to the update which gets sent back as
the callback data.
eg.
if($result) {
$return = 'updated';
} else {
$return = 'crapped out';
}
exit($return);
On May 6, 8:57 am, John [EMAIL PROTECTED] wrote:
I have the same question. I have over 20k rows of data in mysql, and
the idea is for there to be an update button beside each row. I don't
see any examples of how to interact with the database here -- in php
it's $sql = ...; in ruby/rails it's Thing.new[...], but what's up
with jquery? I don't think an explanation would be voodoo - it'd be a
lifesaver. I already understand the old ways - school me on the
jquery.
Thanks
John
This is a pretty big question. What you need to do is learn how to do
it with regular HTTP interaction with the backend. Once you understand
that you'll be able to adapt it to Ajax. A firm grounding in HTTP
makes XHR pretty straightforward.
Doing this right is not simple. You should probably read up on REST
and understand which parts should GET and which parts should POST (or
really even PUT/DELETE but that's often unused due to bad support and
general lack of understanding).
The take away point is that if you don't know how to do every part
with regular forms and backend interaction already, doing it in Ajax
will seem like insurmountable voodoo.
[jQuery] smartposition - a scrolling detection problem.
I'm using some code that I found in the K2 theme for WordPress.
function smartPosition(obj) {
// Detect if content is being scroll offscreen.
if ( (document.documentElement.scrollTop || document.body.scrollTop)
= jQuery(obj).offset().top) {
jQuery('body').addClass('smartposition');
} else {
jQuery('body').removeClass('smartposition');
}
}
It's supposed to add and remove the `smartposition` class when the
scrolling threshold is right. It works perfectly in K2.
I have the style
body.smartposition #post-navigation {
background:#FF none repeat scroll 0% 0%;
border-bottom:1px solid #EE;
margin:0pt;
padding:10px 0pt;
position:fixed;
top:0px;
z-index:10;
}
In my stylesheet, but the problem is that the class isn't removing!
[jQuery] Re: smartposition - a scrolling detection problem.
Okay. I figured it out. Since smartPosition was tracking the moving
div, and since the moving div was always in the same place after the
initial switch, the calculations weren't returning the div upon scroll
up.
I changed the smartPosition param to #content-area, which was a parent
of the #post-navigation class. It's working now. And beautifully,
too.
Thanks for the help!
Brad Kovach
bradkovach.com
On Apr 5, 5:17 pm, Sam Sherlock [EMAIL PROTECTED] wrote:
I have only had a look round at the code I have in a wordpress install with
k2, I have not upgraded either since 2.5 came out.
Make sure you have this somewhere
jQuery(document).scroll(function() { smartPosition('.configstuff') });
possibly the k2 jquery pack includes dimensions plugin or something
-S
On 05/04/2008, Brad [EMAIL PROTECTED] wrote:
I'm using some code that I found in the K2 theme for WordPress.
function smartPosition(obj) {
// Detect if content is being scroll offscreen.
if ( (document.documentElement.scrollTop ||
document.body.scrollTop)
= jQuery(obj).offset().top) {
jQuery('body').addClass('smartposition');
} else {
jQuery('body').removeClass('smartposition');
}
}
It's supposed to add and remove the `smartposition` class when the
scrolling threshold is right. It works perfectly in K2.
I have the style
body.smartposition #post-navigation {
background:#FF none repeat scroll 0% 0%;
border-bottom:1px solid #EE;
margin:0pt;
padding:10px 0pt;
position:fixed;
top:0px;
z-index:10;
}
In my stylesheet, but the problem is that the class isn't removing!
[jQuery] Re: smartposition - a scrolling detection problem.
I do have that in the footer of my page. To be exact it says:
jQuery(document).ready( function() { });
jQuery(window).scroll( function(){ smartPosition('#post-
navigation'); });
The smartPosition param tells it which ID to track in the DOM.
Thanks for the reply!
On Apr 5, 5:17 pm, Sam Sherlock [EMAIL PROTECTED] wrote:
I have only had a look round at the code I have in a wordpress install with
k2, I have not upgraded either since 2.5 came out.
Make sure you have this somewhere
jQuery(document).scroll(function() { smartPosition('.configstuff') });
possibly the k2 jquery pack includes dimensions plugin or something
-S
On 05/04/2008, Brad [EMAIL PROTECTED] wrote:
I'm using some code that I found in the K2 theme for WordPress.
function smartPosition(obj) {
// Detect if content is being scroll offscreen.
if ( (document.documentElement.scrollTop ||
document.body.scrollTop)
= jQuery(obj).offset().top) {
jQuery('body').addClass('smartposition');
} else {
jQuery('body').removeClass('smartposition');
}
}
It's supposed to add and remove the `smartposition` class when the
scrolling threshold is right. It works perfectly in K2.
I have the style
body.smartposition #post-navigation {
background:#FF none repeat scroll 0% 0%;
border-bottom:1px solid #EE;
margin:0pt;
padding:10px 0pt;
position:fixed;
top:0px;
z-index:10;
}
In my stylesheet, but the problem is that the class isn't removing!
[jQuery] Re: how to build a image cycle?
To loop Jcarousel you need to set the wrap option and cycle the auto
option
The following will show 5 images(visible:5), advancing 1 image (scroll:
1) every 2 seconds (auto:2) and when it reaches the last image wrap
back to the first (wrap:last).
// set up the carousel
jQuery('#mycarousel').jcarousel({
visible: 5,
auto: 2,
scroll:1,
animation: 'slow',
wrap: 'last'
});
check out the following for explanations and more options
http://sorgalla.com/projects/jcarousel/#Getting-Started
You can control the size of the image displayed in the CSS file and I
would imagine you could turn off the arrows
Hope that helps.
Brad
PS Cycle plugin is really cool but not sure what sort of performance
hit (if any) running multiple instances would cause
On Jan 24, 3:11 am, DoZ [EMAIL PROTECTED] wrote:
Hi all!
I simply need to build an image rotation/cycle; it has to be
vertical, automatic, looping, and the images have to be in a tags.
Jcarousel could be quite enough for me (even if I don't need arrows),
but I don't understand how to make the
loop.http://sorgalla.com/projects/jcarousel/
ScrollShow could be good too, but ther's no
documentation(!)http://flesler.blogspot.com/search/label/jQuery.ScrollShow
Can anybody help me??
[jQuery] Re: preventing open element from being closed and reopened in accordion menu (not using accordion plugin)
Was just reading another post Trying to show a div on mouseover of
menu item... and pointed me to the solution
The answer:
if ($(this).parent().next().is(':hidden'))
On Jan 13, 11:03 am, Brad Hile [EMAIL PROTECTED] wrote:
Hi
I have a simple accordion menu and would like to prevent the already
open dd from being closed and reopened when clicked on.
eg.
$(#menu dt a).click(function(){
// only activate if dd is hidden so currently active block is not
reopened
if(hidden???) { $(#menu dd:visible).slideUp(slow); }
$(this).parent().next().slideDown(slow).addClass(open);
return false;
});
Can anyone suggest how to test the state of the current element
I'm guessing $(this).parent().next().something? but don't know how to
get its current state
thanks
Brad
