[jQuery] Combining ajaxForm and livequery
Can I use livequery on ajaxForm? or is there another way to add event listeners to ajax produced form? This page redirects to the example http://reenie.org/test/hffc.php If you click Login and add any name, the form submits and shows you logged in. If you don't add a name the form submits and mimics the situation where the user is not found. It displays an error message and displays the login form again The close button works before and after the form is rewritten because it uses livequery to bind it to the click function. $(#loginclose) .livequery('click', function(event) { //closes login box } However, after the form is submitted, the form's event listeners are missing.and the form is will not be submitted via ajax again. I'm using this code to bind the form to the options function. $('#loginform').ajaxForm(options); How do I bind the form again without reloading the page?
[jQuery] Re: What's wrong with my slideUp slideDown?
Hi, I think your problem is because #result is empty first time through so slideUp doesn't do anything - therefore slideDown doesn't either. Try adding this as the first document ready item to populate #result with a blank paragraph: $(#result).html('pnbsp;/p'); Paul
[jQuery] Need help modifying this jQuery...
I'm trying to put my first Ajax to use by creating a login form. To get there, I'm attempting to modify the first tutorial I've found which I understand enough to understand what it's doing and how it's working with a ColdFusion backend. Anyway, my first question is: How do I modify the code below to send an email address (form.email_address) and password (form.password) to the url: request_processor.cfm? The code below was just for a form with a select which, when the value changed, would cause an item in a db to be read and appear. I'm modifying it for email_address and password fields, with a submit button. $(document).ready(function(){ $('#contentdiv').html('nbsp;'); $('#idm').change(function(){ var formval = {idm:$(this).val()}; $.ajax({ type: POST, url: request_processor.cfm, dataType: json, data: formval, success: function(response){ $('#contentdiv').empty().fadeIn(1000).append(response.main_dish); } }); }); }); So, I'd have: $(document).ready(function(){ $('#contentdiv').html('nbsp;'); $('#login-button').click(function(){ var formval = {email address, password:$(this).val()}; --- (???) $.ajax({ type:post, url:request_processor.cfm, dataType:json, data:formval success:function(response){ $('#contentdiv').empty().fadeIn(1000).append(response.login_message); } }); }); }); What changes need to be made? Thanks for any help! Rick
[jQuery] Re: bresenham algorithm
(sorry my english...) Hi, You are right about your explain. But you can see at isabeladraw.sourceforge.net what I've been developing. In this implements the app build 1px div per div. This is very slow!! But for the next version (you can see at http://calango.barquettenet.net/~dirceu/isabela/jquery.isabela_draw) on mouseover the canvas builds div with dimensions choiced are draw in absolute position. When you want to make a line the app uses bresenham algorithm. In fact, canvas is the best way, but jQuery makes easy DOM manipulation and you can make a valid html image for your websites. And the code is very simple You can make funcionalities like modules and merge it to the code. My wish is sharing this code with all. Thank you very much. Your opinion is very important! Dirceu Barquette 2008/12/7 Richard D. Worth [EMAIL PROTECTED] 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: click not triggering on safari (mac), chrome (windows)?
Hi Karl, Thanks for the suggestion! I think that's me still thinking of cancelling handelers manually, not sure if it was helping or not. Anyway, it's made no difference - I'm wondering if anyone else has come across a similar problem, and solved it, or can shed some insight into what may be causing problems like this? Dave On Dec 6, 2:59 am, Karl Swedberg [EMAIL PROTECTED] wrote: Hi Dave, It could be the return(false). Try removing that line and see what happens. You already have the e.preventDefault() in there anyway. --Karl Karl Swedbergwww.englishrules.comwww.learningjquery.com On Dec 5, 2008, at 6:47 PM, dave wrote: Hi jQueriers, Bumped into an oddity on Safari and Chrome. I have a HTML page and I want to intercept all a links and feed them through an ajax request instead. So I first do this $(a).bind(click,handleAjaxifiedLink); which routes clicks to function handleAjaxifiedLink(e) { e.preventDefault(); loadPage(e.target.href); return(false); } This works under IE and Firefox, but Chrome and Safari just seem to ignore it. Am I missing something really obvious? I don't run Safari and the debugger in chrome is unhelpful, to say the least. Examples of code athttp://dev.welovekaoru.client.tandot.co.uk/and http://dev.welovekaoru.client.tandot.co.uk/static/wlk.js. TIA to any smart cookies!- Hide quoted text - - Show quoted text -
[jQuery] Re: bresenham algorithm
P.S: at w3schools.com: *Note:* The canvas tag is only a container for graphics, you must use a script to actually paint graphics. Thanks 2008/12/7 Dirceu Barquette [EMAIL PROTECTED] (sorry my english...) Hi, You are right about your explain. But you can see at isabeladraw.sourceforge.net what I've been developing. In this implements the app build 1px div per div. This is very slow!! But for the next version (you can see at http://calango.barquettenet.net/~dirceu/isabela/jquery.isabela_drawhttp://calango.barquettenet.net/%7Edirceu/isabela/jquery.isabela_draw) on mouseover the canvas builds div with dimensions choiced are draw in absolute position. When you want to make a line the app uses bresenham algorithm. In fact, canvas is the best way, but jQuery makes easy DOM manipulation and you can make a valid html image for your websites. And the code is very simple You can make funcionalities like modules and merge it to the code. My wish is sharing this code with all. Thank you very much. Your opinion is very important! Dirceu Barquette 2008/12/7 Richard D. Worth [EMAIL PROTECTED] 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] SlideShow based on SQL Server
I am brand new to JQuery, but very excited over it. I have looked at s3Slider and similar packeges, but they all seem to get their images statically, either by referencing a folder or by just referring to them (1.jpg, 2.jpg, ). I have a database with image paths (images/woof1.jpg), for example. How do I use JQuery with an asp.net technology, like Linq, or even a Web Service to be able to feed a slideshow, or anything similar? Thanks to all, Paolo
[jQuery] Re: Nokia 95 AJAX problem
ah yeah! excellent! Cheers for Chiming in Alex!!!... that's made me feel a little bit better :) On Dec 6, 2:02 am, Alex Hempton-Smith [EMAIL PROTECTED] wrote: I have an iPhone 3G so I'd better chip-in here :P The iPhone has iPhone Safari installed, which was forked somewhere in-between Safari 2 and Safari 3 - meaning you have more CSS support that 2, but less than 3. The great Facebook web-app for the iPhone can be visited manually at [http://iphone.facebook.com/], where you can see the extensive use of AJAX. Therefore, AJAX does work on the iPhone and you can be pretty sure that if it works in Safari it will *probably*, most likely, work on the iPhone. :) Hope this helps, Alex On Fri, Dec 5, 2008 at 11:27 PM, nmiddleweek [EMAIL PROTECTED]wrote: Hello guys! I'm doing mobile web work and am using jQuery for AJAX callbacks... It all works nicely on my Vista Box using Safari, IE7, FF3 and Chrome and I've been testing it on my N95 browser which I think is Safari version 2.0 -www.cyscape.com told me :) I've hit a problem with the AJAX calls on the N95, I'm getting a 'success' on the textStatus when using $('#hidden').load (url,,callback(data, textStatus)) but the data part is null. On the other browsers it's returning the contents of the server response but the N95 is giving me a null. The contents of the $('#hidden').html() is not getting getting updated. I've also tried using jQuery.get(url,,callback(data)) but the data value is null as well. I'm thinking that my N95 doesn't support AJAX calls or the jQuery implementation of it? Is there any way I can test this further? Does anyone know if AJAx works on the iPhone? I don't have one to test :( Thanks, N
[jQuery] Re: Combining ajaxForm and livequery
I figured this out and I have fixed the example, so it will no longer show the problem. Basically, the solution is to wrap the call to ajaxForm ( including the options parameter) in liveQuery $('#loginform').livequery(function(){ var options = { target: '#loginsection', url:'login.php', success:function() { alert(success!); } }; $('#loginform').ajaxForm(options); return false; }); instead of this: var options = { target: '#loginsection', url:'login.php', /* success:function() { alert(success!); } */ }; $('#loginform').ajaxForm(options); On Dec 7, 4:34 am, rodeored [EMAIL PROTECTED] wrote: Can I use livequery on ajaxForm? or is there another way to add event listeners to ajax produced form? This page redirects to the examplehttp://reenie.org/test/hffc.php If you click Login and add any name, the form submits and shows you logged in. If you don't add a name the form submits and mimics the situation where the user is not found. It displays an error message and displays the login form again The close button works before and after the form is rewritten because it uses livequery to bind it to the click function. $(#loginclose) .livequery('click', function(event) { //closes login box} However, after the form is submitted, the form's event listeners are missing.and the form is will not be submitted via ajax again. I'm using this code to bind the form to the options function. $('#loginform').ajaxForm(options); How do I bind the form again without reloading the page?
[jQuery] Re: if ($(#field).val() == '') or something more elegant?
Not sure but should be like this: if($(#'text').val('')); Try up this and let me know if it works. -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Costaud Sent: Sunday, December 07, 2008 3:43 AM To: jQuery (English) Subject: [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] [validate] Multiplying error messages
This is my first time trying to use the validate script. It looks great, but something is wrong with my set up. I basically tried copying the functionality of the simple demo. script type=text/javascript src=/js/jquery-1.2.6.min.js/script script type=text/javascript src=/js/jquery.validate.js /script script type=text/javascript $(document).ready( function(){ $('#regForm').validate(); }); /script h2Register/h2 table cellspacing=4 form id=regForm action=/user/register method=post tr td class=formLabellabel for=first_nameFirst Name:*/label/td tdinput type=text name=first_name id=first_name class=required/td /tr tr td class=formLabellabel for=last_nameLast Name:*/label/td tdinput type=text name=last_name id=last_name class=required/ td /tr tr td class=formLabellabel for=emailEmail:*/label/td tdinput type=text name=email id=email class=required email/ td /tr tr td colspan=2 align=centerinput class=toggleButton id=formButton type=submit value=Send Application/td /tr /form /table It validates when I hit the send button, and displays error messages like I would expect. However, there are a couple of problems. 1. It only validates when I hit the submit button. If I go back and try to fix the mistakes, they don't revalidate until I hit submit again. 2. If I leave something blank or there is some other error, the original error message doesn't go away. So for my email address, if I put in an invalid email address after having left it blank on the first go-round the error messages will stack up Please enter a valid email addres.This field is required. It seems pretty straightforward, but obviously I'm doing something wrong. Can someone offer a bit of guidance? -Sean
[jQuery] Re: Superfish: Can't make the shadow and animation work
Hi there, In my case i have the animation but no shadow and no arrow image. Instead of the arrow image I get a (raquo). Better than nothing as it works out of the box (love jquery for that) for animation and it's pretty easy to customize with CSS. Tough it would be perfect to have the arrow and shadow. Anybody know what could be wrong? concretiative, have you trying loading jquery with noConflict() ? On Nov 22, 4:36 am, conticreative [EMAIL PROTECTED] wrote: I am using Superfish vertical in aJoomlasite and while it is working quite well as a vertical menu, the animation and the drop shadow just don;t work.I have tried just about anything and I have used the initialization from several examples without anything ever changing. I modified the CSS quite a bit (could that be it?) but I left the JS intact. I did have to remap a few things to adapt it to theJoomla menu system, but the mapping of the images is correct (I map it absolute while in development so I can work with it in the dev toolbar). Beside the shadow, the menu animation just doesn't work and I have used the same code and initialization as in the examples. The URL of the staging site is here:http://www.lmag.us/staging15/ in case anyone is kind enough to take a look. By the time you look at it I may have changed the code again but at this point I doubt I'll be able to make it work, so fire away. Thanks.
[jQuery] Re: Superfish: Can't make the shadow and animation work
Hi there! Have you fixed your problem? I see your website has shadow and animation now. How did you do it? I've succesfully installed superfish on my joomla site, animation work out of the box The rest is pure css to customise. It's just great! The problem is that i don't get shadows and no arrows either. Instead of arrows i get something like (raquo) Better then nothing since I'm starting to love jquery and this is the best superfish solution imo. Anybody else has any idea of how the CMS could be taking away the arrow and shadow? Thanks! On Nov 22, 4:36 am, conticreative [EMAIL PROTECTED] wrote: I am usingSuperfishvertical in aJoomlasite and while it is working quite well as a vertical menu, the animation and the drop shadow just don;t work.I have tried just about anything and I have used the initialization from several examples without anything ever changing. I modified the CSS quite a bit (could that be it?) but I left the JS intact. I did have to remap a few things to adapt it to theJoomla menu system, but the mapping of the images is correct (I map it absolute while in development so I can work with it in the dev toolbar). Beside the shadow, the menu animation just doesn't work and I have used the same code and initialization as in the examples. The URL of the staging site is here:http://www.lmag.us/staging15/ in case anyone is kind enough to take a look. By the time you look at it I may have changed the code again but at this point I doubt I'll be able to make it work, so fire away. Thanks.
[jQuery] [tooltip] - Bug or something
Hello! I have recently tried to install the tooltip and got it to work just fine. Now to the issue: I have a website that has some small Ajax injections into it. The tool tip should appear on each element of an Ajax injected list. The Ajax injection used is $('.list').load(/ajax-list.php); The problem is that if I apply the tooltip on an onpage HTML element, it works fine but when I'm trying to have the tooltip on that Ajax list, it won't appear... actually the title appears as a default browser title of a HTML element. In the tooltip I added an image that has a class, a link, some spans and so on. And again: they work fine when they are manually written on the page but when the dynamic list is filled with items, it just breaks.. and no errors to. Any idea about this issue? What am I doing wrong? How can it be fixed? Best regards, Dani
[jQuery] Re: How can I make a td clickable?
Hi, If .menuitem is a class you use to contain each link, and .menu is the class that exactly defines a link, you could use: $('.menuitem').click(function(){ // the whole menu item can be clicked $('a.menu', this).click(); // simulate a click on the link, which should make the browser load the link's URL }); Cheers. On Dec 7, 5:10 pm, Costaud [EMAIL PROTECTED] wrote: 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] jQuery Plugin -- DOMisBetter
Hi All, DOM is Better is an useful free library to build client-side web design: http://riagallery.appspot.com/static/DOMisBetter/index.html This is the last web site made with jQuery and DOMisBetter: http://riagallery.appspot.com/KillIEbrowser Bye -- Davide
[jQuery] Traverse XML string
Hi, I want to read the values from a simple xml string but can't get it to work. Here's the code: var xml = foodburgercheese/burger/food; // example 1 var result = $(xml).find(food).find(burger).text(); // example 2 $(food, xml).each(function(i) { result = $(this).find(burger).text(); }); in both examples result is empty. I tested that jquery is working by setting the body backgroud color. Regards, FatSlags2004
[jQuery] Re: if ($(#field).val() == '') or something more elegant?
On Sat, Dec 6, 2008 at 5:26 PM, Yuvraj Mathur [EMAIL PROTECTED] wrote: Not sure but should be like this: if($(#'text').val('')); Actually, this would *set* the value to '' and would always evaluate to true, because it returns the jQuery object for chaining (if you don't supply an arg to .val() it will return the value, if you supply an arg it's a setter and will return the chain). See http://docs.jquery.com/Attributes/val - Richard
[jQuery] Re: Traverse XML string
var xml = foodburgercheese/burger/food; var result = $(xml).find(food).find(burger).text(); The root node for your xml is food, so when you try to find a nested food node in that it fails. Try $(xml).find(burger).text();
[jQuery] Re: - Bug or something
Dani, I believe you'll have to rebind tooltips after you load the ajax $('.list').load( { url: /ajax-list.php), callback: function(responseText, textStatus, XMLHttpRequest) { // rebind tooltips } }); Andrew On Dec 7, 7:58 am, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: Hello! I have recently tried to install the tooltip and got it to work just fine. Now to the issue: I have a website that has some small Ajax injections into it. The tool tip should appear on each element of an Ajax injected list. The Ajax injection used is $('.list').load(/ajax-list.php); The problem is that if I apply the tooltip on an onpage HTML element, it works fine but when I'm trying to have the tooltip on that Ajax list, it won't appear... actually the title appears as a default browser title of a HTML element. In the tooltip I added an image that has a class, a link, some spans and so on. And again: they work fine when they are manually written on the page but when the dynamic list is filled with items, it just breaks.. and no errors to. Any idea about this issue? What am I doing wrong? How can it be fixed? Best regards, Dani
[jQuery] Re: - Bug or something
Sorry, the previous code was incorrect. The ) after the url needs to be removed $('.list').load( { url: /ajax-list.php, callback: function(responseText, textStatus, XMLHttpRequest) { // rebind tooltips } }); On Dec 7, 12:24 pm, aschmid [EMAIL PROTECTED] wrote: Dani, I believe you'll have to rebind tooltips after you load the ajax $('.list').load( { url: /ajax-list.php), callback: function(responseText, textStatus, XMLHttpRequest) { // rebind tooltips } }); Andrew On Dec 7, 7:58 am, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: Hello! I have recently tried to install the tooltip and got it to work just fine. Now to the issue: I have a website that has some small Ajax injections into it. The tool tip should appear on each element of an Ajax injected list. The Ajax injection used is $('.list').load(/ajax-list.php); The problem is that if I apply the tooltip on an onpage HTML element, it works fine but when I'm trying to have the tooltip on that Ajax list, it won't appear... actually the title appears as a default browser title of a HTML element. In the tooltip I added an image that has a class, a link, some spans and so on. And again: they work fine when they are manually written on the page but when the dynamic list is filled with items, it just breaks.. and no errors to. Any idea about this issue? What am I doing wrong? How can it be fixed? Best regards, Dani
[jQuery] Re: SlideShow based on SQL Server
Paolo, I personally use the cycle plugin for slideshows, and it's worked nicely so far. If you don't want to use a server side repeater to build your list of images and would prefer to do it client side, I would use a technique like the one in this article http://encosia.com/2008/06/26/use-jquery-and-aspnet-ajax-to-build-a-client-side-repeater/ Andrew On Dec 7, 9:32 am, PaoloTCS [EMAIL PROTECTED] wrote: I am brand new to JQuery, but very excited over it. I have looked at s3Slider and similar packeges, but they all seem to get their images statically, either by referencing a folder or by just referring to them (1.jpg, 2.jpg, ). I have a database with image paths (images/woof1.jpg), for example. How do I use JQuery with an asp.net technology, like Linq, or even a Web Service to be able to feed a slideshow, or anything similar? Thanks to all, Paolo
[jQuery] Simulate Link being clicked...
First off, I'm not sure this is even possible, but I thought I'd ask... Is it possible to use jQuery (or just plain JavaScript) to simulate a link click? Can something like this be done? // Script function doSomething() { // executes some code } $(document).ready(function() { $(#MyLink) // Some code that causes Link 1 to execute as if it was clicked when Link 2 is clicked } // Markup a href=# onclick=doSomething /Link 1/a // Link 1 a href=# id=MyLink /Link 2/a // Link 2 Also, I don't want Link 2 to call the function directly; I want it to cause Link 1 to be clicked. I've been trying to figure this out for a long time, and I'm pretty stumped.
[jQuery] Re: Need help modifying this jQuery...
Rick, You could try the form plugin as below form id=myForm action=request_processor.cfm method=post Email: input type=text name=email_address / Password: input type=password name=password / input type=submit value=Login / /form script type=text/javascript src=path/to/jquery.js/script script type=text/javascript src=path/to/form.js/script script type=text/javascript $(document).ready(function() { // bind 'myForm' and provide a simple callback function $('#myForm').ajaxForm( { dataType: 'json', success: function(data) { $('#contentdiv').empty().fadeIn(1000).append (data.login_message); } }); }); /script Andrew On Dec 7, 7:31 am, Rick Faircloth [EMAIL PROTECTED] wrote: I'm trying to put my first Ajax to use by creating a login form. To get there, I'm attempting to modify the first tutorial I've found which I understand enough to understand what it's doing and how it's working with a ColdFusion backend. Anyway, my first question is: How do I modify the code below to send an email address (form.email_address) and password (form.password) to the url: request_processor.cfm? The code below was just for a form with a select which, when the value changed, would cause an item in a db to be read and appear. I'm modifying it for email_address and password fields, with a submit button. $(document).ready(function(){ $('#contentdiv').html('nbsp;'); $('#idm').change(function(){ var formval = {idm:$(this).val()}; $.ajax({ type: POST, url: request_processor.cfm, dataType: json, data: formval, success: function(response){ $('#contentdiv').empty().fadeIn(1000).append(response.main_dish); } }); }); }); So, I'd have: $(document).ready(function(){ $('#contentdiv').html('nbsp;'); $('#login-button').click(function(){ var formval = {email address, password:$(this).val()}; --- (???) $.ajax({ type:post, url:request_processor.cfm, dataType:json, data:formval success:function(response){ $('#contentdiv').empty().fadeIn(1000).append(response.login_message); } }); }); }); What changes need to be made? Thanks for any help! Rick
[jQuery] Re: MIT or GPL License
Thanks Karl! On Nov 25, 6:53 pm, Karl Swedberg [EMAIL PROTECTED] wrote: Yes, you can use one or the other. --Karl Karl Swedbergwww.englishrules.comwww.learningjquery.com On Nov 25, 2008, at 9:13 AM, Jason Coudriet wrote: Hello, When using jQuery, do have we have the option to use just the MIT license? Thanks, Jason
[jQuery] Horizontal menu with slide down and hover bug with firefox
Hello, I've been looking for a way to make my horizontal menu work with firefox using jquery slideDown and Up animations instead of fadeout . The problem is that with firefox if you move the mouse out of the sub menu area and then in again before the animation had finished the sub menu starts sliding up and down untill you move the mouse away again. Here is how I've done my menu : HTML : div id=menu dl dtItem 1/dt dd ul liItem 1.1/li liItem 1.2/li liItem 1.3/li liItem 1.4/li /ul /dd /dl dl dtItem 2/dt dd ul liItem 2.1/li liItem 2.2/li liItem 2.3/li liItem 2.4/li /ul /dd /dl /div CSS : #menu dd { display: none; } Javascript : function mnutoggle(){ $('#menu dl').each(function(){ var menu = $(this); menu.hover(function(){$(' dd',this).slideDown('fast') } , function(){$(' dd',this).slideUp('fast') }); }); } $(document).ready(function(){ mnutoggle(); }); To try and stop this problem I decided to try and delay the slidedown unless slideup has finished and stop the slideup unless the slide down has finished. In order to do this I introduced a variable which says if the animation has finished or not, this works in the sense that if you hover quickly over an element it continues to finish the animation but for some reason still has the same bug with firefox, here's the code (I used the following code to do the delay of 300 ms : animate({opacity: 1.0}, 300) Here is the full code : function mnutoggle(){ $('#menu dl').each(function(){ var state = 'up'; var menu = $(this); menu.hover(function(){ if(state == 'up') { $(' dd',this).slideDown(300, function(){ state = 'down' }) } else { $(' dd',this).animate({opacity: 1.0}, 300).slideDown(300, function(){state = 'down';}); } } , function(){ if(state == 'down') { $(' dd',this).slideUp(300, function(){state = 'up';}) } else { $(' dd',this).animate({opacity: 1.0}, 300).slideUp(300, function(){state = 'up';}); } }); }); } $(document).ready(function(){ mnutoggle(); }); This code makes the menu go right up and right down each time but firefox seems to store the next thing to do and when you bring the mouse over the sub menu before the animation has finished it goes up and then down and then up continues untill you move the mouse away. Is there a way to get around this problem ? FadeIn and out does not have this problem but I prefer the slidedown and up animation ... Thanks in advance for any suggestions ...
[jQuery] Re: Simulate Link being clicked...
Just bind doSomething() to the click event for the second link. This looks like a usability nightmare, but whatever ... On Sun, Dec 7, 2008 at 12:42 PM, SLR [EMAIL PROTECTED] wrote: First off, I'm not sure this is even possible, but I thought I'd ask... Is it possible to use jQuery (or just plain JavaScript) to simulate a link click? Can something like this be done? // Script function doSomething() { // executes some code } $(document).ready(function() { $(#MyLink) // Some code that causes Link 1 to execute as if it was clicked when Link 2 is clicked } // Markup a href=# onclick=doSomething /Link 1/a // Link 1 a href=# id=MyLink /Link 2/a // Link 2 Also, I don't want Link 2 to call the function directly; I want it to cause Link 1 to be clicked. I've been trying to figure this out for a long time, and I'm pretty stumped.
[jQuery] Re: Traverse XML string
I tried that but still get an empty result. I seached google and saw examples like yours all over the place so maybe it's something else. here's the full source: html head title/title script type=text/javascript language=javascript src=jquery-1.2.6.min.js/script script type=text/javascript language=javascript $(document).ready(function() { $(body).css(background-color, yellow); var xml = foodburgercheese/burger/food; var result = $(xml).find(burger).text(); alert(result); }); /script /head /html On Dec 7, 5:44 pm, Dave Methvin [EMAIL PROTECTED] wrote: var xml = foodburgercheese/burger/food; var result = $(xml).find(food).find(burger).text(); The root node for your xml is food, so when you try to find a nested food node in that it fails. Try $(xml).find(burger).text();
[jQuery] Dynamic Stylesheets
How do you dynamically add or remove stylesheets to a page? I've seen a lot of examples on how to add css styles or classes to an elment, but I haven't found anything on adding/removing entire stylesheets...
[jQuery] Re: jQuery Plugin -- DOMisBetter
I despise having to deal with IE as much as the next (reasonable) person but posting a link to a page that forces some users to kill their browser process is pretty juvenile. Sure, it's right there in the URL, but still ... The plugin seems alright, though I can't think of a compelling reason to build entire websites like that. On Sun, Dec 7, 2008 at 9:34 AM, KillIEbrowser [EMAIL PROTECTED] wrote: Hi All, DOM is Better is an useful free library to build client-side web design: http://riagallery.appspot.com/static/DOMisBetter/index.html This is the last web site made with jQuery and DOMisBetter: http://riagallery.appspot.com/KillIEbrowser Bye -- Davide
[jQuery] Re: Simulate Link being clicked...
Just bind doSomething() to the click event for the second link. Can you expand on this? I apologize, I'm somewhat new to jQuery. This looks like a usability nightmare, but whatever ... Looking at my example, I can see why you say this. Let me try to explain what I'm trying to do. I have a list of thumbnails images that open in ShadowBox. Something like this: // CSS #thumbnails { list-style-type: none; } #thumbnails li { float: left; margin-right: 5 px; height: 200px; background: #33; border: 1px solid #00; } #thumbnails li img { display: block; } ul id=thumbnails lia href=image1 rel=shadowbox[gallery] /img src=thumb1.jpg title=thumb1 alt=thumb1 /Thumbnail 1/a/li lia href=image1 rel=shadowbox[gallery] /img src=thumb1.jpg title=thumb1 alt=thumb1 /Thumbnail 2/a/li lia href=image1 rel=shadowbox[gallery] /img src=thumb1.jpg title=thumb1 alt=thumb1 /Thumbnail 3/a/li /ul Now the parent li tags for each thumbnail have a set height (say 200px) but not all the thumbnail images are that large. With that being said, what ends up happening is that I have extra space left over in the li element. What I want to do is make the li element itself clickable and acts as if the nested link was clicked. This way, clicking on the extra space acts the same as clicking the link itself.
[jQuery] Setting source of a frame with jQuery
Hi, I have two html pages that are consisting of frames. They are using shared jQuery code, and I used the anchor click events to load pages into frames (as target attibutes fails to work when jQuery is present). I used the click event of two anchor classes two create the same funcionality and while the event of the first class works correctly, the second just fails during execution. Here are the jQuery codes (custom.js) - other jQuery is of jTree code: $(document).ready(function() { $(a.contentLink).click( function() { top.$(#content_frame).attr(src,$(this).attr(href)); //works correctly in the first document alert(success); //I get the message return false; }); $(a.collectionLink).click( function() { top.$(#content_frame).attr(src,$(this).attr(href)); // fails in the second document //top.$(#doc_toc_frame).attr(src,$(this).attr(name)); alert(success); //never executed return false; }); });//doc ready The pages are these: (first one works) !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Frameset//EN http://www.w3.org/TR/html4/frameset.dtd; HTML HEAD TITLEDoc/TITLE meta http-equiv='Content-type' content='text/html' charset='utf-8' / link rel='stylesheet' type='text/css' href='../../Style/CSS/ styles.css' / link rel='stylesheet' type='text/css' href='../../Style/CSS/ jquery_style.css' / link rel='stylesheet' type='text/css' href='../../Style/CSS/ tree_component.css' / script type='text/javascript' src='../../Style/Script/_all.js'/ script script type='text/javascript' src='../../Style/Script/ tree_component.js'/script script type='text/javascript' src='../../Style/Script/bubble.js'/ script script type='text/javascript' src='../../Style/Script/custom.js'/ script /HEAD FRAMESET cols=20%, 80% id=main_frame name=main_frame FRAMESET cols=100% id=toc_frame name=toc_frame FRAME src=toc.html/ /FRAMESET FRAME src=content.html name=content_frame id=content_frame/ NOFRAMES PFrame error/P /NOFRAMES /FRAMESET /HTML Second page (doesn't work): !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Frameset//EN http://www.w3.org/TR/html4/frameset.dtd; HTML HEAD TITLEDoc coll./TITLE meta http-equiv='Content-type' content='text/html' charset='utf-8' / link rel='stylesheet' type='text/css' href='../../Style/CSS/ styles.css' / link rel='stylesheet' type='text/css' href='../../Style/CSS/ jquery_style.css' / link rel='stylesheet' type='text/css' href='../../Style/CSS/ tree_component.css' / script type='text/javascript' src='../../Style/Script/_all.js'/ script script type='text/javascript' src='../../Style/Script/ tree_component.js'/script script type='text/javascript' src='../../Style/Script/bubble.js'/ script script type='text/javascript' src='../../Style/Script/custom.js'/ script /HEAD FRAMESET cols=20%, 80% id=main_frame name=main_frame FRAMESET rows=50%,50% id=toc_frame name=toc_frame FRAME src=coll_toc.html/ FRAME src= name=doc_toc_frame id=doc_toc_frame/ /FRAMESET FRAME src= name=content_frame id=content_frame/ NOFRAMES PFrame error/P /NOFRAMES /FRAMESET /HTML I am not smart enough to see where the tiny difference is, please, give me hints. I hope someone sees the mistake at firs glance. I think that is why I never use Jscript, the page is loaded, no error message, simply doesn't work...
[jQuery] Re: Simulate Link being clicked...
No need for scripting: #thumbnails li a { display: block; height: 200px; } On Sun, Dec 7, 2008 at 1:35 PM, SLR [EMAIL PROTECTED] wrote: Just bind doSomething() to the click event for the second link. Can you expand on this? I apologize, I'm somewhat new to jQuery. This looks like a usability nightmare, but whatever ... Looking at my example, I can see why you say this. Let me try to explain what I'm trying to do. I have a list of thumbnails images that open in ShadowBox. Something like this: // CSS #thumbnails { list-style-type: none; } #thumbnails li { float: left; margin-right: 5 px; height: 200px; background: #33; border: 1px solid #00; } #thumbnails li img { display: block; } ul id=thumbnails lia href=image1 rel=shadowbox[gallery] /img src=thumb1.jpg title=thumb1 alt=thumb1 /Thumbnail 1/a/li lia href=image1 rel=shadowbox[gallery] /img src=thumb1.jpg title=thumb1 alt=thumb1 /Thumbnail 2/a/li lia href=image1 rel=shadowbox[gallery] /img src=thumb1.jpg title=thumb1 alt=thumb1 /Thumbnail 3/a/li /ul Now the parent li tags for each thumbnail have a set height (say 200px) but not all the thumbnail images are that large. With that being said, what ends up happening is that I have extra space left over in the li element. What I want to do is make the li element itself clickable and acts as if the nested link was clicked. This way, clicking on the extra space acts the same as clicking the link itself.
[jQuery] Re: Traverse XML string
Your example works for me. Use firebug and make sure you are not getting errors from some other problem.
[jQuery] Re: Click event broken by AJAX - explain please?
Hmmm, yes it does. I just did 'un-do' a zillion times, back to where I was at the outset. Seems I had begun with $('textarea').load() Intending to load the textarea with data but it didn't work (FCKeditor assigned to the textarea). I changed that to $('textarea').get(url, {file: data}, function()) This is where I started screwing up. When I went with the setTimeout, I then wrote the $.get() correctly so it worked. Backtracking and doing the $.get() right and it works correctly without the setTimeout (). Long story short - operator error. thanks, Don On Dec 6, 8: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: Simulate Link being clicked...
Try this: $(#MyLink).click(function(){ $(#Link1).click(); return false; }); You'll need to add the id to the first link. Is there a reason why you used an onclick attribute in html rather than attaching the handler using jQuery?
[jQuery] Re: Dynamic Stylesheets
Have a look here: http://www.alistapart.com/articles/alternate/ On Sun, Dec 7, 2008 at 1:17 PM, SLR [EMAIL PROTECTED] wrote: How do you dynamically add or remove stylesheets to a page? I've seen a lot of examples on how to add css styles or classes to an elment, but I haven't found anything on adding/removing entire stylesheets...
[jQuery] Re: Dynamic Stylesheets
Check here: http://letmegooglethatforyou.com/?q=add+stylesheet+jquery
[jQuery] Re: Setting source of a frame with jQuery
top.$(#content_frame).attr(src,$(this).attr(href)); // fails in the second document //top.$(#doc_toc_frame).attr(src,$(this).attr(name)); alert(success); //never executed Is the toc frame in the same domain as this document and the content frame? Maybe you're running afoul of a cross-domain problem. Are there messages from Firebug?
[jQuery] Re: addClass with attrs
addClass is exactly what it says, it adds a class. Predefine the class in your CSS pages with the attributes you require and use the addClass function to add it to your target..addClass('newclass'); You can also use removeClass to remove the class .removeClass('newclass'); If you want to define the CSS in the Jscript, then use the .css function using an array of styles .css({'background-color':'red', 'color':'white'}); I find that it is easier to keep track of the CSS if you keep it in the CSS pages, just make a comment in the file so you know what the class is for. On Dec 6, 5:50 pm, 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: Simulate Link being clicked...
No need for scripting: #thumbnails li a { display: block; height: 200px; } I think you are missing what I'm trying to do... $(#MyLink).click(function(){ $(#Link1).click(); return false; }); You'll need to add the id to the first link. Yeah, thats essentially what I want to do. Now how can I do that to all the li elements without having to manually type that it for each one? Is there a reason why you used an onclick attribute in html rather than attaching the handler using jQuery? No reason at all, once again I just type that in here for simplicity's sake...
[jQuery] Re: Setting source of a frame with jQuery
What do you mean by same domain? They are on the same drive, the collection index file is on directory upper to the content and the content's toc file. I tried FB, but I didn't get any message from it (I am not sure I used it properly). On dec. 7, 20:17, Dave Methvin [EMAIL PROTECTED] wrote: top.$(#content_frame).attr(src,$(this).attr(href)); // fails in the second document //top.$(#doc_toc_frame).attr(src,$(this).attr(name)); alert(success); //never executed Is the toc frame in the same domain as this document and the content frame? Maybe you're running afoul of a cross-domain problem. Are there messages from Firebug?
[jQuery] Cycle.js issues
Hello I am trying to get cycle.js to work, and I have no idea why it isn't. Here is my code: script src=scripts/jquery.js type=text/javascript/script script src=scripts/cycle.js type=text/javascript/script script type='text/javascript' $(document).ready(function(){ $('#s1').cycle('fade'); }); /script And you can view the test site live here: http://hbeckett.com/presentation/ A solution would be greatly appreciated. Thanks
[jQuery] ClueTip Custom Close Button
I am using a div content present in the same document to show up in cluetip. I want to use a custom button inside that div content to close the tip when clicked. I don't know how this can be achieved. Please guide me through this. This may be very trivial, I am not sure how to get this done. By the way, Cluetip rocks. Many thanks.
[jQuery] Cycle.js not behaving... Can't get it to work no matter what
Hello I am trying to get cycle.js to work, and I have no idea why it isn't. Here is my code: script src=scripts/jquery.js type=text/javascript/script script src=scripts/cycle.js type=text/javascript/script script type='text/javascript' $(document).ready(function(){ $('#s1').cycle('fade'); }); /script And you can view the test site live here: http://hbeckett.com/presentation/ A solution would be greatly appreciated. Thanks
[jQuery] Re: Traverse XML string
Hi Dave, I thought jquery is browser-independent but it seems the code works for firefox but not for IE, any idea why? On Dec 7, 8:00 pm, Dave Methvin [EMAIL PROTECTED] wrote: Your example works for me. Use firebug and make sure you are not getting errors from some other problem.
[jQuery] Re: Separate Functions for Events
Thanks Michael, the example you gave works great. I'm having some problems with a droppable though, here is the sample code: $(#dropper).droppable({ accept: #dragger, drop: function(ev, ui) {$(this).append(brDropped!);} }); The function that is called on the drop is likely to get very complex, so I'd like it in a separate function. However, my solution below doesn't work: $(#dropper).droppable({ accept: #dragger, drop: dropped() }); function dropped() { $(this).append(dropped!) } The dropped function is getting called as if I change it to: function dropped() { alert(dropped!) } The alert message does show. So I think that there must be a problem with it accessing $(this). Any ideas how I can get this to work? documentation for droppables can be found here: http://docs.jquery.com/UI/Droppable Thanks, DAZ On Dec 6, 11:08 pm, Michael Geary [EMAIL PROTECTED] wrote: 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: Simulate Link being clicked...
On Sun, Dec 7, 2008 at 2:40 PM, SLR [EMAIL PROTECTED] wrote: No need for scripting: #thumbnails li a { display: block; height: 200px; } I think you are missing what I'm trying to do... No offense meant, but I think you've misunderstood the CSS I posted. As I understand it, you want the entire LI to be clickable. The CSS rule I posted will do just that by causing the A to fill the LI. If the width is also an issue, then set that, as well. There's no need for the JQuery hammer here.
[jQuery] Re: Simulate Link being clicked...
Yeah, thats essentially what I want to do. Now how can I do that to all the li elements without having to manually type that it for each one? Well, now that you posted the real html... :-) $(#thumbnails li).click(function(){ $(this).find(a).click(); return false; }); If the a element is clickable you may want to attach a handler that prevents the bubbling to the parent li element. Otherwise it will bubble up and do a second click.
[jQuery] Re: Setting source of a frame with jQuery
What do you mean by same domain? Google for iframe crossdomain. Basically you can't have a page on one domain (e.g., yourdomain.com) manipulate objects or run script from a frame in another domain They are on the same drive, the collection index file is on directory upper to the content and the content's toc file. Do you mean that you are loading the pages directly from disk rather than from a web server? Can you post a simple test page?
[jQuery] Re: Traverse XML string
Yeah, I see what you mean about IE now. The problem seems to be that IE can't tell whether the string is HTML or XML, and jQuery doesn't have a way to tell either. Mike Geary posted a parser that works for both that you can use to parse the string and pass that tree into jQuery. http://groups.google.com/group/jquery-en/browse_frm/thread/95718c9aab2c7483/af37adcb54b816c3?lnk=gstq=parsexml#af37adcb54b816c3
[jQuery] Re: Simulate Link being clicked...
No offense meant, but I think you've misunderstood the CSS I posted. As I understand it, you want the entire LI to be clickable. The CSS rule I posted will do just that by causing the A to fill the LI. If the width is also an issue, then set that, as well. There's no need for the JQuery hammer here. On second glance, I see what you are trying to do, and it makes perfect sense. Having the a tag fill the height of the li tag would be the easiest and most effecient way. Thanks for the info... again = ) Well, now that you posted the real html... :-) $(#thumbnails li).click(function(){ $(this).find(a).click(); return false; }); If the a element is clickable you may want to attach a handler that prevents the bubbling to the parent li element. Otherwise it will bubble up and do a second click. I didn't think about the bubbling issue. Nevertheless, thank you for your input.
[jQuery] Re: Setting source of a frame with jQuery
These pages are only for presenting data, and used as local files. I share the project's output html here: http://datastore.uw.hu/docs.zip You can see that index.html doesn't work, while doc_index.html works just fine. On dec. 7, 21:41, Dave Methvin [EMAIL PROTECTED] wrote: What do you mean by same domain? Google for iframe crossdomain. Basically you can't have a page on one domain (e.g., yourdomain.com) manipulate objects or run script from a frame in another domain They are on the same drive, the collection index file is on directory upper to the content and the content's toc file. Do you mean that you are loading the pages directly from disk rather than from a web server? Can you post a simple test page?
[jQuery] [tooltip] Strange behavior of tooltip plugin in IE7
-- Forwarded message -- From: Miquel [EMAIL PROTECTED] Date: 2008/12/1 Subject: Strange behavior of [tooltip] plugin in IE7 To: jQuery (English) jquery-en@googlegroups.com Hi all, May be some can help on this problem. When the tooltip plugin [http:// plugins.jquery.com/project/tooltip] is applied to an absolutely positioned box nested into a larger absolutely positioned box, all boxes flicker when the mouse is hovering and if the tooltip eventually displays is only because the boxes disappear. Playing with the overflow property makes to have different behavior such as just the background box to disappear and the inner box remain visible, but still providing a quite strange effect. I prepared a simple test page to show this problem, it will run ok in Firefox (at least version 3.04 in Linux) but will fail in Internet Explorer 7 in windows XP. You can find the test page at http://hitconsultants.com/Tooltips_failure/boxing_model.html Kind regards Miquel PS: I am resending this because I placed the wrong subject, apologies for duplication.
[jQuery] New to jquery. How to get the following component??
Hello, I am interested in the following component (as seen on the following page): http://ui.jquery.com/demos It must be some sort of flow component. Can anyone tell me where to get it from? Where it is documented? Best regards, Julien.
[jQuery] Re: Separate Functions for Events
On Sun, Dec 7, 2008 at 3:22 PM, DAZ [EMAIL PROTECTED] wrote: The function that is called on the drop is likely to get very complex, so I'd like it in a separate function. However, my solution below doesn't work: $(#dropper).droppable({ accept: #dragger, drop: dropped() }); change drop: dropped() to drop: dropped With the parens its executed as it's parsed and the return value is passed as the value of drop, where you want to pass the name of the function so it can be called by the plugin at the appropriate time, as many times as needed. - Richard
[jQuery] Re: New to jquery. How to get the following component??
See http://groups.google.com/group/jquery-ui/browse_thread/thread/b57bf99f2abf6079 Paul Bakaus writes: I programmed it from scratch just for the UI website, but since developing plugins for UI is so simple, it's a UI plugin ;) However, since there's quite some interest in it, expect it to be released quite soon. For now, please grab it directly from the page. - Richard On Sun, Dec 7, 2008 at 3:55 PM, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: Hello, I am interested in the following component (as seen on the following page): http://ui.jquery.com/demos It must be some sort of flow component. Can anyone tell me where to get it from? Where it is documented? Best regards, Julien.
[jQuery] Re: Hot to remove or replace onclick function
let me explain more clear if I want to cancel function in JavaScript, I can do something like this, but how to do the same thing in jQuery? input type=button name=btn id=btn value=btn / input type=button name=setBtn id=setBtn value=setBtn / input type=button name=cancel id=cancel value=cancel / script language=javascript !-- var btn = document.getElementById('btn'); var set = document.getElementById('setBtn'); var cancel = document.getElementById('cancel'); function test() { console.log('test'); } window.onload = function() { set.onclick = function() { btn.onclick = function() { test(); } } cancel.onclick = function() { btn.onclick = null; } } //-- /script On Dec 7, 9:50 am, David .Wu [EMAIL PROTECTED] wrote: 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: Need help modifying this jQuery...
Hi, Andrew, and thanks for the code. I've been *partially* successful and I don't quite understand why things are happening the way they are...it could be some of the ColdFusion code involved. When I run the login.cfm page with the myForm form, I end up with my message being displayed for a successful login, but it's in this format, {login:Login Successful} which I think is the Json translation of the data... Also, the message is displayed on the login_processor.cfm page, instead of the page with the form, login.cfm, which is where the message should end up in plain text. Here are the files involved: - login.cfm - login_processor.cfm - manager_data.cfc - cfjson.cfc (running the code your way probably makes this unecessary, at the very least, since, I assume, form.js is handling the Json translation...?) Here's what each of these files looks like: login.cfm ___ !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; html xmlns=http://www.w3.org/1999/xhtml; cfsetting showdebugoutput=no head script type=text/javascript src=jquery.js/script script type=text/javascript src=jquery.form.js/script script type=text/javascript $(document).ready(function() { //bind 'myForm' and provide a simple callback function $('#myForm').ajaxForm( { dataType: 'json', success: function(data) { $('#contentdiv').empty().fadeIn(1000).append(data.login_message); } }); }); /script style type=text/css body { font-family: Arial, Helvetica, sans-serif; } #databox { border: 1px solid Gray; margin:30px auto 0px auto; padding: 10px; width: 200px;} #contentdiv { color:red; font-size: 30px; margin-top: 10px;} /style /head body form id=myForm action=login_processor.cfm method=post Email: input type=text name=email_address / Password: input type=password name=password / input type=submit value=Login / /form p id=contentdiv /p /body /html login_processor.cfm _ cfsetting showdebugoutput=no cfset mdata = createObject(component,manager_data) cfset thedata = mdata.getmanagerData(form.email_address, form.password) cfset ojson = createObject(component,cfjson) cfset results = ojson.encode(thedata) cfoutput#results#/cfoutput manager_data.cfc ___ cfcomponent displayname=manager_data hint=Contains manager database query output=false cffunction name = getmanagerData cfargument name = email_address type=string required=yes cfargument name = passwordtype=string required=yes cfquery name=get_manager datasource=login selectemail_address, password fromsite_managers whereemail_address = '#arguments.email_address#' andpassword = '#arguments.password#' /cfquery cfset managerStruct = structNew() cfif get_manager.recordcount gt 0 cfset managerStruct.login = Login Successful cfelse cfset managerStruct.login = Login Unsuccessful /cfif cfreturn managerStruct /cffunction /cfcomponent And then there's cfjson.cfc, the content of which I won't post unless you really need to see it because there's a lot of code... Is there some adjustment that's needed in my processing code/files since I'm using the different jQuery code that you provided? Any more help is appreciated! Rick aschmid wrote: Rick, You could try the form plugin as below form id=myForm action=request_processor.cfm method=post Email: input type=text name=email_address / Password: input type=password name=password / input type=submit value=Login / /form script type=text/javascript src=path/to/jquery.js/script script type=text/javascript src=path/to/form.js/script script type=text/javascript $(document).ready(function() { // bind 'myForm' and provide a simple callback function $('#myForm').ajaxForm( { dataType: 'json', success: function(data) { $('#contentdiv').empty().fadeIn(1000).append (data.login_message); } }); }); /script Andrew On Dec 7, 7:31 am, Rick Faircloth [EMAIL PROTECTED] wrote: I'm trying to put my first Ajax to use by creating a login form. To get there, I'm attempting to modify the first tutorial I've found which I understand enough to understand
[jQuery] Re: Separate Functions for Events
From: DAZ Thanks Michael, the example you gave works great. I'm having some problems with a droppable though, here is the sample code: $(#dropper).droppable({ accept: #dragger, drop: function(ev, ui) {$(this).append(brDropped!);} }); The function that is called on the drop is likely to get very complex, so I'd like it in a separate function. However, my solution below doesn't work: $(#dropper).droppable({ accept: #dragger, drop: dropped() }); function dropped() { $(this).append(dropped!) } That isn't the same as your original code. Here's the problem: drop: dropped() That *calls* the dropped function immediately - not when the drag and drop occurs, but when you call the .droppable() method initially. Instad, you want to pass a *reference* to the dropped function, by omitting the (): drop: dropped By just giving the function name with no parens, you obtain a reference to the function instead of calling it immediately. The dropped function is getting called as if I change it to: function dropped() { alert(dropped!) } The alert message does show. Ah, but when does the alert show? If the code you listed is your actual code, the alert shows up too soon, doesn't it? So I think that there must be a problem with it accessing $(this). That is something you have to watch out for, but it's not the problem in this particular case (pun unintended but unavoidable). When you change an anonymous function to a named function that you call through a reference to the function, 'this' works the same as before. So if your anonymous function worked, then changing it to a reference to a named function will work as intended - as long as you don't call the function prematurely by appending () to the function name. -Mike
[jQuery] Re: addClass with attrs
Thank you!!! I know this. But my question was how to create newclass assigning its attrs at the same time. 2008/12/7 QuadCom [EMAIL PROTECTED] addClass is exactly what it says, it adds a class. Predefine the class in your CSS pages with the attributes you require and use the addClass function to add it to your target..addClass('newclass'); You can also use removeClass to remove the class .removeClass('newclass'); If you want to define the CSS in the Jscript, then use the .css function using an array of styles .css({'background-color':'red', 'color':'white'}); I find that it is easier to keep track of the CSS if you keep it in the CSS pages, just make a comment in the file so you know what the class is for. On Dec 6, 5:50 pm, 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: Cycle.js not behaving... Can't get it to work no matter what
remove the 'fade' from the function call. That's the default action, but would be correctly specified as {fx: 'fade'} if you explicitly define it. On Dec 7, 2:42 pm, Heath [EMAIL PROTECTED] wrote: Hello I am trying to get cycle.js to work, and I have no idea why it isn't. Here is my code: script src=scripts/jquery.js type=text/javascript/script script src=scripts/cycle.js type=text/javascript/script script type='text/javascript' $(document).ready(function(){ $('#s1').cycle('fade');}); /script And you can view the test site live here:http://hbeckett.com/presentation/ A solution would be greatly appreciated. Thanks
[jQuery] Re: jQuery Plugin -- DOMisBetter
Useful in what way? I'm not going to the site, given the other person's experience. An explanation of the plugin here would be very useful. On Dec 7, 9:34 am, KillIEbrowser [EMAIL PROTECTED] wrote: Hi All, DOM is Better is an useful free library to build client-side web design:http://riagallery.appspot.com/static/DOMisBetter/index.html This is the last web site made with jQuery and DOMisBetter:http://riagallery.appspot.com/KillIEbrowser Bye -- Davide
[jQuery] Jquery Tablesorter not working
Hi All, I have been trying to use the table sorter but not sure why this error pops up : jQuery(#myTable).tablesorter is not a function script type=text/javascript src=/scripts/jquery-1.2.6.pack.js/ script type=text/javascript src=/scripts/jquery.tablesorter.js/ script language=javascript !-- var $j = jQuery.noConflict(); jQuery(document).ready(function() { //alert('Hi'); jQuery(#myTable).tablesorter(); } ); --
[jQuery] jquery.min.js is 54kb, not 15kb?
The front page of jquery.com says the production version is 15kb, but when I go to the download link, it shows up as 54kb. Is there something special that I need to do to convert that 54kb file into 15kb file?
[jQuery] Re: jquery.min.js is 54kb, not 15kb?
You need to enable gzip-ing to your web application (which is something that greatly varies on how to do based on what you use on the server side) On Dec 7, 6:54 pm, Matt Wilson [EMAIL PROTECTED] wrote: The front page of jquery.com says the production version is 15kb, but when I go to the download link, it shows up as 54kb. Is there something special that I need to do to convert that 54kb file into 15kb file?
[jQuery] Re: jquery.min.js is 54kb, not 15kb?
- Richard On Sun, Dec 7, 2008 at 6:54 PM, Matt Wilson [EMAIL PROTECTED] wrote: The front page of jquery.com says the production version is 15kb, but when I go to the download link, it shows up as 54kb. By the time you have the file saved your browser has unzipped it to it's full 54kb, but while it was being transmitted, it was only 15kb. Here are some related threads: http://groups.google.com/group/jquery-en/browse_thread/thread/563ebd5a961d401 http://groups.google.com/group/jquery-en/browse_thread/thread/3a5d4093f0c74a4a http://groups.google.com/group/jquery-en/browse_thread/thread/790dc1745f0816f8 Is there something special that I need to do to convert that 54kb file into 15kb file? You need to configure your web server/host to gzip the file when it's requested. Modern browsers will tell the server that they support that compression and things will work. If a client doesn't support gzip compression, the server will serve it not gzipped, but this would be a very very small percentage of cases. - Richard
[jQuery] Re: Jquery Tablesorter not working
i'd guess your file is not being loaded correctly got a live page to see? On Dec 7, 4:19 pm, Gowrishankar [EMAIL PROTECTED] wrote: Hi All, I have been trying to use the table sorter but not sure why this error pops up : jQuery(#myTable).tablesorter is not a function script type=text/javascript src=/scripts/jquery-1.2.6.pack.js/ script type=text/javascript src=/scripts/jquery.tablesorter.js/ script language=javascript !-- var $j = jQuery.noConflict(); jQuery(document).ready(function() { // alert('Hi'); jQuery(#myTable).tablesorter(); } ); --
[jQuery] Validate does not work in IE7
Hello, I am using JQuery and Validate. It works fine in Firefox 3 but it does not work in IE7. Here is an example: http://www.27lamps.com/Beta/Form/Form.html Am I doing something wrong or is there a bug? Thanks, Miguel
[jQuery] Re: How to animate frameset properties?
Well, I tried, I really tried. I have the following code: function test(isExpanding) { var x=start+%,*; if(isExpanding==1) start++; else start--; top.$(#main_frame).attr(cols,x); alert(x); if(isExpanding==1 start21) setTimeout(test(isExpanding),500); else if(isExpanding==0 start1) setTimeout(test(isExpanding),500); } That code is called like this first time: setTimeout(test(0),500); This code immediately reaches var start=2, no transition, no iterations ( I alerted it, and alert popped up once). I just can't understand the logic that goes behind this. Each call should increase or decrease var start with one then call itself instead it goes...randomly, abnormally. The lack of debugging also bothers me, it had become rough guessing of where the error could be. God, I miss my C# So, can you suggest anything else? On dec. 4, 22:47, Jeffrey Kretz [EMAIL PROTECTED] wrote: I'm going to toss this out there, though you may not want the effort. You could sort of roll your own animation that uses the attribute, rather than the CSS. It would involve a setTimeout, and use the $(el).attr('cols',val); Again, that's a lot of plumbing to tackle, but any attribute that can be set by jQuery.attr can be animated. JK -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of andriscs Sent: Thursday, December 04, 2008 1:35 PM To: jQuery (English) Subject: [jQuery] Re: How to animate frameset properties? I tried it, believe me. :) Yet I had to use frames due to close deadlines as divs that I used were placed abnormally everwhere depending on which browser were presented in. I have to create a navigation side on the left and a content area on the right. The menu should always be visible while the content should be scrollable. The menu should become hidden on click and the splitting between the sides should be adjustable. Tell me, is there div-based jQuery code that accomplishes this? I use jTree for the navigation menu and I tried jSplitter for creating the splitter but I couldn't create an always visible yet scrollable layout :) So I reverted back to frames and it works well in major browsers, I can adjust splitter, I can scroll content, I just lost the possibility of creating a smooth animation ( I animate the disappearing of the navigation menu). If you have better ideas, tell me. On dec. 4, 02:28, ricardobeat [EMAIL PROTECTED] wrote: You can only animate CSS properties, the col width is not one of them. Get rid of the frames and use some clean code :) On Dec 3, 9:40 pm, andriscs [EMAIL PROTECTED] wrote: Hi, I know it's kinda lame, but I should animate the setting of a frameset'scolsproperty. So far I managed to learn that html properties can be animated using anime({prop:”value”},duration) I created for example a font size changer using that code. As I work now with frames, I tried to modify a frameset’s properties: first I used the following code: top.$(#main_frame).attr(cols,0%,*); It worked fine, the leftframedisappeared. I just wanted to make it with animation, so I tried the following: top.$(#main_frame).animate({cols:0%,*},600); but nothing happened. Is it because attribute ’cols’ cannot be animated by jQuery’s inner mechanism? Honestly, I don’t feel much difference between animating width property andcolsproperty. Do you have any idea of how to animate that kind of operation? If not possbile what else solution would you suggest me to hide a left sided navigation menu that resides in aframe?
[jQuery] Re: Setting source of a frame with jQuery
There is a lot of code there, and I couldn't follow it all. Can you post a simple test page?
[jQuery] Re: Setting source of a frame with jQuery
What you mean by lot of code? The jTree code isn't altered, my code is in custom.js, and there are two pages (index.html and doc_index.html) to check. I can't put up a test page, I need to work with these simple pages. Another question: shared JS global variables have separate values between frames? Because my frame sets a shared JS variable and the other frame sees its default value. On dec. 8, 02:32, Dave Methvin [EMAIL PROTECTED] wrote: There is a lot of code there, and I couldn't follow it all. Can you post a simple test page?
[jQuery] Problem with Tablesorter Plugin
I just downloaded JQuery. For my first project, I'd like to make a table with sortable columns and alternating row colors. For the sortable columns, I downloaded the Tablesorter plugin, then followed the tutorial at http://tablesorter.com/docs/ I don't know a lot about JavaScript, but I have implemented and tweaked many pre-made JavaScripts. So I don't understand why I can't get this one to work. First, I tried it on a PHP page with a table displaying dynamic content. When that didn't work, I made a very simple page, with nothing but a table, in the same directory as the two JavaScripts I linked to in the head section. My table has head and body tags, along with the proper ID (myTable). Here's the entire code for the page: * * * * * !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; html xmlns=http://www.w3.org/1999/xhtml; head meta http-equiv=Content-Type content=text/html; charset=UTF-8 titleUntitled Document/title script src=jquery-1.2.6.min.js type=text/javascript script src=tablesorter/jquery.tablesorter.js type=text/javascript script src=tablesorter/jquery.tablesorter.min.js type=text/javascript =JavaScript type=text/JavaScript script language=JavaScript type=text/JavaScript $(document).ready(function() { $(#myTable).tablesorter(); } ); /script /head body BODY table width=100% ID=myTable thead tr thN/th thAnimal/th thHome/th /tr /thead tbody tr td1/td tdaardvark/td tdArizona/td /tr tr td2/td tdzebra/td tdSouth Dakota/td /tr tr td3/td tdpenguin/td tdTennessee/td /tr tr td4/td tdass/td tdCalifornia/td /tr tr td5/td tdwarthog/td tdDemocratic Republic of the Congo/td /tr tr td6/td tdgiraffe/td tdChina/td /tr tr td7/td tdgorilla/td tdTaiwan/td /tr tr td8/td tdSouth Dakota/td tdTibet/td /tr tr td9/td tdaardwolf/td tdAlbania/td /tr tr td10/td tdzorilla/td tdGreece/td /tr /tbody /table /body /html * * * * * I tried it with tablesorter.js, tablesorter.min.js and both at the same time, with the same results. Nothing happens. Can anyone tell me what I'm doing wrong? Thanks.
[jQuery] Having trouble thinking through the how: make node, append (w/o showing), then fade in ...
I'm having a hard time working through this in my mind (and a much harder time in code.) I am receiving a JSON array. I am then looping through each result, and trying to create three text boxes within a list item for each line of data. The result should look like this: liinput type=text value=something /.../li Once that node is created, I want to append it to an unordered list, but not visible, so that it can immediately slide open. I can think of some sloppy ways to do this (and maybe they are right), but I assume, like every time I use JQ, there is a more elegant solution. Any tips or advice are greatly appreciated. Here's my code, if it helps: $(document).ready(function () { $(#retrieveData).click(function() { if($(#urlToGet).val() != undefined) { $.getJSON(returnData.php, { url: $(#urlToGet).val() }, function(data){ //alert(data.length); $.each(data, function (i, item) { $(#myList).append(li id='i+i+' style='height:0; overflow:hidden' input type='text' value= + item.a + / /li); $(#i + i).animate({height: 20px }); }); }); } else { alert(You must enter a URL for this feature to work.); } return false; }) }) And then in the body there is ul id=myList/ul
[jQuery] Re: Having trouble thinking through the how: make node, append (w/o showing), then fade in ...
What about something like this? $(liinput type='text' value= + item.a + //li).hide ().appendTo(#myList).slideDown(fast); On Dec 7, 8:10 pm, nathanziarek [EMAIL PROTECTED] wrote: I'm having a hard time working through this in my mind (and a much harder time in code.) I am receiving a JSON array. I am then looping through each result, and trying to create three text boxes within a list item for each line of data. The result should look like this: liinput type=text value=something /.../li Once that node is created, I want to append it to an unordered list, but not visible, so that it can immediately slide open. I can think of some sloppy ways to do this (and maybe they are right), but I assume, like every time I use JQ, there is a more elegant solution. Any tips or advice are greatly appreciated. Here's my code, if it helps: $(document).ready(function () { $(#retrieveData).click(function() { if($(#urlToGet).val() != undefined) { $.getJSON(returnData.php, { url: $(#urlToGet).val() }, function(data){ //alert(data.length); $.each(data, function (i, item) { $(#myList).append(li id='i+i+' style='height:0; overflow:hidden' input type='text' value= + item.a + / /li); $(#i + i).animate({height: 20px }); }); }); } else { alert(You must enter a URL for this feature to work.); } return false; }) }) And then in the body there is ul id=myList/ul
[jQuery] Re: Having trouble thinking through the how: make node, append (w/o showing), then fade in ...
Thanks Ryura -- That's exactly what I thought I could do, but could not get it to work. That's when I came up with my much less elegant solution that works OK, but I have the feeling has some serious shortcomings. The error I get with your solution is Value undefined (result of expression liinput type='text' value= + item.a + //li.hide) is not object. I tried removing everything but the li/li (and then removing the closing /li just in case) to verifying that it wasn't a problem generating the DOM elements, but that didn't change the nature of the error. Thanks! Nate
[jQuery] Problem with placement of image in tooltip
Hi all, I'm trying to use the tooltip plugin and for some reason the image tooltip is always showing up on the bottom left of the page. I've created a very simple example illustrating the problem. I must be doing something incredibly stupid. Anyone have any ideas? Thanks a lot, Russ html head script type=text/javascript src=http://ajax.googleapis.com/ ajax/libs/jquery/1.2.6/jquery.min.js/script script type=text/javascript src=http://jquery.bassistance.de/ tooltip/jquery.tooltip.js/script script type=text/javascript $(document).ready( function() { $('.album_art').tooltip({ showURL : false, track : true, bodyHandler: function() { return $(img/).attr(src, this.src); } }); } ); /script /head body div align=center img class=album_art src=http://ecx.images-amazon.com/ images/I/4187ZuBtMdL._SS500_.jpg width=30 height=30 / /div /body /html
[jQuery] Re: How can I make a td clickable?
On Dec 7, 2008, at 9:34 AM, Kayhadrin wrote: Hi, If .menuitem is a class you use to contain each link, and .menu is the class that exactly defines a link, you could use: $('.menuitem').click(function(){ // the whole menu item can be clicked $('a.menu', this).click(); // simulate a click on the link, which should make the browser load the link's URL }); Actually, I don't think that is going to work. Instead, you'll have to do something like this: $('td.menuitem').click(function(event) { window.location.href = $('a.menu', this).attr('href'); }); }); See my related blog entry (just posted 2 minutes ago) and scroll down to the part about Other Elements: http://www.learningjquery.com/2008/12/quick-tip-click-table-row-to-trigger-a-checkbox-click --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
[jQuery] Resize textarea to fit all text (needing scrollHeight?)
I want to adjust a textarea to fit all of the text within. I tried toying with the dimensions plugin, but it doesn't offer the scrollHeight attribute, which is what I think I need. Before I go journeying off on a wild tangent to my actual project, I wanted to make sure that a) I'm barking up the right tree and b) jQuery doesn't already offer this in some function I'm unaware of. Thanks! Nate
[jQuery] Re: Need help modifying this jQuery...
Got it working! I did go back to the first way of coding the jQuery, however. The problem I had was in wrapping the input's with a form tag. I guess when using jQuery the way this is written, the form tags aren't necessary and actually keep the code from functioning properly. It's a little strange to have form fields with a form tag, but whatever works... Thanks for your help! Rick Rick Faircloth wrote: Hi, Andrew, and thanks for the code. I've been *partially* successful and I don't quite understand why things are happening the way they are...it could be some of the ColdFusion code involved. When I run the login.cfm page with the myForm form, I end up with my message being displayed for a successful login, but it's in this format, {login:Login Successful} which I think is the Json translation of the data... Also, the message is displayed on the login_processor.cfm page, instead of the page with the form, login.cfm, which is where the message should end up in plain text. Here are the files involved: - login.cfm - login_processor.cfm - manager_data.cfc - cfjson.cfc (running the code your way probably makes this unecessary, at the very least, since, I assume, form.js is handling the Json translation...?) Here's what each of these files looks like: login.cfm ___ !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd; html xmlns=http://www.w3.org/1999/xhtml; cfsetting showdebugoutput=no head script type=text/javascript src=jquery.js/script script type=text/javascript src=jquery.form.js/script script type=text/javascript $(document).ready(function() { //bind 'myForm' and provide a simple callback function $('#myForm').ajaxForm( { dataType: 'json', success: function(data) { $('#contentdiv').empty().fadeIn(1000).append(data.login_message); } }); }); /script style type=text/css body { font-family: Arial, Helvetica, sans-serif; } #databox { border: 1px solid Gray; margin:30px auto 0px auto; padding: 10px; width: 200px;} #contentdiv { color:red; font-size: 30px; margin-top: 10px;} /style /head body form id=myForm action=login_processor.cfm method=post Email: input type=text name=email_address / Password: input type=password name=password / input type=submit value=Login / /form p id=contentdiv /p /body /html login_processor.cfm _ cfsetting showdebugoutput=no cfset mdata = createObject(component,manager_data) cfset thedata = mdata.getmanagerData(form.email_address, form.password) cfset ojson = createObject(component,cfjson) cfset results = ojson.encode(thedata) cfoutput#results#/cfoutput manager_data.cfc ___ cfcomponent displayname=manager_data hint=Contains manager database query output=false cffunction name = getmanagerData cfargument name = email_address type=string required=yes cfargument name = passwordtype=string required=yes cfquery name=get_manager datasource=login selectemail_address, password fromsite_managers whereemail_address = '#arguments.email_address#' andpassword = '#arguments.password#' /cfquery cfset managerStruct = structNew() cfif get_manager.recordcount gt 0 cfset managerStruct.login = Login Successful cfelse cfset managerStruct.login = Login Unsuccessful /cfif cfreturn managerStruct /cffunction /cfcomponent And then there's cfjson.cfc, the content of which I won't post unless you really need to see it because there's a lot of code... Is there some adjustment that's needed in my processing code/files since I'm using the different jQuery code that you provided? Any more help is appreciated! Rick aschmid wrote: Rick, You could try the form plugin as below form id=myForm action=request_processor.cfm method=post Email: input type=text name=email_address / Password: input type=password name=password / input type=submit value=Login / /form script type=text/javascript src=path/to/jquery.js/script script type=text/javascript src=path/to/form.js/script script type=text/javascript $(document).ready(function() { // bind 'myForm' and provide a simple callback function $('#myForm').ajaxForm( { dataType: 'json', success: function(data)
[jQuery] [jQuery]how to create a Firefox Extension using jquery
i , i was trying to replace my javascript statements with jquery statements by including the jquery file in *.xul file. the xul file line is as under: script type=application/x-javascript src=chrome://extensionname/content/jquery-1.2.6.min.js/ and i am trying to access the $/ jquery functions in the other js file of my plugin. but its not working. plz help.
[jQuery] Re: Setting source of a frame with jQuery
The zip you posted has 30 files in it. That's a lot of moving parts for a test case, and it doesn't look like most of them would be needed to demonstrate the problem.
[jQuery] Re: bind a function to another function
Yes you are correct, I mistakenly wrote wrong values. Thanks for informing me. I modified it. cheers, Prajwala On Sun, Dec 7, 2008 at 1:12 PM, Joe [EMAIL PROTECTED] wrote: 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
[jQuery] how to image cache using jQuery?
hi, I'm new in jQuery... can someone help me to understand how to do Image caching from jQuery. thanks...
[jQuery] Re: Submit form using ajax
Hi, Thanks for your response. I am using a form plugin for submitting form. http://plugins.jquery.com/project/form i came to know that livequery can solve this issue, but i am not understanding that how livequery will bind my form for ajax event. On Dec 5, 11:34 pm, Mike Alsup [EMAIL PROTECTED] wrote: Please let me know where i am wrong. Move this line: $('#add_prime_show_id').ajaxForm(options); and put it right beneath this line: $('#admin_ajax_new_content_id').html(html); //show the html inside .content div For background info on why: http://docs.jquery.com/Frequently_Asked_Questions#Why_do_my_events_st...
[jQuery] Remote requests using $ajax
Hey all, I'm in need of making a remote request (i.e. to a different domain) using the $.ajax function. Doing some preliminary research on google and this group, it looks like the most popular workaround is to call a separate local script using $ajax; and then having the local script perform the actual remote request. However, for my current situation, I cannot utilize a local script. The documentation for $ajax seems to imply that jquery supports remote calls, unless I'm misinterpreting this line: All remote (not on the same domain) POST requests are converted to GET when 'script' is the dataType (because it loads script using a DOM script tag). http://docs.jquery.com/Ajax/jQuery.ajax Can someone post an example of a remote request using $ajax? Please let me know if you'd me to clarify. Thanks! Dave
[jQuery] Re: Webdeveloper to WebDeveloper
Hi Well what you are doing is not legal ( you are allowed to summarize an article on your page and then link to the original article but not copy the whole content and link to the original article if you dont have the permission of each of the sites or article owners, that is not done the original authors spend time making these articles and you are ripping the whole content ( altho you link to the site you can read the full alrticle on yours so you are nenefiting from the original authors hard work since people read it on your site On Sat, Dec 6, 2008 at 3:43 AM, 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 it http://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: Remote requests using $ajax
Try looking at the getJSON method: http://docs.jquery.com/Ajax/jQuery.getJSON It's the only way to do direct cross-domain communication from the client-side. (The other option is you use a proxy on your server and route requests through there.) Karl Rudd On Mon, Dec 8, 2008 at 4:52 PM, dave [EMAIL PROTECTED] wrote: Hey all, I'm in need of making a remote request (i.e. to a different domain) using the $.ajax function. Doing some preliminary research on google and this group, it looks like the most popular workaround is to call a separate local script using $ajax; and then having the local script perform the actual remote request. However, for my current situation, I cannot utilize a local script. The documentation for $ajax seems to imply that jquery supports remote calls, unless I'm misinterpreting this line: All remote (not on the same domain) POST requests are converted to GET when 'script' is the dataType (because it loads script using a DOM script tag). http://docs.jquery.com/Ajax/jQuery.ajax Can someone post an example of a remote request using $ajax? Please let me know if you'd me to clarify. Thanks! Dave
[jQuery] Re: jQuery.uploader released: Flash based jQuery uploader
One question. Your docs and examples don't ever mention, that I can tell, how the data is handed off to the backend script. Are the images just going to be in the $_FILES global (to give a PHP example)? Yes, i did not include any information about the backend script used, since each and every file upload example allready has this, for example; swfupload has it, but also fancyupload has some good examples. @Alexandre: Also, a question: does your plugin returns the created file name (in case of serverside rewriting, for example, to avoid file duplication ?) i personally never found an easy way to tackle this using flash to upload files. And it's my main gripe against them. Thanx for the mentioning of the 404!. As you can see in the second demo; - You select a file (which is uploaded automatically) - The server gets that file, and saves it as a NEW filename (so your backend can do whatever you want with the file) - And you can send the data back to flash, as i do by telling the location of the new image file. I hope this answers your questions.