[jQuery] Re: Modified ClueTip Not working in IE.
Did anybody ever figure out a way to position the cluetip relative to
it's parent rather than the mouse? I would also like to do this as I'm
attaching the cluetips to areas in a map and I want to always have
them in the same place so they don't block any of the image using the
map.
Regards,
Andrew
On Oct 10, 7:28 am, Karl Swedberg [EMAIL PROTECTED] wrote:
Hi Jeffrey,
Sorry for the delay in getting back to you. I'll try to take a look
this weekend. I have a different idea about how to go about this and
will test sat/sun.
--Karl
Karl Swedbergwww.englishrules.comwww.learningjquery.com
On Oct 9, 2008, at 9:03 AM, JeffreyKarbowski wrote:
Can anyone tell me why this doesn't work in IE???
JeffreyKarbowski wrote:
Comparing to original -
(Line 105)
Original:
var tOffset = parseInt(opts.topOffset, 10), lOffset =
parseInt(opts.leftOffset, 10);
Changed to:
var tOffset = 100, lOffset = -738;
(Line 302)
Original:
tipY = posY;
Changed to:
tipY = 95;
(Line 305)
Original:
tipY = posY - opts.dropShadowSteps + tOffset;
Changed to:
tipY;
(Defaults)
Changed:
Width,
Height,
Position (to fixed),
Show Title,
JeffreyKarbowski wrote:
I have this working in Firefox, with a fixed position on the page,
IE
however throws errors.
In Bold are the lines that I have changed:
if (opts.local opts.hideLocal) { $(tipAttribute +
':first').hide(); }
var tOffset = 100, lOffset = -738;
// vertical measurement variables
var tipHeight, wHeight;
tipHeight = defHeight == 'auto' ?
Math.max($cluetip.outerHeight(),$cluetip.height()) :
parseInt(defHeight,10);
tipY = 95;
baseline = sTop + wHeight;
if (opts.positionBy == 'fixed') {
tipY;
} else if ( (posX mouseX Math.max(posX, 0) + tipWidth
mouseX) || opts.positionBy == 'bottomTop') {
if (posY + tipHeight + tOffset baseline mouseY - sTop
tipHeight + tOffset) {
The page in question is http://btcamper.interactrv.com/defaultTest.aspx
http://btcamper.interactrv.com/defaultTest.aspx
JeffreyKarbowski wrote:
Could you please tell me a way to position the Cluetip relative
to its
parent div instead of having it offset from the invoking element?
I need
the Cluetip to sit in a fixed position on the page.
--
View this message in
context:http://www.nabble.com/ClueTip-postioning-tp19864348s27240p19898298.html
Sent from the jQuery General Discussion mailing list archive at
Nabble.com.
[jQuery] $.load callback calls hide, but element doesn't hide
Hello there,
I am experiencing some problems using $.load and $.ajax to pull
content from a url and display it in a div. I created the attached
example page to show what I mean.
I expect that when I click the link, the indicator.gif image (or
Loading...) will appear for a moment, then disappear as the
response.html page appears.
Instead, sometimes the indicator.gif image doesn't disappear, leaving
both the response.html page and the indicator.gif image on the page
indefinitely. Also, occasionally the response.html page will not
appear (though the content will change, the fadeIn effect will just
never be called) and the indicator will stay on the page forever,
alone.
I'm sure I must be doing something wrong here, but I can't figure out
what it is. I've tried chaining the effects in a variety of orders,
changing the effect speeds, putting different effects in the callback,
and using $.ajax and the success parameter instead of $.load with a
callback. All yield the same result.
Any help, or pointers in the right direction, would be greatly
appreciated.
Thanks,
-Jess
html
head
script src=http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/
jquery.min.js type=text/javascript/script
/head
body
div id=test_link style=float: left; width: 100px;a href=./
response.htmlClick me/a/div
div id=content_inner style=float: left; width: 200px;
Some example text
/div
img id=indicator src=indicator.gif alt=Loading...
style=display: none; float: left; /
script
$('#test_link').click(function(e) {
e.preventDefault();
link = $(this).find('a:first').attr('href');
$('#content_inner').hide('slow',function() {
$('#indicator').show();
}).load(link,function() {
$('#indicator').fadeOut();
$('#content_inner').fadeIn('slow');
});
});
/script
/body
/html
[jQuery] Re: $.load callback calls hide, but element doesn't hide
I realized after I posted that the hide() function might be returning as
finished as the element is being unhidden. I'm not sure why this would
be (doesn't the element's display property get set to inline
immediately? Perhaps the display attrib gets set in that way on
-every- size and opacity adjustment, so it was immediately unhidden
again?)... In any case, I seem to have corrected the problem by putting
everything in a chain of callbacks, as so:
$('#content_inner').fadeOut('slow',function() {
$('#indicator').show(function() {
$.ajax({
Thanks for your time. :)
-Jess
mann_jess wrote:
Hello there,
I am experiencing some problems using $.load and $.ajax to pull
content from a url and display it in a div. I created the attached
example page to show what I mean.
I expect that when I click the link, the indicator.gif image (or
Loading...) will appear for a moment, then disappear as the
response.html page appears.
Instead, sometimes the indicator.gif image doesn't disappear, leaving
both the response.html page and the indicator.gif image on the page
indefinitely. Also, occasionally the response.html page will not
appear (though the content will change, the fadeIn effect will just
never be called) and the indicator will stay on the page forever,
alone.
I'm sure I must be doing something wrong here, but I can't figure out
what it is. I've tried chaining the effects in a variety of orders,
changing the effect speeds, putting different effects in the callback,
and using $.ajax and the success parameter instead of $.load with a
callback. All yield the same result.
Any help, or pointers in the right direction, would be greatly
appreciated.
Thanks,
-Jess
html
head
script src=http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/
jquery.min.js type=text/javascript/script
/head
body
div id=test_link style=float: left; width: 100px;a href=./
response.htmlClick me/a/div
div id=content_inner style=float: left; width: 200px;
Some example text
/div
img id=indicator src=indicator.gif alt=Loading...
style=display: none; float: left; /
script
$('#test_link').click(function(e) {
e.preventDefault();
link = $(this).find('a:first').attr('href');
$('#content_inner').hide('slow',function() {
$('#indicator').show();
}).load(link,function() {
$('#indicator').fadeOut();
$('#content_inner').fadeIn('slow');
});
});
/script
/body
/html
[jQuery] Confirm Deletion
i need to delete a row from mysql DB, click delete buttonn and fadeout then
delete record from DB.
HELP PLEASE ...
Below is my code:
$(document).ready(function() {
$(a.delete).click(function() {
if (confirm('Are you sure you want to delete ? - ' +
this.id)) {
$(this).parent().fadeOut(1000, function() {
$(this).parent('tr').remove();
//delete(this.id);
window.location.href =
'test.php?delnews=' + this.id;
alert('DELETED');
});
}
});
});
--
View this message in context:
http://www.nabble.com/Confirm-Deletion-tp20869801s27240p20869801.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Creating a Plugin
You could store the bbcode in the element's jQuery data store:
$(#test).data(bbcode, ...);
and you can get it back out by
var bbcode = $(#test).data(bbcode);
See http://docs.jquery.com/Core/data for more info.
Please let me know if your question goes further into how to make your
plugin accept a method call that would then return this data.
- Richard
On Fri, Dec 5, 2008 at 2:27 AM, Brian Ronk [EMAIL PROTECTED] wrote:
I'm making an edit in place plugin, and am running into an issue,
mainly because I'm not sure how to do it. The data I am working with
is bbcode, so what is seen on screen (non editing) is not bbcode, but
it decoded. I would like to be able to return the bbcode to work with
it in another area. I'm just not sure how to do that.
What I'd like to be able to do is to initialize it: $('#test').bbcode
(); and then be able to call it again (or something) to get the
actual bbcode out. So, something like $('#test').bbcode('code'); or $
('#test').showcode();
It basically works right now, except for the returning data. I'm just
not sure on how to procede to do that.
[jQuery] Re: sortable issue
I'm not sure your sample provides quite enough detail of what you're going
for. If you have the following
ul
li id=1 class=exampleclass/li
li id=2 class=exampleclass/li
li id=3 class=exampleclass/li
li id=4 class=exampleclass/li
li id=5 class=exampleclass/li
li id=6 class=exampleclass/li
/ul
and you drag 5 to be in-between 1 and 2, like so,
ul
li id=1 class=exampleclass/li
li id=5 class=exampleclass/li
li id=2 class=exampleclass/li
li id=3 class=exampleclass/li
li id=4 class=exampleclass/li
li id=6 class=exampleclass/li
/ul
then what do you want?
- Richard
On Fri, Dec 5, 2008 at 7:15 PM, Bhavin [EMAIL PROTECTED] wrote:
Hi,
I am trying to find out element which are dragged dropped on the
list in following method:
$(#example).sortable({
//if i move 1 at second position then here i want array of
ids 2,1 sequence. ??
// I tried selector but it gives me all the elements. ie.
2,1,3.
});
ul
li id=1 class=exampleclass/li
li id=2 class=exampleclass/li
li id=3 class=exampleclass/li
/ul
Can anyone help me on this?
[jQuery] Re: jEditable - simple datepicker
Here's the thread this was in reply to (in my client they're not related): http://groups.google.com/group/jquery-en/browse_thread/thread/f4ac0893083fda8 - Richard On Thu, Dec 4, 2008 at 6:14 PM, Ethan [EMAIL PROTECTED] wrote: Any updates on this plugin, I have tried to make it myself, I'm almost there, but maybe someone can just finish the job!!! :))
[jQuery] Need help with AJAX
Hi, I have used the '.load' function to load a HTML page into a division through AJAX. But i noticed that if i insert any other jquery scripts in the page that is loaded through AJAX, then they are not executed. As an example i loaded a page using Ajax into a div, from a link in that page i wanted to open a lightbox, but instead the content would just open as a usual html page rather than open in a lightbox. Is it possible to include more javascripts in a page loaded thropugh AJAX?
[jQuery] JQuery and Asp.Net datasets, Linq....
I am brand new to JQuery, but it looks fascinating. I am trying to implement a slideshow using Query and supplying the images for a SQL Server table with paths to the images (Images/Image1.jpg). At present I am using an asp.net repeater to display the images, and the asp.net repeater has a Linq datasource. Is there a way to have the Linq datasource feed the data to JQuery to produce a database driven slideshow? Thank you all, Paolo
[jQuery] Re: Object Oriented Form Handling
Will, Does anyone know of a way to use class like objects in event handling using jQuery? For Example, input type='button' value='Button' onclick='Record.show()' / where .show() is a method of the Record object. This would be really cool to be able to reuse the method name .show() but with different objects verses just coding a huge list of functions that are hard to organize and end up with long names. You can always build objects around jQuery elements. Depending on your needs, you might be able to get by with just caching your jQuery objects: Record = $(#some_div); Now, Record:show() would show the record. I generally find building full OO-based objects out of everything a bit overkill, since the majority of operations your doing is just to change the state of a DOM element (or elements.) -Dan
[jQuery] Re: Webdeveloper to WebDeveloper
Maybe you should make clearer that the articles are copied from somewhere else (out of the web). --Klaus On 6 Dez., 03:43, Pedram [EMAIL PROTECTED] wrote: Dear folk , If you're interested on web development Articles which is updated and has lots of new information.(Web developer to web developer) I have just started a Blog which contains (jQuery ,Css,html,Php,Mysql,json,Ajax) take a look at ithttp://www.pedramdev.com, this Blog gets the best articles out of the web and also at the end of the week it has some conclusions enjoy it . If any one is interested please let me know . [EMAIL PROTECTED] . Sincerely Pedram .
[jQuery] Re: mcDropDown - problem getting displayed value
Sean, On Fri, Dec 5, 2008 at 2:00 PM, Sean O [EMAIL PROTECTED] wrote: .getValue() doesn't work, and would only return the rel attribute of selection anyway. What I need is the displayed text. Ideas? Thanks. The getValue() should do exactly what you need. It returns an array in the format [value, label]. So the second element in the array is exactly the value I believe you're after. -Dan
[jQuery] Re: How to display validation error messages in a tooltip? JORN
Did anything get done in this direction? In some cases, putting the error messages inline is unreasonable. An error container is also unreasonable, for it requires scrolling to the container and adding links to the fields from each error message to make its function decent. Is there a post-validation event? At least I could scan for error labels and create tooltips each time the validity changes. Mihai On Nov 2, 4:51 am, Kenet [EMAIL PROTECTED] wrote: Jorn, Back in April of 2007 you had a discussion on your comments section for your ToolTip Plugin, here's a quote of that conversation. OSCAR 24. April 2007 |10:55 Add tooltip to validation. It is posible to add a tooltip in order toshow the “error message” of a validation. My Problem: I have a form very big for that reason I only can put a “*” if a input validation fails. I would like to add a tooltip with the info about the error. I don’t know if I could integrate your tooltip validation plugins. Thanks in advanced. Jörn 24. April 2007 |17:27 @Oscar: Provide the showErrors option. Put only the star beneath the field and the error message inside the title attribute of the input. Modify the tooltip plugin: The check if an element has a title attribute has to be done when the tooltip is displayed, not when applying the plugin. I’ll try to provide an example with the necessary tooltip modifications, but it may take a while. OSCAR 24. April 2007 |18:16 Great!!! I will try to do it. OSCAR 25. April 2007 |09:34 Maybe could be nice to provide tootip message optin into validation with a new param: rules messages TOOTIPS Ii will be nice in order to mantain separatlly view controller, if we put tooltip text into the title we are mixing view controller. It is hçjust an idea! Jörn 25. April 2007 |18:46 @Oscar: Adding a tooltip option to validation is an interesting approach, I’ll check that. I don’t see an issue with putting messages into the title attribute. My question is, did you ever get in further with that idea? I would like to display my error messages in a tooltip as well. Please let me know. Thanks, Ken
[jQuery] Re: Creating a Plugin
That might work. I'll tinker with that. How does it work with
multiple instances of the same plugin through? Where I'm using it, I
am going to be pulling data from 2 instances of the plugin. Maybe I
could have two different names... I think that would work.
Although, I would like to know how to make my plugin accept a method
call.
On Dec 6, 9:05 am, Richard D. Worth [EMAIL PROTECTED] wrote:
You could store the bbcode in the element's jQuery data store:
$(#test).data(bbcode, ...);
and you can get it back out by
var bbcode = $(#test).data(bbcode);
Seehttp://docs.jquery.com/Core/datafor more info.
Please let me know if your question goes further into how to make your
plugin accept a method call that would then return this data.
- Richard
On Fri, Dec 5, 2008 at 2:27 AM, Brian Ronk [EMAIL PROTECTED] wrote:
I'm making an edit in place plugin, and am running into an issue,
mainly because I'm not sure how to do it. The data I am working with
is bbcode, so what is seen on screen (non editing) is not bbcode, but
it decoded. I would like to be able to return the bbcode to work with
it in another area. I'm just not sure how to do that.
What I'd like to be able to do is to initialize it: $('#test').bbcode
(); and then be able to call it again (or something) to get the
actual bbcode out. So, something like $('#test').bbcode('code'); or $
('#test').showcode();
It basically works right now, except for the returning data. I'm just
not sure on how to procede to do that.
[jQuery] ajax troubles
Hello, world!
My English is no good this is my first javascript code )).
I've a text field for 8-symbol auth code:
---
CUT
var sAuthCode = ';
var iAuthCount= -1;
var sAuthCacheCode = ';
var iAuthCacheCount = -1;
$(document).ready(function(){
...
$(#code).keyup(function(){
AuthEvent();
});
...
});
function AuthEvent() {
var iAuthCode = 0;
sAuthCode = $(#code).val();
iAuthCode = $(#code).val().length;
if (iAuthCode != 8) {
sAuthCode = ;
iAuthCount = -1;
} else {
if ((sAuthCode == sAuthCacheCode) (iAuthCacheCount = 0)) {
iAuthCount = iAuthCacheCount;
} else {
/* {-1 - server error; 0 - empty balance; 0 - count of
accessible services} */
$.getJSON(sAuthURL, {code:sAuthCode}, AuthDataReady);
}
}
AuthDraw();
}
function AuthDataReady(json) {
var iAuthTMP = parseInt(json.Count);
if (iAuthTMP = 0) {
iAuthCount = iAuthTMP;
iAuthCacheCount = iAuthTMP;
sAuthCacheCode = sAuthCode;
}
}
function AuthDraw() {
switch (iAuthCount) {
case -1:
SetClass($(#code), codeWHITE);
break;
case 0:
SetClass($(#code), codeRED);
break;
default:
SetClass($(#code), codeGREEN);
break;
}
}
function SetClass(el,cls) {
if (el[0].className != cls) {
el[0].className = ;
el.addClass(cls);
}
}
---
CUT
When code is not in cache number of symbols in field is 8 - script
makes request to server, but don't change class of field, untill I put
additional any key. HTML part:
input type=text name=code id=code class=codeWHITE
maxlength=8 /p
What's wrong?
WBR.
[jQuery] bind a function to another function
Hi all, I released my first jquery plugin. It is about binding or connecting a function to another function. It is just like binding a handler function to event. Please have a look at it and send me your comments. http://plugins.jquery.com/project/jqConnect cheers, Prajwala
[jQuery] Re: Creating a Plugin
On Sat, Dec 6, 2008 at 11:53 AM, Brian Ronk [EMAIL PROTECTED] wrote: That might work. I'll tinker with that. How does it work with multiple instances of the same plugin through? Where I'm using it, I am going to be pulling data from 2 instances of the plugin. Maybe I could have two different names... I think that would work. Data has support for namespaces. So if your plugin is called foo, and someone else has a bar plugin, each bbcode property can be separated be like so: $(#test).data(bbcode.foo, fooBbcode); $(#test).data(bbcode.bar, barBbcode); same for getting. So that's with two plugins with different names, but you maybe figure out something based on that. It's tricky to do two instances of the same plugin on the same element, because how does the user select one or the other? Get's even more complex if you have a set of elements (more than one element in the jQuery object on which you call your plugin method). Although, I would like to know how to make my plugin accept a method call. You can do it by inspecting the type of the first parameter passed to the plugin method. Usually that would be a hash containing init options. If it's called again and is a string then you can treat that as a method name, and do the appropriate thing (dispatch an internal function in your plugin, probably). This is all abstracted quite nicely in the widget plugin created by Scott González and Jörn Zaefferer. It's used as a base for all jQuery UI widgets, and can be found here: http://jquery-ui.googlecode.com/svn/trunk/ui/ui.core.js You can look at most any jQuery UI widget for an example of use. Here's a fairly simple one: http://jquery-ui.googlecode.com/svn/trunk/ui/ui.progressbar.js And here are some examples of use (including init, modifying options, calling methods, destroying): http://jquery-ui.googlecode.com/svn/trunk/tests/visual/progressbar.html Notice you can declare an _init (near the beginning of the file) that gets called at init (the first time the plugin method is called on an element), with optional options that override any defaults (declared near the end of the file). Any functions you declare without an underscore (_) at the beginning are public. Also notice you can declare _getData and _setData. These let you handle any get/set of your data keys in your plugin's namespace. It's really quite a nice factory. If you end up making use of it and have any further questions, you can get help on the jQuery UI list: http://groups.google.com/group/jquery-ui - Richard Richard D. Worth http://rdworth.org/
[jQuery] Re: Variable scope: Newbie Question
Hi Micheal,
Thank you so much for that. I knew I was getting close to a solution
but I was well and truly stuck. It is now working and I am delighted.
This is the code that worked for me
success: function(xml) {
towncity = [];
$(xml).find([EMAIL PROTECTED]'+ currprov +'] TOWN_CITY_NAME).map
(function(){
towncity.push( $(this).text() );
$(#city).autocomplete(towncity);
});
}
The XML file I am querying is a file I constructed myself (so I have
full access to it) for a few different reasons. I am not good enough
at mySQL to create a database with the information, I am too cheap to
pay for a ready made database ;), the autocomplete script gives an
option of storing the data in a local.js file but I did not like this
idea as it may not transfer to future projects and I don't really know
much about JSON.
Once again thank you so much, I expected to have to spend hours trying
to get this to work today!
Mat
On Dec 5, 11:55 am, Michael Geary [EMAIL PROTECTED] wrote:
Hi Mat,
1) You're defining towncity like this:
var towncity = window.towncity = new Array();
That creates both a local variable named towncity and a window property
(global variable) of the same name. Is that what you want? Do you need to
use towncity outside this code? If not, I would change it to:
var towncity = [];
2) In the .each() inside your ajax callback you have this code:
towncity = $(this).text();
That *replaces* the towncity variable with the text of the single XML
element for the current iteration of .each() - so it's no longer an array
but is now a simple text string. It doesn't sound like that's what you want,
is it?
To append the item text to the towncity array, you could change it to:
towncity.push( $(this).text() );
But you probably also want to clear this array before running the loop (is
that right?), so just before the $(xml).find(...) you should add:
towncity = []; // note: no var here
which gives you this code:
success: function(xml) {
towncity = [];
$(xml).find(...).map(function(){
towncity.push( $(this).text() );
});
}
Given that, you could simplify the code to:
success: function(xml) {
towncity = $(xml).find(...).map(function(){
return $(this).text();
});
}
BTW, do you have control over the XML file that the server generates? If you
do, you could use JSON instead of XML to make the code simpler. If you're
stuck with XML, this code should do the trick.
-Mike
From: Mat
Hi there,
I'm sorry this is a pretty newbie question
I am using JQuery with an xml file and autocomplete. What I am trying
to achieve is to use an xml file as my data source to autocomplete
cities in a form once a user selects their province. When a user
selects a particular province then only the cities in that province
will be listed by the autocomplete script as the user starts to type
in the 'city' form field.
My problem here is that I am trying to use the array 'towncity' as my
data source for autocomplete and change the contents of the array when
the province select box #province is changed. However, I can not get
my $('#province').change(function() to affect the array 'towncity'
that I have declared outside of the function
script type=text/javascript
$(document).ready(function() {
var towncity = window.towncity = new Array();
$(#city).autocomplete(towncity);
$.preloadCssImages();
$('div.jshide').show();
$(#tenantForm).validate({
rules: {
name: {
required: true,
minlength: 2
},
province:required,
ccom:required,
occupied: required,
rented:required,
condo:required,
payment:required
}
});
$(#renewdate).datepicker({
dateFormat: d M, yy,
showOn: both,
buttonImage: images/calendar.gif,
buttonImageOnly: true
});
$('#province').change(function() {
var currprov = $('option:selected',
this).text();
$(function() {
$.ajax({
type: GET,
url: xml/location.xml,
dataType: xml,
success: function(xml) {
$(xml).find([EMAIL PROTECTED]'+ currprov +']
TOWN_CITY_NAME).each(function(){
towncity = $(this).text();
});
}
});
[jQuery] Re: Variable scope: Newbie Question
One thing I do notice with my code is that it is slow. If I change
provinces and type in the city field and change provinces again things
slow right down. I know this must be due to the way I have coded this.
I am wondering if you have any suggestion to improve the speed of
things? The form will primarily used by those in Alberta so I though
if I loaded the array with Alberta city names by default when the
script loads it might speed things up. DO you think the JSON approach
you mentioned would be quicker?
Thanks,
Mat
On Dec 6, 12:15 pm, Mat [EMAIL PROTECTED] wrote:
Hi Micheal,
Thank you so much for that. I knew I was getting close to a solution
but I was well and truly stuck. It is now working and I am delighted.
This is the code that worked for me
success: function(xml) {
towncity = [];
$(xml).find([EMAIL PROTECTED]'+ currprov +'] TOWN_CITY_NAME).map
(function(){
towncity.push( $(this).text() );
$(#city).autocomplete(towncity);
});
}
The XML file I am querying is a file I constructed myself (so I have
full access to it) for a few different reasons. I am not good enough
at mySQL to create a database with the information, I am too cheap to
pay for a ready made database ;), the autocomplete script gives an
option of storing the data in a local.js file but I did not like this
idea as it may not transfer to future projects and I don't really know
much about JSON.
Once again thank you so much, I expected to have to spend hours trying
to get this to work today!
Mat
On Dec 5, 11:55 am, Michael Geary [EMAIL PROTECTED] wrote:
Hi Mat,
1) You're defining towncity like this:
var towncity = window.towncity = new Array();
That creates both a local variable named towncity and a window property
(global variable) of the same name. Is that what you want? Do you need to
use towncity outside this code? If not, I would change it to:
var towncity = [];
2) In the .each() inside your ajax callback you have this code:
towncity = $(this).text();
That *replaces* the towncity variable with the text of the single XML
element for the current iteration of .each() - so it's no longer an array
but is now a simple text string. It doesn't sound like that's what you want,
is it?
To append the item text to the towncity array, you could change it to:
towncity.push( $(this).text() );
But you probably also want to clear this array before running the loop (is
that right?), so just before the $(xml).find(...) you should add:
towncity = []; // note: no var here
which gives you this code:
success: function(xml) {
towncity = [];
$(xml).find(...).map(function(){
towncity.push( $(this).text() );
});
}
Given that, you could simplify the code to:
success: function(xml) {
towncity = $(xml).find(...).map(function(){
return $(this).text();
});
}
BTW, do you have control over the XML file that the server generates? If you
do, you could use JSON instead of XML to make the code simpler. If you're
stuck with XML, this code should do the trick.
-Mike
From: Mat
Hi there,
I'm sorry this is a pretty newbie question
I am using JQuery with an xml file and autocomplete. What I am trying
to achieve is to use an xml file as my data source to autocomplete
cities in a form once a user selects their province. When a user
selects a particular province then only the cities in that province
will be listed by the autocomplete script as the user starts to type
in the 'city' form field.
My problem here is that I am trying to use the array 'towncity' as my
data source for autocomplete and change the contents of the array when
the province select box #province is changed. However, I can not get
my $('#province').change(function() to affect the array 'towncity'
that I have declared outside of the function
script type=text/javascript
$(document).ready(function() {
var towncity = window.towncity = new Array();
$(#city).autocomplete(towncity);
$.preloadCssImages();
$('div.jshide').show();
$(#tenantForm).validate({
rules: {
name: {
required: true,
minlength: 2
},
province:required,
ccom:required,
occupied: required,
rented:required,
condo:required,
payment:required
}
});
$(#renewdate).datepicker({
dateFormat: d M, yy,
showOn: both,
buttonImage: images/calendar.gif,
buttonImageOnly: true
[jQuery] Re: Expose an event?
You can also trigger custom events registered with bind. http://docs.jquery.com/Events/trigger#typedata Usually called 'custom events'. Perhaps that's what you're looking for. You can create an event with any (available) name and using .bind() and .trigger(). - Richard On Fri, Dec 5, 2008 at 1:59 PM, paron [EMAIL PROTECTED]wrote: I made a searchbox object that I can add to a GoogleMap. It lets a user draw a box on the map and keeps track of its max and min lat and lon. I'd like to have it raise an updated event whenever either of its internal draggable markers fires a dragend. That way other objects can watch for an updated event and hit the server to search inside the new boundaries, or repaint the map, or update a database with the new boundaries. I looked for a while at event delegation, but that didn't seem to be the right topic.
[jQuery] Re: Variable scope: Newbie Question
Wow I'm chatty aren't I...
I just wanted to add I changed my code to this
$(function() {
$.ajax({
type: GET,
url: xml/location.xml,
dataType: xml,
success: function(xml) {
towncity = [];
$(xml).find([EMAIL
PROTECTED]'+ currprov +']
TOWN_CITY_NAME).map(function(){
towncity.push(
$(this).text() );
});
$(#city).autocomplete(towncity);
}
and that improved speed greatly. It appeared I was binding the
autocomplete script and data source to the #city field with every
iteration of my XML file query and this of course was causing a huge
speed bump. Once I moved the autocomplete binding statement outside of
my XML file query function the wheels turned much faster.
Mat :)
On Dec 6, 12:26 pm, Mat [EMAIL PROTECTED] wrote:
One thing I do notice with my code is that it is slow. If I change
provinces and type in the city field and change provinces again things
slow right down. I know this must be due to the way I have coded this.
I am wondering if you have any suggestion to improve the speed of
things? The form will primarily used by those in Alberta so I though
if I loaded the array with Alberta city names by default when the
script loads it might speed things up. DO you think the JSON approach
you mentioned would be quicker?
Thanks,
Mat
On Dec 6, 12:15 pm, Mat [EMAIL PROTECTED] wrote:
Hi Micheal,
Thank you so much for that. I knew I was getting close to a solution
but I was well and truly stuck. It is now working and I am delighted.
This is the code that worked for me
success: function(xml) {
towncity = [];
$(xml).find([EMAIL PROTECTED]'+ currprov +']
TOWN_CITY_NAME).map
(function(){
towncity.push( $(this).text() );
$(#city).autocomplete(towncity);
});
}
The XML file I am querying is a file I constructed myself (so I have
full access to it) for a few different reasons. I am not good enough
at mySQL to create a database with the information, I am too cheap to
pay for a ready made database ;), the autocomplete script gives an
option of storing the data in a local.js file but I did not like this
idea as it may not transfer to future projects and I don't really know
much about JSON.
Once again thank you so much, I expected to have to spend hours trying
to get this to work today!
Mat
On Dec 5, 11:55 am, Michael Geary [EMAIL PROTECTED] wrote:
Hi Mat,
1) You're defining towncity like this:
var towncity = window.towncity = new Array();
That creates both a local variable named towncity and a window property
(global variable) of the same name. Is that what you want? Do you need to
use towncity outside this code? If not, I would change it to:
var towncity = [];
2) In the .each() inside your ajax callback you have this code:
towncity = $(this).text();
That *replaces* the towncity variable with the text of the single XML
element for the current iteration of .each() - so it's no longer an array
but is now a simple text string. It doesn't sound like that's what you
want,
is it?
To append the item text to the towncity array, you could change it to:
towncity.push( $(this).text() );
But you probably also want to clear this array before running the loop (is
that right?), so just before the $(xml).find(...) you should add:
towncity = []; // note: no var here
which gives you this code:
success: function(xml) {
towncity = [];
$(xml).find(...).map(function(){
towncity.push( $(this).text() );
});
}
Given that, you could simplify the code to:
success: function(xml) {
towncity = $(xml).find(...).map(function(){
return $(this).text();
});
}
BTW, do you have control over the XML file that the server generates? If
you
do, you could use JSON instead of XML to make the code simpler. If you're
stuck with XML, this code should do the trick.
-Mike
From: Mat
Hi there,
I'm sorry this is a pretty newbie question
I am using JQuery with an xml file and autocomplete. What I am trying
to achieve is to use an xml file as my data source to autocomplete
cities in a form once a user selects their province. When a user
selects a particular province then only the cities in that province
will be listed by the autocomplete script as the user starts to type
in the 'city' form field.
My
[jQuery] Click event broken by AJAX - explain please?
Having read the handful of mentions I could find, the underlying 'why'
is still a mystery to me. I tried stepping through the code with
Firebug but can't make out why it's not working, although I have MADE
it work in this manner:
$(a).click(
function() {
var self = this;
setTimeout(
function() {
$.get(
$(self).attr('href'),
function(html){
...put the html into a textbox...
}
)},
500
);
return false;
}
So what is the actual reason when the .get() executes, the return
false never happens, unless I do the setTimeout trick to effectively
move the get OUT of the click function?
If I just have in-line code, no AJAX action, the code proceeds merrily
along to the return and suppresses my event-bubbling nicely.
When I step through the code WITH an AJAX action in there (no
setTimeout), then execution never returns to the 'return'.
I concede that's just the way it is, but I would like to understand
why it's that way. Bug, design tradeoff, was overlooked by developer,
can't be done for some reason because of javascript architecture,
other?
[jQuery] Re: Creating a Plugin
It will actually be 2 instances of the plugin on 2 elements: $
('#test').data('bbcode'), and $('#test2').data('bbcode')
Thanks for those links, those will help me figure it out, although it
doesn't look easy :)
On Dec 6, 1:08 pm, Richard D. Worth [EMAIL PROTECTED] wrote:
On Sat, Dec 6, 2008 at 11:53 AM, Brian Ronk [EMAIL PROTECTED] wrote:
That might work. I'll tinker with that. How does it work with
multiple instances of the same plugin through? Where I'm using it, I
am going to be pulling data from 2 instances of the plugin. Maybe I
could have two different names... I think that would work.
Data has support for namespaces. So if your plugin is called foo, and
someone else has a bar plugin, each bbcode property can be separated be like
so:
$(#test).data(bbcode.foo, fooBbcode);
$(#test).data(bbcode.bar, barBbcode);
same for getting. So that's with two plugins with different names, but you
maybe figure out something based on that. It's tricky to do two instances of
the same plugin on the same element, because how does the user select one or
the other? Get's even more complex if you have a set of elements (more than
one element in the jQuery object on which you call your plugin method).
Although, I would like to know how to make my plugin accept a method
call.
You can do it by inspecting the type of the first parameter passed to the
plugin method. Usually that would be a hash containing init options. If it's
called again and is a string then you can treat that as a method name, and
do the appropriate thing (dispatch an internal function in your plugin,
probably). This is all abstracted quite nicely in the widget plugin created
by Scott González and Jörn Zaefferer. It's used as a base for all jQuery UI
widgets, and can be found here:
http://jquery-ui.googlecode.com/svn/trunk/ui/ui.core.js
You can look at most any jQuery UI widget for an example of use. Here's a
fairly simple one:
http://jquery-ui.googlecode.com/svn/trunk/ui/ui.progressbar.js
And here are some examples of use (including init, modifying options,
calling methods, destroying):
http://jquery-ui.googlecode.com/svn/trunk/tests/visual/progressbar.html
Notice you can declare an _init (near the beginning of the file) that gets
called at init (the first time the plugin method is called on an element),
with optional options that override any defaults (declared near the end of
the file). Any functions you declare without an underscore (_) at the
beginning are public. Also notice you can declare _getData and _setData.
These let you handle any get/set of your data keys in your plugin's
namespace. It's really quite a nice factory. If you end up making use of it
and have any further questions, you can get help on the jQuery UI list:
http://groups.google.com/group/jquery-ui
- Richard
Richard D. Worthhttp://rdworth.org/
[jQuery] Click Handler Not Returning False in IE7 Due to getScript()?
Go here:
http://www.theshedbbq.com/gulfport/photos/
Click one of the photo gallery links. In IE7, it does not return
false and immediately jumps back to the top of the page. Within the
clickhandler, I'm grabbing some data from the anchor tags' attributes,
then calling getScript(). Do I need to add a callback to getScript()
to return false?
$('#gallerySelect ul li a').click(function(){
// Grab id value
var obj = $(this);
var id = obj.attr('id');
var rel = obj.attr('rel');
// Call getScript with id passed.
$.getScript(/gulfport/photos/+rel+/+id+/+id+.js );
return false;
});
[jQuery] What's wrong with my slideUp slideDown?
Hi guys,
I have a simple md5 password encryption form and I'm using jQuery to
create an effect:
script type=text/javascript
$(document).ready(function(){
$(#encrypt).click(function(){
$(#encrypt).attr('disabled', true).val('In progress...');
$(#result).slideUp(0, slideUpCallback);
$(#result).slideDown(0, slideDownCallback);
});
function slideUpCallback()
{
if ($(#text).val() == '')
{
$(#result).html('pYou didnt enter the
password!/p');
}
else
{
$.ajax({
type: POST,
url: md5,
data: text= + $(#text).val(),
success: function(msg){
$(#result).html(pThe following '
+ $(#text).val() + ' in
md5 is:/p +
pb + msg + /b/p);
}
});
}
}
function slideDownCallback()
{
$(#encrypt).attr('disabled', false).val('MD5!');
}
});
/script
input type=text name=text id=text /
input type=button name=encrypt id=encrypt value=MD5! /
div id=result/div
The code is working perfectly except for the first time the result is
printed without the slide effect, after that everything is OK.
Please let me know what's wrong.
Thanks.
[jQuery] Re: Creating a Plugin
On Sat, Dec 6, 2008 at 2:38 PM, Brian Ronk [EMAIL PROTECTED] wrote:
It will actually be 2 instances of the plugin on 2 elements: $
('#test').data('bbcode'), and $('#test2').data('bbcode')
That's no problem. Each of those elements has their own data store. If you
end up going the widget factory route, they'll each have their own instance
of that widget-based plugin.
- Richard
Thanks for those links, those will help me figure it out, although it
doesn't look easy :)
No problem. Do let us know how it goes. We still need to document better how
it all works, and how to make use of it, so your perspective is very
valuable.
- Richard
[jQuery] Re: Optimizing Easiest Tooltip
Hm, how very odd indeed. There must something else on my page conflicting with it then. I'll strip it to the barebones and work my way back up. Thanks for all the help so far! May I also say that your website (learningjquery.com) has been an invaluable font of knowledge for jQuery, as well as both of your books. Frank. On Dec 5, 8:08 pm, Karl Swedberg [EMAIL PROTECTED] wrote: Ok, I dropped your table into my page, and it seems to work fine. http://test.learningjquery.com/very-simple-tooltip.html --Karl Karl Swedbergwww.englishrules.comwww.learningjquery.com On Dec 5, 2008, at 11:45 AM, Frank wrote: Also, I just realised that putting titles on TDs is a silly idea, and completely invalid. But I tried it with a direct copy of your script after putting actual links in, but still only get empty tooltips. Here is an example row: tr class='adminRow3' td colspan='3'a href='#' title=Full Title Here class='tooltip'bAbridged Title/b/a/td td align='center' style='background-color: #c00'-/td td align='center' style='background-color: #c00'-/td td align='center' style='background-color: #c00'-/td td align='center' style='background-color: #c00'-/td td align='center' style='background-color: #c00'-/td td align='center' style='background-color: #c00'-/td td align='center' style='background-color: #c00'-/td td align='center' style='background-color: #c00'-/td td align='center' style='background-color: #c00'-/td td align='center' style='background-color: #c00'-/td td align='center' style='background-color: #c00'-/td td rowspan='2' align='center' style='padding: 1px; background-color: #921ba9'Y/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center' style='padding: 1px'/td td rowspan='2' align='center'2/td td rowspan='2' style='font-size: 8px'06:01, 05:55/td td align='center'Y/td td rowspan='2' align='center' style='background-color: #c00'-/td td rowspan='2'a href='' title=Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer purus. Duis posuere diam quis ante. Aliquam erat volutpat. Suspendisse rutrum imperdiet ipsum. class='tooltip'Lorem ipsum dolor sit.../a/td td rowspan='2'/td /tr On Dec 5, 4:29 pm, Frank [EMAIL PROTECTED] wrote: Simply exchanging A for TD in your script didn't work (that would have been too easy :), it only pops up empty tooltips. I'll continue to play with it.
[jQuery] Re: sortable issue
Hi Richard,
Thanks for replying. I am trying to save /update sequence of elements
whenever it is changed. In following example, if you move 3rd element
at 2nd position then I wanted those two elements only in JS instead of
complete list. But it looks when we change sequence and try to save
the ordering then we need to fire updates for all the elements for
that position is changed..I am trying to figure out for better
approach here...
Thanks,
Bhavin
On Dec 6, 6:28 am, Richard D. Worth [EMAIL PROTECTED] wrote:
I'm not sure your sample provides quite enough detail of what you're going
for. If you have the following
ul
li id=1 class=exampleclass/li
li id=2 class=exampleclass/li
li id=3 class=exampleclass/li
li id=4 class=exampleclass/li
li id=5 class=exampleclass/li
li id=6 class=exampleclass/li
/ul
and you drag 5 to be in-between 1 and 2, like so,
ul
li id=1 class=exampleclass/li
li id=5 class=exampleclass/li
li id=2 class=exampleclass/li
li id=3 class=exampleclass/li
li id=4 class=exampleclass/li
li id=6 class=exampleclass/li
/ul
then what do you want?
- Richard
On Fri, Dec 5, 2008 at 7:15 PM, Bhavin [EMAIL PROTECTED] wrote:
Hi,
I am trying to find out element which are dragged dropped on the
list in following method:
$(#example).sortable({
//if i move 1 at second position then here i want array of
ids 2,1 sequence. ??
// I tried selector but it gives me all the elements. ie.
2,1,3.
});
ul
li id=1 class=exampleclass/li
li id=2 class=exampleclass/li
li id=3 class=exampleclass/li
/ul
Can anyone help me on this?- Hide quoted text -
- Show quoted text -
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
jQuery (English) group.
To post to this group, send email to jquery-en@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/jquery-en?hl=en
-~--~~~~--~~--~--~---
[jQuery] Re: sortable issue
I posed the example as I did because when you move element 5 from position 5
to position 2 you are only moving one element, but it's affecting the
position of 4 elements (2, 3, 4, 5). So when you say you only want to know
about two elements, I'm confused about which two you would be talking about
in my example. Are you saying you only want the elements that have moved?
Perhaps grab the index of the element in the start callback and then again
in the stop/change. Then your range of affected elements is between those
two indexes.
- Richard
On Sat, Dec 6, 2008 at 3:53 PM, Bhavin [EMAIL PROTECTED] wrote:
Hi Richard,
Thanks for replying. I am trying to save /update sequence of elements
whenever it is changed. In following example, if you move 3rd element
at 2nd position then I wanted those two elements only in JS instead of
complete list. But it looks when we change sequence and try to save
the ordering then we need to fire updates for all the elements for
that position is changed..I am trying to figure out for better
approach here...
Thanks,
Bhavin
On Dec 6, 6:28 am, Richard D. Worth [EMAIL PROTECTED] wrote:
I'm not sure your sample provides quite enough detail of what you're
going
for. If you have the following
ul
li id=1 class=exampleclass/li
li id=2 class=exampleclass/li
li id=3 class=exampleclass/li
li id=4 class=exampleclass/li
li id=5 class=exampleclass/li
li id=6 class=exampleclass/li
/ul
and you drag 5 to be in-between 1 and 2, like so,
ul
li id=1 class=exampleclass/li
li id=5 class=exampleclass/li
li id=2 class=exampleclass/li
li id=3 class=exampleclass/li
li id=4 class=exampleclass/li
li id=6 class=exampleclass/li
/ul
then what do you want?
- Richard
On Fri, Dec 5, 2008 at 7:15 PM, Bhavin [EMAIL PROTECTED]
wrote:
Hi,
I am trying to find out element which are dragged dropped on the
list in following method:
$(#example).sortable({
//if i move 1 at second position then here i want array of
ids 2,1 sequence. ??
// I tried selector but it gives me all the elements. ie.
2,1,3.
});
ul
li id=1 class=exampleclass/li
li id=2 class=exampleclass/li
li id=3 class=exampleclass/li
/ul
Can anyone help me on this?- Hide quoted text -
- Show quoted text -
[jQuery] Separate Functions for Events
Hi, I've just started using jQuery and have run into the following
problem that I'm sure has an easy answer.
I want a function to run after an event, for example, if I click on a
test div:
$(#test).click(function(){ $(this).css(color,pink) });
Instead of this, I want to have the effects of the click in a separate
function, like this:
$(#test).click(update_div)
jQuery.fn.update_div = function() {
this.css(color,pink);
};
I know the example is longer, but if I wanted to do more complex
stuff, I feel it would be better put in a separate function.
Is this possible?
thanks,
DAZ
[jQuery] Accessing objects from JSON result with jQuery
Hi,
I'm new jQuery and JSON. I'm trying to use it to populate a dropdown list
through a web service and jQuery. So far I've succeeded in calling the web
service and receiving the list of items in a JSON format. However, now I'm
stuck adding these items to the dropdown list.
my web service returns a list of projects (Items) for a customer:
-
http://localhost:3797/Test.asmx/GetProjectsForCustomer
POST /Test.asmx/GetProjectsForCustomer HTTP/1.1
Host: localhost:3797
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9.0.4)
Gecko/2008102920 Firefox/3.0.4 (.NET CLR 3.5.30729)
Accept: application/json, text/javascript, */*
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Content-Type: application/json; charset=utf-8
X-Requested-With: XMLHttpRequest
Referer: http://localhost:3797/Default.aspx
Content-Length: 19
Pragma: no-cache
Cache-Control: no-cache
{'CustomerId':'39'}
HTTP/1.x 200 OK
Server: ASP.NET Development Server/9.0.0.0
Date: Sat, 06 Dec 2008 18:40:12 GMT
X-AspNet-Version: 2.0.50727
Cache-Control: private, max-age=0
Content-Type: application/json; charset=utf-8
Content-Length: 117
Connection: Close
result:
[{CustomerId:18,Items:[{Text:Sample
Project,Value:6},{Text:Tickets,Value:17}]}]
I'm calling the webservice like this:
function LoadProjects(customerId) {
$.ajax({
type: POST,
contentType: application/json; charset=utf-8,
url: Test.asmx/GetProjectsForCustomer,
data: {'CustomerId':' + customerId + '},
dataType: json,
success: function(msg) {
$(#ProjectList).fillSelect(msg.d);
}
});
}
and then try to use the result in a function, like done in the following
sample:
http://geekswithblogs.net/michelotti/archive/2008/06/28/mvc-json---jsonresult-and-jquery.aspx
$.fn.fillSelect = function(data) {
return this.clearSelect().each(function() {
if (this.tagName == 'SELECT') {
var dropdownList = this;
$.each(data, function(index, item) {
var option = new Option(item.Text, item.Value); //
this row throws an error
if ($.browser.msie) {
dropdownList.add(option);
}
else {
dropdownList.add(option, null);
}
});
}
});
}
When I run it I receive the error Text is null or no object
Through debugging I found out, that data looks like a plain string, content:
[{CustomerId:18,Items:[{Text:Sample
Project,Value:6},{Text:Tickets,Value:17}]}]
Any ideas, what I'm doing wrong? I'm not sure right now whether it's the web
service, or the way I try to access the elements in the result.
So, any help / hints would be greatly appreciated.
Thanks,
Nina
--
View this message in context:
http://www.nabble.com/Accessing-objects-from-JSON-result-with-jQuery-tp20873343s27240p20873343.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Problem with getting data from JSON result
Hi,
I'm new jQuery and JSON. I'm trying to use it to populate a dropdown
list through a web service and jQuery. So far I've succeeded in
calling the web service and receiving the list of items in a JSON
format. However, now I'm stuck adding these items to the dropdown
list.
my web service returns a list of projects (Items) for a customer:
-
http://localhost:3797/Test.asmx/GetProjectsForCustomer
POST /Test.asmx/GetProjectsForCustomer HTTP/1.1
Host: localhost:3797
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:
1.9.0.4) Gecko/2008102920 Firefox/3.0.4 (.NET CLR 3.5.30729)
Accept: application/json, text/javascript, */*
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Content-Type: application/json; charset=utf-8
X-Requested-With: XMLHttpRequest
Referer: http://localhost:3797/Default.aspx
Content-Length: 19
Pragma: no-cache
Cache-Control: no-cache
{'CustomerId':'39'}
HTTP/1.x 200 OK
Server: ASP.NET Development Server/9.0.0.0
Date: Sat, 06 Dec 2008 18:40:12 GMT
X-AspNet-Version: 2.0.50727
Cache-Control: private, max-age=0
Content-Type: application/json; charset=utf-8
Content-Length: 117
Connection: Close
result:
[{CustomerId:18,Items:[{Text:Sample Project,Value:6},
{Text:Tickets,Value:17}]}]
I'm calling the webservice like this:
function LoadProjects(customerId) {
$.ajax({
type: POST,
contentType: application/json; charset=utf-8,
url: Test.asmx/GetProjectsForCustomer,
data: {'CustomerId':' + customerId + '},
dataType: json,
success: function(msg) {
$(#ProjectList).fillSelect(msg.d);
}
});
}
and then try to use the result in a function, like done in the
following sample:
http://geekswithblogs.net/michelotti/archive/2008/06/28/mvc-json---jsonresult-and-jquery.aspx
$.fn.fillSelect = function(data) {
return this.clearSelect().each(function() {
if (this.tagName == 'SELECT') {
var dropdownList = this;
$.each(data, function(index, item) {
var option = new Option(item.Text,
item.Value); // this row throws an error
if ($.browser.msie) {
dropdownList.add(option);
}
else {
dropdownList.add(option, null);
}
});
}
});
}
When I run it I receive the error Text is null or no object
Through debugging I found out, that data looks like a plain string,
content:
[{CustomerId:18,Items:[{Text:Sample Project,Value:6},
{Text:Tickets,Value:17}]}]
Any ideas, what I'm doing wrong? I'm not sure right now whether it's
the web service, or the way I try to access the elements in the
result.
So, any help / hints would be greatly appreciated.
Thanks,
Nina
[jQuery] bresenham algorithm
Hi!
this function draw a line using bresenham algorithm.
I created a selected line to draw. when the user movemouse, the oldest line
is erased and a new selected line is created.
but the process spent a lot of time. I think the problem is in outstanding
line.
Is there best way?
thanks,
Dirceu Barquette
isabela_draw_line = function (s) {
$.fn.isabela_draw.new_set({in_action:true});
$('.isabela_draw_board')
.bind('mousemove',function(e){
relX = e.clientX - s.position.clientX;
relY = e.clientY - s.position.clientY;
absX = relX + s.position.clientX;
absY = relY + s.position.clientY;
Id = 'cel-'+relX+'-'+relY;
var unit = s.brush.length+s.brush.unit;
* $('.selected_to_draw').removeClass();**- empty oldest
positions*
var coords =
line(settings.click_position.clientX,settings.click_position.clientY,absX,absY);
*-Bresenham algorithm*
var str = '';
console.log(coords)
jQuery.each(coords,function(k,v){
str = 'cel-'+v.X+'-'+v.Y;
console.log(str);
if (!$('#'+str).hasClass('layer-1')) {
obj= map({id:str,X:v.X,Y:v.Y});
$('div/div')
.attr({id:str})
.css({position:'absolute',left:v.X,top:v.Y,width:unit,height:unit})
.addClass('layer-1 selected_to_draw')
.appendTo('.isabela_draw_board');
}
})
})
}
[jQuery] if ($(#field).val() == '') or something more elegant?
Hello, I'm wondering if this is the correct way of checking whether the textbox is empty or not: if ($(#text).val() == '') Thanks.
[jQuery] Re: if ($(#field).val() == '') or something more elegant?
Maybe try:
if($('#text').is(':empty'))
--Erik
On Sat, Dec 6, 2008 at 2:12 PM, Costaud [EMAIL PROTECTED] wrote:
Hello,
I'm wondering if this is the correct way of checking whether the
textbox is empty or not:
if ($(#text).val() == '')
Thanks.
[jQuery] Re: Problem with getting data from JSON result
Well, turns out the problem was with my web service. Once I've changed it to
look like this:
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public ListItem[] GetProjectsForCustomer(int CustomerId) {
testJquery.data.TestDataContext dc = new
testJquery.data.TestDataContext();
var result = (from p in dc.Projects
where p.CustomerId == CustomerId
orderby p.Title
select new ListItem(p.Title,
p.ProjectId.ToString())).ToArray();
return result;
}
it worked.
On Sat, Dec 6, 2008 at 10:16 PM, Nina [EMAIL PROTECTED] wrote:
Hi,
I'm new jQuery and JSON. I'm trying to use it to populate a dropdown
list through a web service and jQuery. So far I've succeeded in
calling the web service and receiving the list of items in a JSON
format. However, now I'm stuck adding these items to the dropdown
list.
my web service returns a list of projects (Items) for a customer:
-
http://localhost:3797/Test.asmx/GetProjectsForCustomer
POST /Test.asmx/GetProjectsForCustomer HTTP/1.1
Host: localhost:3797
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:
1.9.0.4) Gecko/2008102920 Firefox/3.0.4 (.NET CLR 3.5.30729)
Accept: application/json, text/javascript, */*
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Content-Type: application/json; charset=utf-8
X-Requested-With: XMLHttpRequest
Referer: http://localhost:3797/Default.aspx
Content-Length http://localhost:3797/Default.aspxContent-Length: 19
Pragma: no-cache
Cache-Control: no-cache
{'CustomerId':'39'}
HTTP/1.x 200 OK
Server: ASP.NET Development Server/9.0.0.0
Date: Sat, 06 Dec 2008 18:40:12 GMT
X-AspNet-Version: 2.0.50727
Cache-Control: private, max-age=0
Content-Type: application/json; charset=utf-8
Content-Length: 117
Connection: Close
result:
[{CustomerId:18,Items:[{Text:Sample Project,Value:6},
{Text:Tickets,Value:17}]}]
I'm calling the webservice like this:
function LoadProjects(customerId) {
$.ajax({
type: POST,
contentType: application/json; charset=utf-8,
url: Test.asmx/GetProjectsForCustomer,
data: {'CustomerId':' + customerId + '},
dataType: json,
success: function(msg) {
$(#ProjectList).fillSelect(msg.d);
}
});
}
and then try to use the result in a function, like done in the
following sample:
http://geekswithblogs.net/michelotti/archive/2008/06/28/mvc-json---jsonresult-and-jquery.aspx
$.fn.fillSelect = function(data) {
return this.clearSelect().each(function() {
if (this.tagName == 'SELECT') {
var dropdownList = this;
$.each(data, function(index, item) {
var option = new Option(item.Text,
item.Value); // this row throws an error
if ($.browser.msie) {
dropdownList.add(option);
}
else {
dropdownList.add(option, null);
}
});
}
});
}
When I run it I receive the error Text is null or no object
Through debugging I found out, that data looks like a plain string,
content:
[{CustomerId:18,Items:[{Text:Sample Project,Value:6},
{Text:Tickets,Value:17}]}]
Any ideas, what I'm doing wrong? I'm not sure right now whether it's
the web service, or the way I try to access the elements in the
result.
So, any help / hints would be greatly appreciated.
Thanks,
Nina
[jQuery] addClass with attrs
Hi!
How can I add a class with its attrs dynamically?
like this (not works, obvious ...)--- $('#div').addClass('blah
{background:#000}')
Thanks,
Dirceu Barquette
[jQuery] Re: addClass with attrs
Try this plugin:
http://plugins.jquery.com/project/Rule
Karl Rudd
On Sun, Dec 7, 2008 at 9:50 AM, Dirceu Barquette
[EMAIL PROTECTED] wrote:
Hi!
How can I add a class with its attrs dynamically?
like this (not works, obvious ...)--- $('#div').addClass('blah
{background:#000}')
Thanks,
Dirceu Barquette
[jQuery] Re: Problem with getting data from JSON result
Hi Nina,
First, let's format your JSON response to make it easier to read. It's fine
to use the shorter
[
{
CustomerId: 18,
Items:[
{
Text: SampleProject,
Value: 6
},
{
Text: Tickets,
Value:17
}
]
}
]
Now let's add some comments to it to show how each element can be accessed:
// msg
[
// msg[0]
{
// msg[0].CustomerId
CustomerId: 18,
// msg[0].Items
Items:[
// msg[0].Items[0]
{
// msg[0].Items[0].Text
Text: SampleProject,
// msg[0].Items[0].Value
Value: 6
},
// msg[0].Items[1]
{
// msg[0].Items[1].Text
Text: Tickets,
// msg[0].Items[1].Value
Value:17
}
]
}
]
Now you can probably see what's wrong. In your success function you are
calling:
$(#ProjectList).fillSelect(msg.d);
But there is no msg.d anywhere to be found. msg is an array containing a
single element, msg[0].
Let's suppose you change it to read:
$(#ProjectList).fillSelect(msg[0]);
So now, in your fillSelect method, data is the same as msg[0]. Let's extract
that portion of the JSON data and change the comments accordingly:
// data
{
// data.CustomerId
CustomerId: 18,
// data.Items
Items:[
// data.Items[0]
{
// data.Items[0].Text
Text: SampleProject,
// data.Items[0].Value
Value: 6
},
// data.Items[1]
{
// data.Items[1].Text
Text: Tickets,
// data.Items[1].Value
Value:17
}
]
}
In your fillSelect method you have this code:
$.each(data, function(index, item) {
var option = new Option( item.Text, item.Value );
// ...
});
This appears to expect data to be an array, but it isn't. data is an object
with two properties named CustomerId and Items. The Items property is an
array:
// data.Items
Items:[
// data.Items[0]
{
// data.Items[0].Text
Text: SampleProject,
// data.Items[0].Value
Value: 6
},
// data.Items[1]
{
// data.Items[1].Text
Text: Tickets,
// data.Items[1].Value
Value:17
}
]
So perhaps you could use:
$.each(data.Items, function(index, item) {
var option = new Option( item.Text, item.Value );
// ...
});
A good way to explore this is to use Firebug and add a debugger statement to
your success function:
success: function(msg) {
debugger;
// ...
}
When the code stops in the debugger, you can try different things in the
Firebug console and see how the data is structured and how to access it. For
example, try:
msg
msg[0]
msg[0].Items
msg[0].Items[0]
msg[0].Items[0].Text
-Mike
From: Nina
Hi,
I'm new jQuery and JSON. I'm trying to use it to populate a dropdown
list through a web service and jQuery. So far I've succeeded in
calling the web service and receiving the list of items in a JSON
format. However, now I'm stuck adding these items to the dropdown
list.
my web service returns a list of projects (Items) for a customer:
-
http://localhost:3797/Test.asmx/GetProjectsForCustomer
POST /Test.asmx/GetProjectsForCustomer HTTP/1.1
Host: localhost:3797
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:
1.9.0.4) Gecko/2008102920 Firefox/3.0.4 (.NET CLR 3.5.30729)
Accept: application/json, text/javascript, */*
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive: 300
Connection: keep-alive
Content-Type: application/json; charset=utf-8
X-Requested-With: XMLHttpRequest
Referer: http://localhost:3797/Default.aspx
Content-Length: 19
Pragma: no-cache
Cache-Control: no-cache
{'CustomerId':'39'}
HTTP/1.x 200 OK
Server: ASP.NET Development Server/9.0.0.0
Date: Sat, 06 Dec 2008 18:40:12 GMT
X-AspNet-Version: 2.0.50727
Cache-Control: private, max-age=0
Content-Type: application/json; charset=utf-8
Content-Length: 117
Connection: Close
result:
[{CustomerId:18,Items:[{Text:Sample Project,Value:6},
{Text:Tickets,Value:17}]}]
I'm calling the webservice like this:
function LoadProjects(customerId) {
$.ajax({
[jQuery] Re: Separate Functions for Events
Sure, you can do this, but it's less complicated than that.
Don't make your function a method of the jQuery object. Simply make it an
ordinary named function with *exactly* the same code as the anonymous
function.
So your code:
$(#test).click(function(){ $(this).css(color,pink) });
becomes:
$(#test).click(update_div);
function update_div(){ $(this).css(color,pink) }
The only caveat would be that if you move this named function to a different
location, it may lose access to variables declared in the outer function.
Suppose your code looked like this:
function test() {
var color = 'pink';
$(#test).click(function(){ $(this).css(color,color) });
}
This would work the same:
function test() {
var color = 'pink';
$(#test).click(setColor);
function setColor(){ $(this).css(color,color) }
}
But this would not work:
function test() {
var color = 'pink';
$(#test).click(setColor);
}
function setColor(){ $(this).css(color,color) }
because setColor has lost its access to the variable.
-Mike
-Original Message-
From: jquery-en@googlegroups.com
[mailto:[EMAIL PROTECTED] On Behalf Of DAZ
Sent: Saturday, December 06, 2008 10:55 AM
To: jQuery (English)
Subject: [jQuery] Separate Functions for Events
Hi, I've just started using jQuery and have run into the
following problem that I'm sure has an easy answer.
I want a function to run after an event, for example, if I
click on a test div:
$(#test).click(function(){ $(this).css(color,pink) });
Instead of this, I want to have the effects of the click in a
separate function, like this:
$(#test).click(update_div)
jQuery.fn.update_div = function() {
this.css(color,pink);
};
I know the example is longer, but if I wanted to do more
complex stuff, I feel it would be better put in a separate function.
Is this possible?
thanks,
DAZ
[jQuery] Re: addClass with attrs
Very good!!! I think is perfect to my application!!
Thank you!
Dirceu Barquette
2008/12/6 Karl Rudd [EMAIL PROTECTED]
Try this plugin:
http://plugins.jquery.com/project/Rule
Karl Rudd
On Sun, Dec 7, 2008 at 9:50 AM, Dirceu Barquette
[EMAIL PROTECTED] wrote:
Hi!
How can I add a class with its attrs dynamically?
like this (not works, obvious ...)--- $('#div').addClass('blah
{background:#000}')
Thanks,
Dirceu Barquette
[jQuery] Re: Webdeveloper to WebDeveloper
Dear kalus, yes are article are copied from various sources of the web, and there is a link to the source above on each post , in the next week our Projects and Our works is going to be upgraded on the website , we are also developing a Shopping cart builder which is based by Ajax based by jQuery Library . one of these days it is going to be released . thanks On Dec 6, 7:19 am, Klaus Hartl [EMAIL PROTECTED] wrote: Maybe you should make clearer that the articles are copied from somewhere else (out of the web). --Klaus On 6 Dez., 03:43,Pedram[EMAIL PROTECTED] wrote: Dear folk , If you're interested on web development Articles which is updated and has lots of new information.(Web developer to web developer) I have just started a Blog which contains (jQuery ,Css,html,Php,Mysql,json,Ajax) take a look at ithttp://www.pedramdev.com, this Blog gets the best articles out of the web and also at the end of the week it has some conclusions enjoy it . If any one is interested please let me know [EMAIL PROTECTED] . SincerelyPedram.
[jQuery] Re: Confirm Deletion
When you execute this statement:
window.location.href = 'test.php?delnews=' + this.id;
you are navigating the browser to a new page. This terminates any JavaScript
on the current page, and your DELETED alert will not be displayed.
It sounds like you want to remain on the same page, so you should be using
an Ajax call instead of navigating to a new page.
Also, deleting a row with a simple GET is dangerous. What if a search engine
crawler or a browser pre-fetcher happens to do a GET on that URL? It should
probably be a POST instead.
-Mike
From: james182
i need to delete a row from mysql DB, click delete buttonn
and fadeout then delete record from DB.
HELP PLEASE ...
Below is my code:
$(document).ready(function() {
$(a.delete).click(function() {
if (confirm('Are you sure you want to
delete ? - ' + this.id)) {
$(this).parent().fadeOut(1000,
function() {
$(this).parent('tr').remove();
//delete(this.id);
window.location.href =
'test.php?delnews=' + this.id;
alert('DELETED');
});
}
});
});
--
View this message in context:
http://www.nabble.com/Confirm-Deletion-tp20869801s27240p20869801.html
Sent from the jQuery General Discussion mailing list archive
at Nabble.com.
[jQuery] IE 7 Issue with Tab with left: -10000px
Following works strange in IE when using Jquery Tabs:
.ui-tabs-hide {
position: absolute;
left: -1px;
}
When I do the above, on IE 7, the width of the pages in tabs become
huge and goes out of page on left and right both.
These tab pages have tables. And I do NOT have table width set to
100%.
It works fine on firefox and safari.
Any clues what could be wrong?
[jQuery] Re: if ($(#field).val() == '') or something more elegant?
That is always saying the field is empty.
On Dec 6, 5:24 pm, Erik Beeson [EMAIL PROTECTED] wrote:
Maybe try:
if($('#text').is(':empty'))
--Erik
On Sat, Dec 6, 2008 at 2:12 PM, Costaud [EMAIL PROTECTED] wrote:
Hello,
I'm wondering if this is the correct way of checking whether the
textbox is empty or not:
if ($(#text).val() == '')
Thanks.
[jQuery] Re: if ($(#field).val() == '') or something more elegant?
Whoops, that matches has no children. I think what you did is fine.
--Erik
On Sat, Dec 6, 2008 at 3:56 PM, Costaud [EMAIL PROTECTED] wrote:
That is always saying the field is empty.
On Dec 6, 5:24 pm, Erik Beeson [EMAIL PROTECTED] wrote:
Maybe try:
if($('#text').is(':empty'))
--Erik
On Sat, Dec 6, 2008 at 2:12 PM, Costaud [EMAIL PROTECTED] wrote:
Hello,
I'm wondering if this is the correct way of checking whether the
textbox is empty or not:
if ($(#text).val() == '')
Thanks.
[jQuery] Re: IE 7 Issue with Tab with left: -10000px
Is there any reason why you aren't just hiding the tab with a display:none?
JK
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Ashish
Sent: Saturday, December 06, 2008 3:47 PM
To: jQuery (English)
Subject: [jQuery] IE 7 Issue with Tab with left: -1px
Following works strange in IE when using Jquery Tabs:
.ui-tabs-hide {
position: absolute;
left: -1px;
}
When I do the above, on IE 7, the width of the pages in tabs become
huge and goes out of page on left and right both.
These tab pages have tables. And I do NOT have table width set to
100%.
It works fine on firefox and safari.
Any clues what could be wrong?
[jQuery] Re: IE 7 Issue with Tab with left: -10000px
I am using Yui data table in some tabs and YUI data table column sizes
go all weird with display: none
any solutions?
On Dec 6, 4:03 pm, Jeffrey Kretz [EMAIL PROTECTED] wrote:
Is there any reason why you aren't just hiding the tab with a display:none?
JK
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Ashish
Sent: Saturday, December 06, 2008 3:47 PM
To: jQuery (English)
Subject: [jQuery] IE 7 Issue with Tab with left: -1px
Following works strange in IE when using Jquery Tabs:
.ui-tabs-hide {
position: absolute;
left: -1px;
}
When I do the above, on IE 7, the width of the pages in tabs become
huge and goes out of page on left and right both.
These tab pages have tables. And I do NOT have table width set to
100%.
It works fine on firefox and safari.
Any clues what could be wrong?
[jQuery] Re: Click event broken by AJAX - explain please?
Doesn't this work?
$(a).click(function() {
var self = this;
$.get($(self).attr('href'),function(html){
// put the html into a textbox
});
return false;
};
On Dec 6, 5:00 pm, donb [EMAIL PROTECTED] wrote:
Having read the handful of mentions I could find, the underlying 'why'
is still a mystery to me. I tried stepping through the code with
Firebug but can't make out why it's not working, although I have MADE
it work in this manner:
$(a).click(
function() {
var self = this;
setTimeout(
function() {
$.get(
$(self).attr('href'),
function(html){
...put the html into a textbox...
}
)},
500
);
return false;
}
So what is the actual reason when the .get() executes, the return
false never happens, unless I do the setTimeout trick to effectively
move the get OUT of the click function?
If I just have in-line code, no AJAX action, the code proceeds merrily
along to the return and suppresses my event-bubbling nicely.
When I step through the code WITH an AJAX action in there (no
setTimeout), then execution never returns to the 'return'.
I concede that's just the way it is, but I would like to understand
why it's that way. Bug, design tradeoff, was overlooked by developer,
can't be done for some reason because of javascript architecture,
other?
[jQuery] Re: IE 7 Issue with Tab with left: -10000px
You could post a test case page and I could take a look at it, but if there
is any way so do the same layout with divs and CSS instead of tables, you
are likely to have the different browsers play a bit more friendly.
There is a whole host of nasty issues that disappear once you can move away
from a table-based layout.
JK
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Ashish
Sent: Saturday, December 06, 2008 4:30 PM
To: jQuery (English)
Subject: [jQuery] Re: IE 7 Issue with Tab with left: -1px
I am using Yui data table in some tabs and YUI data table column sizes
go all weird with display: none
any solutions?
On Dec 6, 4:03 pm, Jeffrey Kretz [EMAIL PROTECTED] wrote:
Is there any reason why you aren't just hiding the tab with a
display:none?
JK
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Ashish
Sent: Saturday, December 06, 2008 3:47 PM
To: jQuery (English)
Subject: [jQuery] IE 7 Issue with Tab with left: -1px
Following works strange in IE when using Jquery Tabs:
.ui-tabs-hide {
position: absolute;
left: -1px;
}
When I do the above, on IE 7, the width of the pages in tabs become
huge and goes out of page on left and right both.
These tab pages have tables. And I do NOT have table width set to
100%.
It works fine on firefox and safari.
Any clues what could be wrong?
[jQuery] Hot to remove or replace onclick function
HTML
-
div id=navBoxdiv/div/div
ul
liimg src=images/nav/nav_left.jpg //li
liimg src=images/nav/btn_nav1.jpg alt=�P於新�]和�I //li
liimg src=images/nav/btn_nav2.jpg alt=�a品展示 //li
liimg src=images/nav/btn_nav3.jpg alt=技能培��中心 //li
liimg src=images/nav/btn_nav4.jpg alt=服�� //li
liimg src=images/nav/btn_nav5.jpg alt=要�� //li
lia href=member/member_login.phpimg src=images/nav/
btn_nav6.jpg alt=���T���^ //a/li
liimg src=images/nav/btn_nav7.jpg alt=人才招聘 //li
liimg src=images/nav/nav_right.jpg //li
div class=clear/div
/ul
/div
script language=javascript
!--
$(document).ready(function()
{
/*navigation initial*/
navInitial();
});
//--
/script
CSS
-
#nav
{
position:relative;
cursor:pointer;
}
#nav img
{
border:0px;
}
#nav ul
{
margin:0px;
padding:0px;
list-style:none;
}
#nav li
{
float:left;
}
.clear
{
clear:both;
}
#navBox
{
position:absolute;
width:120px;
height:44px;
border:1px solid #00;
overflow:hidden
}
#navBox div
{
background-color:#F8965A;
width:120px;
height:44px;
}
Javascript
-
function navInitial()
{
var $nb = $('#navBox');
$('#navBox div').css('opacity',0.3);
$arr = {'b1':60,'b2':179,'b3':300,'b4':420,'b5':540,'b6':660,'b7':
780};
$('#nav li:gt(0):lt(7)').mouseover(function()
{
var index = $('#nav li').index(this);
var move = $arr['b'+index] + 'px';
$nb.stop().animate({left:move});
if(index == 6)
{
$nb.click(function()
{
window.location = 'member/member_login.php';
});
}
else
{
$nb.click(function()
{
window.location = '';
});
}
});
}
Hi, I use li and image for navigation button, and the script means,
when I mouse over any button, there will be a transparent div slide
above the button, but the div will cover the button, therefore, I
can't click the button to go to the page, so I write another code to
give the div a hyper link, here comes the question, some button do not
have hyper link, because it got sub menu, I will do another effect
when mouse over those button, that's mean I need to cancel if the div
move to the button which have hyper link, how to do that?
[jQuery] Re: if ($(#field).val() == '') or something more elegant?
Sure, that's fine. You could also do this:
if (!$('#text').val())
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 6, 2008, at 5:12 PM, Costaud wrote:
Hello,
I'm wondering if this is the correct way of checking whether the
textbox is empty or not:
if ($(#text).val() == '')
Thanks.
[jQuery] Re: IE 7 Issue with Tab with left: -10000px
Thanks i will try that, the reason I moved to table based layout was
because,
when I resize the browser (say by dragging the bottom right corner of
browser) the content in tables resize very nicely in browser window.
could not get the same without tables.
On Dec 6, 5:29 pm, Jeffrey Kretz [EMAIL PROTECTED] wrote:
You could post a test case page and I could take a look at it, but if there
is any way so do the same layout with divs and CSS instead of tables, you
are likely to have the different browsers play a bit more friendly.
There is a whole host of nasty issues that disappear once you can move away
from a table-based layout.
JK
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Ashish
Sent: Saturday, December 06, 2008 4:30 PM
To: jQuery (English)
Subject: [jQuery] Re: IE 7 Issue with Tab with left: -1px
I am using Yui data table in some tabs and YUI data table column sizes
go all weird with display: none
any solutions?
On Dec 6, 4:03 pm, Jeffrey Kretz [EMAIL PROTECTED] wrote:
Is there any reason why you aren't just hiding the tab with a
display:none?
JK
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Ashish
Sent: Saturday, December 06, 2008 3:47 PM
To: jQuery (English)
Subject: [jQuery] IE 7 Issue with Tab with left: -1px
Following works strange in IE when using Jquery Tabs:
.ui-tabs-hide {
position: absolute;
left: -1px;
}
When I do the above, on IE 7, the width of the pages in tabs become
huge and goes out of page on left and right both.
These tab pages have tables. And I do NOT have table width set to
100%.
It works fine on firefox and safari.
Any clues what could be wrong?
[jQuery] Re: Optimizing Easiest Tooltip
Hi Frank,
Let me know how it goes with your testing.
In the meantime, I converted the script to a plugin, so after you
include it, you can just do this:
$('table').simpletip('a'); This will display a tooltip for every link
within the table element, using event delegation.
It also has some options, so you could do something like this:
$('table').simpletip('a.tooltip', {opacity: 0.6, contentAttrs:
['title', 'href']});
This will display a tooltip for every link with class=tooltip within
a table and set the opacity to 60% and show the link's title and href
in the tooltip.
Here is a demo:
http://plugins.learningjquery.com/simpletip/demo/
And here is the plugin code:
http://plugins.learningjquery.com/simpletip/simpletip.js
Glad you like the website!
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 6, 2008, at 3:31 PM, Frank wrote:
Hm, how very odd indeed. There must something else on my page
conflicting with it then. I'll strip it to the barebones and work my
way back up. Thanks for all the help so far!
May I also say that your website (learningjquery.com) has been an
invaluable font of knowledge for jQuery, as well as both of your
books.
Frank.
On Dec 5, 8:08 pm, Karl Swedberg [EMAIL PROTECTED] wrote:
Ok, I dropped your table into my page, and it seems to work fine.
http://test.learningjquery.com/very-simple-tooltip.html
--Karl
Karl Swedbergwww.englishrules.comwww.learningjquery.com
On Dec 5, 2008, at 11:45 AM, Frank wrote:
Also, I just realised that putting titles on TDs is a silly idea,
and completely invalid. But I tried it with a direct copy of your
script after putting actual links in, but still only get empty
tooltips. Here is an example row:
tr class='adminRow3'
td colspan='3'a href='#' title=Full Title Here
class='tooltip'bAbridged Title/b/a/td
td align='center' style='background-color: #c00'-/td
td align='center' style='background-color: #c00'-/td
td align='center' style='background-color: #c00'-/td
td align='center' style='background-color: #c00'-/td
td align='center' style='background-color: #c00'-/td
td align='center' style='background-color: #c00'-/td
td align='center' style='background-color: #c00'-/td
td align='center' style='background-color: #c00'-/td
td align='center' style='background-color: #c00'-/td
td align='center' style='background-color: #c00'-/td
td align='center' style='background-color: #c00'-/td
td rowspan='2' align='center' style='padding: 1px; background-
color:
#921ba9'Y/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center' style='padding: 1px'/td
td rowspan='2' align='center'2/td
td rowspan='2' style='font-size: 8px'06:01, 05:55/td
td align='center'Y/td
td rowspan='2' align='center' style='background-color: #c00'-/td
td rowspan='2'a href='' title=Lorem ipsum dolor sit amet,
consectetur adipiscing elit. Integer purus. Duis posuere diam quis
ante. Aliquam erat volutpat. Suspendisse rutrum imperdiet ipsum.
class='tooltip'Lorem ipsum dolor sit.../a/td
td rowspan='2'/td
/tr
On Dec 5, 4:29 pm, Frank [EMAIL PROTECTED] wrote:
Simply exchanging A for TD in your script didn't work (that
would
have been too easy :), it only pops up empty tooltips. I'll
continue
to play with it.
[jQuery] Please comment on any shortcomings of code or logic
Hello friends, I am learning jquery these days and I am building small plugins just for learning purposes. This link show a paginator plugin I just made. http://pastebin.me/493aa9fe2b475 Kindly give any suggestions you will, so that I can improve my learning and understanding. I would be grateful regards shavinder
[jQuery] Re: bresenham algorithm
The best way is using canvas. It works in all modern browsers. Other than
that, if you really must do it with dom elements, the biggest single
improvement you can make to your code is to do DOM manipulation once, up
front. Add a bunch of divs (enough for the longest line you would draw) and
keep references to them in an array. Creating, appending, then removing so
many elements (as well as setting css classnames that are identical for all)
while the mouse is moving is going to be really really slow. Then after that
the next fastest improvement is to not use jQuery to modify their style
properties to reposition/resize them, but just the straight element style
property.
- Richard
On Sat, Dec 6, 2008 at 4:59 PM, Dirceu Barquette [EMAIL PROTECTED]
wrote:
Hi!
this function draw a line using bresenham algorithm.
I created a selected line to draw. when the user movemouse, the oldest line
is erased and a new selected line is created.
but the process spent a lot of time. I think the problem is in outstanding
line.
Is there best way?
thanks,
Dirceu Barquette
isabela_draw_line = function (s) {
$.fn.isabela_draw.new_set({in_action:true});
$('.isabela_draw_board')
.bind('mousemove',function(e){
relX = e.clientX - s.position.clientX;
relY = e.clientY - s.position.clientY;
absX = relX + s.position.clientX;
absY = relY + s.position.clientY;
Id = 'cel-'+relX+'-'+relY;
var unit = s.brush.length+s.brush.unit;
* $('.selected_to_draw').removeClass();**- empty oldest
positions*
var coords =
line(settings.click_position.clientX,settings.click_position.clientY,absX,absY);
*-Bresenham algorithm*
var str = '';
console.log(coords)
jQuery.each(coords,function(k,v){
str = 'cel-'+v.X+'-'+v.Y;
console.log(str);
if (!$('#'+str).hasClass('layer-1')) {
obj= map({id:str,X:v.X,Y:v.Y});
$('div/div')
.attr({id:str})
.css({position:'absolute',left:v.X,top:v.Y,width:unit,height:unit})
.addClass('layer-1 selected_to_draw')
.appendTo('.isabela_draw_board');
}
})
})
}
[jQuery] Re: IE 7 Issue with Tab with left: -10000px
Understood.
There are a number of resources that will help you do a CSS based layout
that will accomplish exactly that. Here are a couple I just found on
Google:
http://www.glish.com/css/
http://www.yourhtmlsource.com/stylesheets/csslayout.html
JK
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Ashish
Sent: Saturday, December 06, 2008 7:23 PM
To: jQuery (English)
Subject: [jQuery] Re: IE 7 Issue with Tab with left: -1px
Thanks i will try that, the reason I moved to table based layout was
because,
when I resize the browser (say by dragging the bottom right corner of
browser) the content in tables resize very nicely in browser window.
could not get the same without tables.
On Dec 6, 5:29 pm, Jeffrey Kretz [EMAIL PROTECTED] wrote:
You could post a test case page and I could take a look at it, but if
there
is any way so do the same layout with divs and CSS instead of tables, you
are likely to have the different browsers play a bit more friendly.
There is a whole host of nasty issues that disappear once you can move
away
from a table-based layout.
JK
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Ashish
Sent: Saturday, December 06, 2008 4:30 PM
To: jQuery (English)
Subject: [jQuery] Re: IE 7 Issue with Tab with left: -1px
I am using Yui data table in some tabs and YUI data table column sizes
go all weird with display: none
any solutions?
On Dec 6, 4:03 pm, Jeffrey Kretz [EMAIL PROTECTED] wrote:
Is there any reason why you aren't just hiding the tab with a
display:none?
JK
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Ashish
Sent: Saturday, December 06, 2008 3:47 PM
To: jQuery (English)
Subject: [jQuery] IE 7 Issue with Tab with left: -1px
Following works strange in IE when using Jquery Tabs:
.ui-tabs-hide {
position: absolute;
left: -1px;
}
When I do the above, on IE 7, the width of the pages in tabs become
huge and goes out of page on left and right both.
These tab pages have tables. And I do NOT have table width set to
100%.
It works fine on firefox and safari.
Any clues what could be wrong?
[jQuery] How can I make a td clickable?
Hello, I have something like this: ... td class=menuitem width=100 align=center nowrapa href=index.html class=menuHome/a/td ... How can I make the whole td clickable leading to index.html not just the text. I searched Google but I couldn't find anything about this. Your help would be greatly appreciated.
[jQuery] Re: if ($(#field).val() == '') or something more elegant?
Karl's suggestion is how I always do it...simplest IMO.
On Dec 6, 8:19 pm, Karl Swedberg [EMAIL PROTECTED] wrote:
Sure, that's fine. You could also do this:
if (!$('#text').val())
--Karl
Karl Swedbergwww.englishrules.comwww.learningjquery.com
On Dec 6, 2008, at 5:12 PM, Costaud wrote:
Hello,
I'm wondering if this is the correct way of checking whether the
textbox is empty or not:
if ($(#text).val() == '')
Thanks.
[jQuery] Re: Click event broken by AJAX - explain please?
I'm having the exact same issue, but ony in IE 6/7, using getScript
(). I'm wondering if it has to do with sending a GET request and IE
is funky about it???
On Dec 6, 7:16 pm, ricardobeat [EMAIL PROTECTED] wrote:
Doesn't this work?
$(a).click(function() {
var self = this;
$.get($(self).attr('href'),function(html){
// put the html into a textbox
});
return false;
};
On Dec 6, 5:00 pm, donb [EMAIL PROTECTED] wrote:
Having read the handful of mentions I could find, the underlying 'why'
is still a mystery to me. I tried stepping through the code with
Firebug but can't make out why it's not working, although I have MADE
it work in this manner:
$(a).click(
function() {
var self = this;
setTimeout(
function() {
$.get(
$(self).attr('href'),
function(html){
...put the html into a textbox...
}
)},
500
);
return false;
}
So what is the actual reason when the .get() executes, the return
false never happens, unless I do the setTimeout trick to effectively
move the get OUT of the click function?
If I just have in-line code, no AJAX action, the code proceeds merrily
along to the return and suppresses my event-bubbling nicely.
When I step through the code WITH an AJAX action in there (no
setTimeout), then execution never returns to the 'return'.
I concede that's just the way it is, but I would like to understand
why it's that way. Bug, design tradeoff, was overlooked by developer,
can't be done for some reason because of javascript architecture,
other?
[jQuery] Re: bind a function to another function
I think I understand what you are trying to do, but the example is rather confusing. Can you use maybe more unique names? I got mixed up because of this: The variable called1 will have 'called1-fun1' and The variable called2 will have 'called1-fun2'. called1-fun1 should be class1-fun1 and called1-fun2 should be class1- fun2, right? Joe On Dec 6, 11:22 am, Prajwala Manchikatla [EMAIL PROTECTED] wrote: Hi all, I released my first jquery plugin. It is about binding or connecting a function to another function. It is just like binding a handler function to event. Please have a look at it and send me your comments.http://plugins.jquery.com/project/jqConnect cheers, Prajwala
