[jQuery] Re: upload file from jquery dialog modal form
bump... im also looking for a pointer in the right direction On Jun 16, 6:43 pm, "Johan Gunnarson" wrote: > Does anyone know if it is possible to upload a file from a jquery modal form > (http://jqueryui.com/demos/dialog/#modal-form) ? > > I just need some help with the ajax call. The back-end will be asp with > AspUpload that will handle the file upload.
[jQuery] , hover & active
I have two image based links that open external an page in a .
I am changing the background via hover from the CSS.
My CSS:
#cs_contact {width: 146px; height: 34px; float: left;}
a.cs_contact {width: 146px; height: 34px; background: url('/img/
pages/cs_contact.png'); display:block}
a.cs_contact:hover {background-position: -146px;}
a.cs_contact_a {width: 146px; height: 34px; background: url('/img/
pages/cs_contact.png'); display:block;background-position: -146px;}
#cs_appoint {width: 146px; height: 34px; float: left; margin: 10px
0px 0px 0px}
a.cs_appoint {width: 146px; height: 34px; background: url('/img/
pages/cs_appoint.png'); display:block}
a.cs_appoint:hover {background-position: -146px;}
My JS:
$('.cs_contact').click(function() {
$(this).removeClass("cs_contact");
$(this).addClass("cs_contact_a");
});
My HTML:
I discovered how to make one image link ACTIVE via js, but I don't
know how to make the two links toggle with each other. I can only
have ONE LINK active at a time.
I have 10 more image links to add to this page.
Many thanks.
Erik
[jQuery] Re: how to display sortable list with new order
thank you for your idea, that opens my mind really, but the webpage i
created is dynamic, is there any easier way to do it? just wondering,
the jquery ui sortable is support for sorting items, there must be
some way to support display with customised order as well. I just
couldn't finger it out, please help.
On Jul 4, 3:29 pm, waseem sabjee wrote:
>
>
>
>
>
>
>
> and from the data structure mentioned above
> we retrieve the rows holding two key field
> position and html
>
>
>
> $(function() {
> // we just create our items object
> var items = [];
> // create an array to hold our positions
> item.position = new Array();
> // create an array to hold our html
> item.html = new Array();
>
> /* SERVER SIDE SCRIPT HERE
> you should use your php or asp script to retrieve your data
> $int i = 0;
> start of server side foreach
> */
> // javascript between server side script
> // just populate our JavaScript arrays with data
> item.position[] = position; ?>;
> item.html[] = html; ?> ;
> /* SERVER SIDE SCRIPT HERE
> i++
> end of server side foreach
> */
>
> // we just do a for loop to fill our html list items with the correct html
> :)
> for(var i = 0; i < item.position.length; i++) {// if i is less then amount
> of items in array increment i
> $("." + item.position[i]).html(item.html[i]);
> /*
> if the item position was position one then html relating to that position
> will be filled in
> */
>
> }
>
> // now we just unhide our list items
> $("..listitem").show();
>
> });
>
>
>
>
> /* this style initially hides all our items */
> .listitem {
> display:none;}
>
>
>
> On Sat, Jul 4, 2009 at 9:12 AM, cs...@hotmail.com
> wrote:
>
>
>
> > hi waseem, thx for your idea and really appreciate for doing it. what
> > i want to know is how to display these toolbars-"div"s base on
> > retrieved data from database.
> > for example:
> > orginal order
> > div id=1 class=1
> > div id=2 class=2
> > div id=3 class=3
> > assume i retrieved data from database is array,which contains the
> > customised order "3","1","2"
>
> > how to display divs like this?
> > div id=3 class=3
> > div id=1 class=1
> > div id=2 class=2
>
> > On Jul 4, 2:04 pm, waseem sabjee wrote:
> > > lets just see the logic behind this.
>
> > >
> > > item
> > >
>
> > >
> > > item
> > >
>
> > >
> > > item
> > >
>
> > >
> > > item
> > >
>
> > > say we have item as mentioned above.
> > > METHOD 1
> > > --
> > > save to database :
> > > your table would be like so
>
> > > if you are using MYSQL
> > > ID INT(11) NOT NULL auto_increment,
> > > userID INT(11) NOT NULL,
> > > position TEXT NOT NULL,
> > > html TEXT NOT NULL
>
> > > if you are using SQL SERVER
> > > ID INT NOT NULL -- set identifier to yes and set increment to 1
> > > userID INT NOT NULL,
> > > position VARCHAR(max) NOT NULL,
> > > html VARCHAR(max) NOT NULL
>
> > > for both cases index ID as Primary Key
> > > non clustered index on position
> > > non clustered index on html
> > > my idea is to save the html of a specific position to the db and refill
> > the
> > > positions based on this
> > > note i used classes such as position1, position2 to identify my locations
> > > I have created one table that will keep track of the positions for each
> > user
>
> > > if you do not want to use a database you can use cookies :)
> > > your cookies would be :
> > > position, html
> > > same type of logic
>
> > > On Sat, Jul 4, 2009 at 3:39 AM, cs...@hotmail.com <
> > cs3p...@googlemail.com>wrote:
>
> > > > Hi all:
>
> > > > i am trying to use jquery UI sortable on my webpage to display
> > > > toolbars. what i want is, let people sort these toolbars in the way
> > > > they like. i have named toolbars with id "1","2","3","4", and i saved
> > > > sorted order to database via toArray method. i was wondering how i
> > > > could display these toolbars with new order when people browser my
> > > > site next time, is there any method that supports it?
>
> > > > i am really appreciate for your help, thx in advance
>
> > > > andy
[jQuery] Re: ready() to bind post-ajax events
I didn't know you could do that, but it would be simpler to just call your
bindNewEvent function directly:
$.ajax({
type: 'POST',
url: 'myPage.html',
success: function(c){
$(".response").html(c);
bindNewEvent(".response a");
}
});
-Mike
> From: hedgomatic
>
> I haven't seen much mention of this on the web, and only
> recently discovered it works not sure if this is somehow
> bad practice or just a lesser known trick, but lately I've
> been chaining .ready() at the end of .html() when I want to
> bind events to new ajax data... I presume it's much more
> efficient than live(), and avoids racing issues. EG:
>
>
> $.ajax({
> type: 'POST',
> url: 'myPage.html',
> success: function(c){
> $(".response").html(c).ready(function() {
> bindNewEvent(".response a");
>
> });
> });
>
> function bindNewEvent(o) {
> $(o).click(funciton() { ...etc... }); };
>
>
>
> There's infinite docs about using .ready() to process the
> document, but not returning HTML. Passing the above along
> should anyone find it useful or have insight onto why it's
> seemingly not mentioned elsewhere.
>
[jQuery] Re: JQuery events and a possible scoping error on my part?
Glad you found your own solution so fast, Blake!
If you want to slide the info divs up and down using the same link,
you could also use the nice toogle function. Then you just have to do
something like this:
$(".peekaboo").each( function() {
$(this).click( function() {
var parts = this.id.split( "_" );
$("#peekaboo_" + parts[1]).toggle("slow");
return false;
})
});
On 4 Jul., 23:30, Blake Senftner wrote:
> First off, I'd like to sincerely thank both olsch01 and charlie for
> their help, as well as the superb website of list member Karl
> Swedberg. Between their help and that web site, I have a completely
> generalized solution I am very happy with!
>
> It was Karl'swww.learningjquery.comsite, and his article explaining
> "What is 'this'?" that gave me a complete grasp of what was going on.
>
> So, now for any page that I want content to be available in sliding
> down and up sections, I do this:
>
> 1) any links for data to be revealed have the class "peekaboo"
> 2) each link for data to be revealed has an id of the form
> "reveal_someNumber", as in "reveal_1" and "reveal_3678"
> 3) each link for data to be hidden has an id of the form
> "hide_someNumber"
> 4) each block of content that gets revealed and hidden has an id of
> the form "peekaboo_someNumber"
>
> And here's the jquery that makes the magic:
>
> // locate all page elements with the class "peekaboo":
> $(".peekaboo").each( function() {
> // attach a click callback to our reveal-
> link:
> $(this).click( function() {
> var parts =
> this.id.split( "_" );
> $("#peekaboo_" + parts
> [1]).slideDown();
> return false;
> });
>
> // 'this' is an element of class
> 'peekaboo',
> // with an id holding key info:
> var elems = this.id.split( "_" ); // id
> is of the form reveal_num
>
> // attach a click callback to our hide-
> link:
> $("#hide_" + elems[1]).click( function() {
> var
> parts = this.id.split( "_" );
> $
> ("#peekaboo_" + parts[1]).slideUp();
>
> return false;
> });
> } // close anonymous function each callback
> ); // close 'each'
>
> Sincerely,
> -Blake
> bsenft...@earthlink.net
[jQuery] Re: Getting a variable out of a function
hi there.
1. ensure the script refference to JQuery is correct
ensure the path is correct as well as the spelling
if your script refference is correct and the errors continue try this. when
executing your js
$(function() {
// ensure all the JQuery your do runs inside of this
var active = 'false'; // when declaring a variable say *var myVariableName =
value;*
$(".menulink").mouseover(function() { // there is no need to include
(active)
// perform these methods while mouseover menu link
active = 'true';
$(".TEST")>html(active);
});
});
I also noticed you [b] [/b] tags - do not use them
On Sat, Jul 4, 2009 at 5:02 PM, pixelvoodoo wrote:
>
> Hi,
>
> New to JQuery and hope this question has an easy solution.
>
> At present I am trying to assign a global variable from a function
> which is called on a mouseover event, fired by going over a hyperlink
> with a specific class.
>
> The code:
>
> [b] active = "false"
>
>$('.menulink').mouseover( function(active) {
>active = "true"
>return active
>});
>
>$('.TEST').html( active )[/b]
>
> At present I keeping getting undefined errors and I can't figure out
> why.
>
> Would appreciate any help!
>
> Chris
>
[jQuery] Re: Convoluted Selector issue...
Hi there. Try this:
$('a.checktoggle').click(function() {
var cb = $(this).closest('div').next().find(':checkbox')[0];
cb.checked = !cb.checked;
return false;
});
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jul 4, 2009, at 1:36 PM, Pkunzipula wrote:
Hello Experts!
Below are 2 of several divs that are displayed 1 at a time depending
on which tab is selected.
I'm trying to toggle checkmarks/filter states for each list
independent of the others. But I don't know the fancy selecting
needed to hone the aim of the checktoggle link.
The goal is to have the a.checktoggle (line 5 of each block) toggle
the checkbox (3rd line from the bottom)
===
FilterSearch
4100Laura Scarlett
Administrative Secretary
FilterSearch
4100Lee Mustard
Administrative Secretary
==
This jquery does the toggling:
var tog = false; // or true if they are checked on load
$('a.checktoggle').click(function() {
$('input[type=checkbox]').attr('checked',!tog);
tog = !tog;
...but I assume it's line 3 that needs selectors to achieve the proper
targeting.
Anyone have any ideas?
I sure appreciate your time.
Arlen
[jQuery] Re: JQuery events and a possible scoping error on my part?
First off, I'd like to sincerely thank both olsch01 and charlie for
their help, as well as the superb website of list member Karl
Swedberg. Between their help and that web site, I have a completely
generalized solution I am very happy with!
It was Karl's www.learningjquery.com site, and his article explaining
"What is 'this'?" that gave me a complete grasp of what was going on.
So, now for any page that I want content to be available in sliding
down and up sections, I do this:
1) any links for data to be revealed have the class "peekaboo"
2) each link for data to be revealed has an id of the form
"reveal_someNumber", as in "reveal_1" and "reveal_3678"
3) each link for data to be hidden has an id of the form
"hide_someNumber"
4) each block of content that gets revealed and hidden has an id of
the form "peekaboo_someNumber"
And here's the jquery that makes the magic:
// locate all page elements with the class "peekaboo":
$(".peekaboo").each( function() {
// attach a click callback to our reveal-
link:
$(this).click( function() {
var parts =
this.id.split( "_" );
$("#peekaboo_" + parts
[1]).slideDown();
return false;
});
// 'this' is an element of class
'peekaboo',
// with an id holding key info:
var elems = this.id.split( "_" ); // id
is of the form reveal_num
// attach a click callback to our hide-
link:
$("#hide_" + elems[1]).click( function() {
var
parts = this.id.split( "_" );
$
("#peekaboo_" + parts[1]).slideUp();
return false;
});
} // close anonymous function each callback
); // close 'each'
Sincerely,
-Blake
bsenft...@earthlink.net
[jQuery] slideToggle() behavior change between 1.3.2 and 1.2.6
Whereas jQuery1.2.6 showed the expected behavior, something changed in
version 1.3.2. Under certain circumstances, when the target element
is toggled into the hidden state, it automatically reappears. I
believe that it only occurs, if there are only floating elements in
the target. I narrowed it down to the following example:
$(document).ready(function(){
$(".collapseme").show()
$(".clickme").click(function() {
$("body").find(".collapseme").slideToggle();
});
});
Click Me
Lorem ipsum dolor sit
amet,
Is this a bug? Is this known?
[jQuery] Getting a variable out of a function
Hi,
New to JQuery and hope this question has an easy solution.
At present I am trying to assign a global variable from a function
which is called on a mouseover event, fired by going over a hyperlink
with a specific class.
The code:
[b] active = "false"
$('.menulink').mouseover( function(active) {
active = "true"
return active
});
$('.TEST').html( active )[/b]
At present I keeping getting undefined errors and I can't figure out
why.
Would appreciate any help!
Chris
[jQuery] I get "not implemented" error visual studio aspx page
Hi,
When i run the below code, I get "not implemented" error message from
aspx(visual studio)
I guess this message about height or left position setting of div
(I use vs2008 andthese jf fiels ;
//
7
CODE:
$.blockUI({ message: $('#divConfirmBox') });
Are you sure you want to delete this record?
[jQuery] Lavalamp - disable a single li click
Hi Everyone, I'm using the lavalamp plug in. One of the items in my list is used to display a tooltip and I'd like to leave it unselected on click. Basically, when the mouse is over the item, leave the lavalamp graphic in place, and if clicked, act as if it wasn't when the mouse moves off. I've got everything working just fine except for that one little piece. Thanks!
[jQuery] Re: [validation] how to return for jquery.Format
How i can use the remote method to build the url like:
"/promotions/checkName/"+name+'/'+promotion_id, type:'post',
?
On Sat, Jul 4, 2009 at 12:08 PM, Jörn
Zaefferer wrote:
>
> Use the remote method:
> http://docs.jquery.com/Plugins/Validation/Methods/remote#url
>
> Jörn
>
> On Sat, Jul 4, 2009 at 6:30 PM, Manolet Gmail wrote:
>>
>> Hi, im adding a method. i want to display a message like:
>> THECONTENTOFMYINPUT is already user. this is what im doing.
>>
>> jQuery.validator.addMethod("checkname", function(value, element) {
>> var name = $('#PromotionName').val();
>> var promotion_id = $('#PromotionId').val();
>>
>> text = $.ajax({ url:
>> "/promotions/checkName/"+name+'/'+promotion_id, type:'post',
>> async:false }).responseText;
>> return eval(text);
>> }, jQuery.format("{0} is already used",
>> $('#PromotionName').val() ));
>>
>> but dont works
>>
>
[jQuery] Convoluted Selector issue...
Hello Experts!
Below are 2 of several divs that are displayed 1 at a time depending
on which tab is selected.
I'm trying to toggle checkmarks/filter states for each list
independent of the others. But I don't know the fancy selecting
needed to hone the aim of the checktoggle link.
The goal is to have the a.checktoggle (line 5 of each block) toggle
the checkbox (3rd line from the bottom)
===
FilterSearch
4100Laura Scarlett
Administrative Secretary
FilterSearch
4100Lee Mustard
Administrative Secretary
==
This jquery does the toggling:
var tog = false; // or true if they are checked on load
$('a.checktoggle').click(function() {
$('input[type=checkbox]').attr('checked',!tog);
tog = !tog;
...but I assume it's line 3 that needs selectors to achieve the proper
targeting.
Anyone have any ideas?
I sure appreciate your time.
Arlen
[jQuery] Re: ready() to bind post-ajax events
Would there be a racing issue with html() though? I believe that is not an
asynchronous method, so it would have to complete before the next chained
method.
-- Josh
- Original Message -
From: "hedgomatic"
To: "jQuery (English)"
Sent: Saturday, July 04, 2009 9:34 AM
Subject: [jQuery] ready() to bind post-ajax events
I haven't seen much mention of this on the web, and only recently
discovered it works not sure if this is somehow bad practice or
just a lesser known trick, but lately I've been chaining .ready() at
the end of .html() when I want to bind events to new ajax data... I
presume it's much more efficient than live(), and avoids racing
issues. EG:
$.ajax({
type: 'POST',
url: 'myPage.html',
success: function(c){
$(".response").html(c).ready(function() {
bindNewEvent(".response a");
});
});
function bindNewEvent(o) {
$(o).click(funciton() { ...etc... });
};
There's infinite docs about using .ready() to process the document,
but not returning HTML. Passing the above along should anyone find it
useful or have insight onto why it's seemingly not mentioned elsewhere.
[jQuery] Re: [validation] how to return for jquery.Format
Use the remote method:
http://docs.jquery.com/Plugins/Validation/Methods/remote#url
Jörn
On Sat, Jul 4, 2009 at 6:30 PM, Manolet Gmail wrote:
>
> Hi, im adding a method. i want to display a message like:
> THECONTENTOFMYINPUT is already user. this is what im doing.
>
> jQuery.validator.addMethod("checkname", function(value, element) {
> var name = $('#PromotionName').val();
> var promotion_id = $('#PromotionId').val();
>
> text = $.ajax({ url:
> "/promotions/checkName/"+name+'/'+promotion_id, type:'post',
> async:false }).responseText;
> return eval(text);
> }, jQuery.format("{0} is already used",
> $('#PromotionName').val() ));
>
> but dont works
>
[jQuery] Re: Inclusion of external scripts ("best" approach)
Will check that one now. Thanks once more, Karl! On 4 Jul., 17:41, Karl Swedberg wrote: > --Karl > > > Karl Swedbergwww.englishrules.comwww.learningjquery.com > > On Jul 4, 2009, at 5:49 AM, north wrote: > > As far as elements getting hidden goes, there is a pretty simple > workaround. You can put a one liner in the > ( document.documentElement.className = 'js'; ) and the rest of your > scripts at the end of the . > > I discuss this approach at the end of this article: > > http://www.learningjquery.com/2008/10/1-way-to-avoid-the-flash-of-uns...
[jQuery] Re: JQuery events and a possible scoping error on my part?
Agreed :)
[jQuery] ready() to bind post-ajax events
I haven't seen much mention of this on the web, and only recently
discovered it works not sure if this is somehow bad practice or
just a lesser known trick, but lately I've been chaining .ready() at
the end of .html() when I want to bind events to new ajax data... I
presume it's much more efficient than live(), and avoids racing
issues. EG:
$.ajax({
type: 'POST',
url: 'myPage.html',
success: function(c){
$(".response").html(c).ready(function() {
bindNewEvent(".response a");
});
});
function bindNewEvent(o) {
$(o).click(funciton() { ...etc... });
};
There's infinite docs about using .ready() to process the document,
but not returning HTML. Passing the above along should anyone find it
useful or have insight onto why it's seemingly not mentioned elsewhere.
[jQuery] [validation] how to return for jquery.Format
Hi, im adding a method. i want to display a message like:
THECONTENTOFMYINPUT is already user. this is what im doing.
jQuery.validator.addMethod("checkname", function(value, element) {
var name = $('#PromotionName').val();
var promotion_id = $('#PromotionId').val();
text = $.ajax({ url:
"/promotions/checkName/"+name+'/'+promotion_id, type:'post',
async:false }).responseText;
return eval(text);
}, jQuery.format("{0} is already used",
$('#PromotionName').val() ));
but dont works
[jQuery] Ajax with jQuery and Rails
I am learning Ajax with jQuery. My server is Ruby on Rails.
In a nutshell, I do not know how to let jQuery give up control and let
the server side take over. I have a jsTree displaying various nodes
(folders in my application). If a clicked folder has documents in it,
then I want to let the Ruby on Rails server code redirect the control
to a different page that displays a list of documents in belonging to
that folder. I can see that happening in the server side log, but the
control stays on the folders tree page.
Here is the jQuery snippet that makes the call to the server method
that does the redirecting:
var handle_selected = function(docs_count_in_json) {
hide_progress();
//alert(docs_count_in_json.documents_count);
var c = docs_count_in_json.documents_count;
if (c > 0) {
// alert("Has documents to display.")
// should directly go to the documents tab if there are
documents
var s_id = jQuery.tree_reference('folders_tree').selected.attr
('id');
jQuery.ajax({
type: "POST",
url: base_url + 'set_current_folder/' + s_id,
beforeSend: show_progress,
data: ({authenticity_token: AUTH_TOKEN}),
dataType: "json",
error: handle_ajax_error,
success: hide_progress
});
} else {
alert("This folder does not have any documents.")
}
}
Here is the server side rails code for 'set_current_folder' method
shown above:
def set_current_folder
@folder = Folder.find(params[:id])
session[:nested_folder_id] = nil
unless @folder.practice_id.blank?
session[:folder_id] = @folder.id
flash[:notice] = "Current folder set to #{current_folder.name}"
redirect_to documents_path
else # this should not happen, yet just in case
flash[:warning] = "Please associate this folder with
corresponding practice first."
redirect_to(:action => 'edit', :id => session[:folder_id])
end
end
There is something basic that I am missing which would allow my jQuery
Ajax call to give up control to the server side so that the
"redirect_to documents_path" can execute.
Bharat
[jQuery] Re: treeview, can only let "+""-" expand tree?
method 1. +Folder 1 so yeah the folder must not be in the same hyperlink as the + sign that should do it. On Sat, Jul 4, 2009 at 6:12 PM, ljnet wrote: > > for example: > > +folder1 > +folder2 > > only when click the "+" sign, tree expands. > how to do that? > > thanks!
[jQuery] treeview, can only let "+""-" expand tree?
for example: +folder1 +folder2 only when click the "+" sign, tree expands. how to do that? thanks!
[jQuery] Re: Initial Setup
If you want to link to version 1.3.2, use this: http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js If you want to link to the most recent 1.3.x version, use this: http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js If you want to link to the most recent 1.x version, use this: http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Jul 4, 2009, at 10:31 AM, Charlie wrote: version is in the url current version of jQuery is 1.3.2, just change url . plugins generally don't have AJAX libraries and if you bootleg them from somone elses server you are at mercy of their server. Google with international network is a different story. http://code.google.com/apis/ajaxlibs/documentation/index.html#jquery Andrew wrote: Thanks, very helpful -- three more questions: * Is there documentation covering basic questions like these? * Can I reference the latest version, if so what would be the URL? * Can I also hotlink to plugins? For example I want to use TreeView, what would be the URL for that .js file? I've tried various URLs to do both, but not found one that works. Andrew On Jul 3, 3:49 pm, Pyrolupus wrote: On Fri, Jul 3, 2009 at 8:51 AM, Andrew wrote: I'm new to JavaScript -- and cannot get jQuery to work (unless I accesshttp://code.jquery.com/jquery-latest.js) ... * my hosting service does doesn't have gzip compression enabled -- what file do I need to install on my server if I don't have GZIP available? If you want/need to "hotlink" to jQuery on a remote server, it's better to use ajax.googleapis.com. For example: http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js That will pull the "minimized" (comments and whitespace stripped == smaller download) 1.3.2 version of jQuery from Google. Google DOES GZip these files, which is useful if you can't get it gzipped on your hosting service.
[jQuery] Re: Inclusion of external scripts ("best" approach)
--Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Jul 4, 2009, at 5:49 AM, north wrote: One explanation I was thinking about: If you put both scripts at the bottom, the page renders faster, but the delay until certain functionality is available, elements get hidden etc. is greater compared to having the library in the head and the $(document).ready script at the bottom. So it would be a compromise between page loading time and availability of functionality on the page. As far as elements getting hidden goes, there is a pretty simple workaround. You can put a one liner in the ( document.documentElement.className = 'js'; ) and the rest of your scripts at the end of the . I discuss this approach at the end of this article: http://www.learningjquery.com/2008/10/1-way-to-avoid-the-flash-of-unstyled-content
[jQuery] Re: JQuery events and a possible scoping error on my part?
good point, if links are sortable would need to re think my method.
Assumed they were in order in my example. If they are in order however
there is less searching of the DOM required, especially if there are
hundreds or thousands of tags
olsch01 wrote:
Hi Charlie,
one drawback of your function that I see is, that it only works if the
divs with the data to reveal appear in sorted order in the code (i.e.
dataToReveal1, dataToReveal2, dataToReveal3 etc.). If you mix them up,
the function doesn't work properly anymore (at least not in my test),
since your just counting up i. So there is only a loose connection
between the link and the data div.
Doesn't necessarily have to been an issue though :)
On 4 Jul., 16:17, Charlie wrote:
Cleaner if you can use a class on the links. Assume they now have class "dataReveal".
i=1;
$(".dataReveal").each(function () {
var actOnElem = "#dataToReveal" +i;
$(this).click( function() {
$(actOnElem).slideDown();
return false;
});
i++;
});
olsch01 wrote:OK, I guess this is one possible solution: $('a[id^=dataRevealLink]').each(function(){ var eventElemId = $(this).attr('id'); var eventElemIdNo = eventElemId.substring(14, eventElemId.length); var actOnElem = $('#dataToReveal' +eventElemIdNo); $(this).click(function() { actOnElem.slideDown(); return false; }) }); Cheers On 4 Jul., 12:59, olsch01wrote:Hi, I'm not a JS/jQuery expert, so as a quick test I added alert (actOnElem); inside your $(eventElem).click( function(), and the result always was #dataToReveal12. As mentioned, I am not an expert and still learning myself, but I think on dom ready the loop simply starts running until i equals 12. And it's not until then, that the click function comes into play. That's all I can say at the moment. If I have more time later, I will look into this again. Cheers On 4 Jul., 03:59, bsenftnerwrote:Just learning _javascript_ & JQuery, but an experienced developer, I've created a page with a series of elements that use the .slideDown() and .slideUp() functions to reveal and hide the different areas of content on the page.To facilitate this, the page's html uses links with ids similar to: { "dataRevealLink1", "dataToReveal1", "dataHideLink1" }. Clicking on a "data-reveal-link" causes a .slideDown() animation on "data to reveal", with appropriate reverse logic attached for the data hiding as well.The page in question has 12 such sections, and writing the script long form (no loops) works fine. However, I would like to generalize this logic, but my first attempt at a loop to attach the DOM element callbacks does not work, and I suspect it's a scoping issue with _javascript_: for (var i = 1; i <= 12; i++) { var eventElem = "#dataRevealLink" + i; &nbs
p; var actOnElem = "#dataToReveal" + i; $(eventElem).click( function() { $(actOnElem).slideDown(); return false; // prevents the link from processing this click }); }I suspect that in the above logic, the mouse-click callback is attaching to the dataRevealLink1-12 fine, however once inside the callback, "actOnElem" is not what I'm expecting - possibly due to the scope of actOnElem? I'm not entirely sure...I've added console.log() calls to the above logic, and everything is as I expect during the above looping, but I am never getting any of the callbacks to run, so I can never see any
console.log() output from inside a mouse-click handler...Any advice anyone?-- View this message in context:http://www.nabble.com/JQuery-events-and-a-possible-scoping-error-on-m... Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Fire event
Hi,
thanks for the reply! Didn't know trick with if ($().is
()) { ... }
This worked fine for me thanks!
I know the "each" function but i have different actions on each
element so i can not use this for my case. But thanks for the hint!
Cheers,
qualle
On Jul 2, 9:41 pm, Charlie wrote:
> here's a quick start to get you going. Without seeing some markup to build a
> relationship between the button and the #info container would need to
> splice() to pull number off the button ID and splice the #info to create
> function to open correct one. Some markup would help as there are a number of
> easier ways to do this depending on container configuration
> Add a class .infoButton to your buttons unless you already have a class just
> for them. You can do this with ID's but as with CSS it's easier to use
> classes in many instances with jQuery. Following only works if *only* one of
> them will be checked
> $(".infoButton").each(function () {
> if ($(this).is(':checked')) {
> $(".infotext").hide();
> Open appropriate #info .seeing markup here will help, or use
> splice to filter ID's. Adding a class to the #info's will probably help also
>
> });pascal.nauj...@googlemail.comwrote:Hi there, i'am new to jquery so my
> question is maybe too easy for you? ;) I got the following: 3 Radiobuttons
> which each i added a click event that shows up a new div with some
> information about the value of this radio button. This works fine. Now when i
> load the page and passing a PHP variable to the script one radio button is
> checked by default. This also works but the div with the information doesn't
> appear. Is there a way to check which button is selected on $(document).ready
> and then fireing the event which is attached to this button? Here is a code
> snipped of my first jquery script: $(document).ready(function(){
> $(".infotext").hide(); // onload hide the infofield // for each button hide
> the infofield and fade in just the one i need - this works :)
> $("#btn_1").click(function(){ $(".infotext").hide();
> $("#info1").fadeIn("slow"); }); $("#btn_2").click(function(){
> $(".infotext").hide(); $("#info2").fadeIn("slow"); });
> $("#btn_3").click(function(){ $(".infotext").hide();
> $("#info3").fadeIn("slow"); }); }); Regards, qualle
[jQuery] jCarousel
Is jCarousel compatible with jQuery 1.3? If it isn't is there a quick fix?
[jQuery] Re: JQuery events and a possible scoping error on my part?
Hi Charlie,
one drawback of your function that I see is, that it only works if the
divs with the data to reveal have a simple ID count and appear in
sorted order in the code (i.e. dataToReveal1, dataToReveal2,
dataToReveal3 etc.). If you mix them up, or if you have more complex
IDs (for whatever reason - I admit this might be rather unlikely ;),
the function doesn't work properly anymore, since there is only a
loose connection between the link and the data div.
Just my five cents :)
On 4 Jul., 16:17, Charlie wrote:
> Cleaner if you can use a class on the links. Assume they now have class
> "dataReveal".
> i=1;
> $(".dataReveal").each(function () {
> var actOnElem = "#dataToReveal" +i;
> $(this).click( function() {
> $(actOnElem).slideDown();
> return false;
> });
> i++;
> });
> olsch01 wrote:OK, I guess this is one possible solution:
> $('a[id^=dataRevealLink]').each(function(){ var eventElemId =
> $(this).attr('id'); var eventElemIdNo = eventElemId.substring(14,
> eventElemId.length); var actOnElem = $('#dataToReveal' +eventElemIdNo);
> $(this).click(function() { actOnElem.slideDown(); return false; }) }); Cheers
> On 4 Jul., 12:59, olsch01wrote:Hi, I'm not a JS/jQuery
> expert, so as a quick test I added alert (actOnElem); inside your
> $(eventElem).click( function(), and the result always was #dataToReveal12. As
> mentioned, I am not an expert and still learning myself, but I think on dom
> ready the loop simply starts running until i equals 12. And it's not until
> then, that the click function comes into play. That's all I can say at the
> moment. If I have more time later, I will look into this again. Cheers On 4
> Jul., 03:59, bsenftnerwrote:Just learning Java
> Script & JQuery, but an experienced developer, I've created a page with a
> series of elements that use the .slideDown() and .slideUp() functions to
> reveal and hide the different areas of content on the page.To facilitate
> this, the page's html uses links with ids similar to: { "dataRevealLink1",
> "dataToReveal1", "dataHideLink1" }. Clicking on a "data-reveal-link" causes a
> .slideDown() animation on "data to reveal", with appropriate reverse logic
> attached for the data hiding as well.The page in question has 12 such
> sections, and writing the script long form (no loops) works fine. However, I
> would like to generalize this logic, but my first attempt at a loop to attach
> the DOM element callbacks does not work, and I suspect it's a scoping issue
> with java script: for (var i = 1; i <= 12; i++) { var eventElem
> = "#dataRevealLink" + i; var actOnElem = "#dataToReveal" + i;
> $(eventElem).click( function() {
> $(actOnElem).slideDown(); return false;
> // prevents the link from processing this click
> }); }I suspect that in the above logic, the mouse-click
> callback is attaching to the dataRevealLink1-12 fine, however once inside the
> callback, "actOnElem" is not what I'm expecting - possibly due to the scope
> of actOnElem? I'm not entirely sure...I've added console.log() calls to the
> above logic, and everything is as I expect during the above looping, but I am
> never getting any of the callbacks to run, so I can never see any
> console.log() output from inside a mouse-click handler...Any advice anyone?--
> View this message in
> context:http://www.nabble.com/JQuery-events-and-a-possible-scoping-error-on-m...
> Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: JQuery events and a possible scoping error on my part?
Hi Charlie,
one drawback of your function that I see is, that it only works if the
divs with the data to reveal appear in sorted order in the code (i.e.
dataToReveal1, dataToReveal2, dataToReveal3 etc.). If you mix them up,
the function doesn't work properly anymore (at least not in my test),
since your just counting up i. So there is only a loose connection
between the link and the data div.
Doesn't necessarily have to been an issue though :)
On 4 Jul., 16:17, Charlie wrote:
> Cleaner if you can use a class on the links. Assume they now have class
> "dataReveal".
> i=1;
> $(".dataReveal").each(function () {
> var actOnElem = "#dataToReveal" +i;
> $(this).click( function() {
> $(actOnElem).slideDown();
> return false;
> });
> i++;
> });
> olsch01 wrote:OK, I guess this is one possible solution:
> $('a[id^=dataRevealLink]').each(function(){ var eventElemId =
> $(this).attr('id'); var eventElemIdNo = eventElemId.substring(14,
> eventElemId.length); var actOnElem = $('#dataToReveal' +eventElemIdNo);
> $(this).click(function() { actOnElem.slideDown(); return false; }) }); Cheers
> On 4 Jul., 12:59, olsch01wrote:Hi, I'm not a JS/jQuery
> expert, so as a quick test I added alert (actOnElem); inside your
> $(eventElem).click( function(), and the result always was #dataToReveal12. As
> mentioned, I am not an expert and still learning myself, but I think on dom
> ready the loop simply starts running until i equals 12. And it's not until
> then, that the click function comes into play. That's all I can say at the
> moment. If I have more time later, I will look into this again. Cheers On 4
> Jul., 03:59, bsenftnerwrote:Just learning Java
> Script & JQuery, but an experienced developer, I've created a page with a
> series of elements that use the .slideDown() and .slideUp() functions to
> reveal and hide the different areas of content on the page.To facilitate
> this, the page's html uses links with ids similar to: { "dataRevealLink1",
> "dataToReveal1", "dataHideLink1" }. Clicking on a "data-reveal-link" causes a
> .slideDown() animation on "data to reveal", with appropriate reverse logic
> attached for the data hiding as well.The page in question has 12 such
> sections, and writing the script long form (no loops) works fine. However, I
> would like to generalize this logic, but my first attempt at a loop to attach
> the DOM element callbacks does not work, and I suspect it's a scoping issue
> with java script: for (var i = 1; i <= 12; i++) { var eventElem
> = "#dataRevealLink" + i; var actOnElem = "#dataToReveal" + i;
> $(eventElem).click( function() {
> $(actOnElem).slideDown(); return false;
> // prevents the link from processing this click
> }); }I suspect that in the above logic, the mouse-click
> callback is attaching to the dataRevealLink1-12 fine, however once inside the
> callback, "actOnElem" is not what I'm expecting - possibly due to the scope
> of actOnElem? I'm not entirely sure...I've added console.log() calls to the
> above logic, and everything is as I expect during the above looping, but I am
> never getting any of the callbacks to run, so I can never see any
> console.log() output from inside a mouse-click handler...Any advice anyone?--
> View this message in
> context:http://www.nabble.com/JQuery-events-and-a-possible-scoping-error-on-m...
> Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Initial Setup
> * Can I reference the latest version, if so what would be the URL? The latest version would be the 1.3.2 mentioned in the comments. I don't believe Google provides a way to just get the 'latest', but you probably wouldn't want to, because jQuery can change how some functions work from version to version - an automatic update like this could break your site, and it might take you some time to notice, pin down, and debug. It's probably safer to work with the most recent stable version and test your code with a new version before upgrading.
[jQuery] Re: Div and Button display as active and open only on certain pages
So it sounds like you'd want to put a class like "hasOverlay" on the
homepage body.
Then, create the function that makes your overlay appear. This
function needs to be standalone, don't attach it to an event just yet
because we'll need to access it two different ways.
So your JS code would look (structurally, at least) like this.
function showOverlay(){
$('#overlay').fadeIn();
}
$(document).ready(){
if ($("body").hasClass("hasOverlay"))
showOverlay();
$("#myButton").click(function(){
showOverlay();
});
}
[jQuery] Re: Initial Setup
version is in the url current version of jQuery is 1.3.2, just change url . plugins generally don't have AJAX libraries and if you bootleg them from somone elses server you are at mercy of their server. Google with international network is a different story. http://code.google.com/apis/ajaxlibs/documentation/index.html#jquery Andrew wrote: Thanks, very helpful -- three more questions: * Is there documentation covering basic questions like these? * Can I reference the latest version, if so what would be the URL? * Can I also hotlink to plugins? For example I want to use TreeView, what would be the URL for that .js file? I've tried various URLs to do both, but not found one that works. Andrew On Jul 3, 3:49 pm, Pyrolupus wrote: On Fri, Jul 3, 2009 at 8:51 AM, Andrew wrote: I'm new to _javascript_ -- and cannot get jQuery to work (unless I accesshttp://code.jquery.com/jquery-latest.js) ... * my hosting service does doesn't have gzip compression enabled -- what file do I need to install on my server if I don't have GZIP available? If you want/need to "hotlink" to jQuery on a remote server, it's better to use ajax.googleapis.com. For example: http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js That will pull the "minimized" (comments and whitespace stripped == smaller download) 1.3.2 version of jQuery from Google. Google DOES GZip these files, which is useful if you can't get it gzipped on your hosting service.
[jQuery] Re: jQuery Countdown and close button
It looks like neither the Quiz or Quizc div ids have quotes around them...could that be it?
[jQuery] Re: Need help on How to load content via AJAX in jQuery
Where am I placing the link for each tag? Are the link identified in
the JS or the html?
E
On Jul 4, 2009, at 10:18 AM, Charlie wrote:
I gave you slideUp twice...oops...bad copy paste
Erik R. Peterson wrote:
Thanks Charlie,
I'll put it in now. thanks.
E
On Jul 4, 2009, at 9:56 AM, Charlie wrote:
could shorten this all up and make it accessible for javascript
disabled by putting the url into the href of your links.
Haven't looked at plugin but since you're just loading html will
use load() in jQuery core:
hideLoading();
$("#cs_links a").click(function () {
showLoading();
$("#cst_wrap_mid").slideUp();
$("#cst_wrap_mid").load($(this).attr("href"), function(){
$("#cst_wrap_mid").slideUp();
hideLoading();
});
return false;
});
This would replace all of the switch cases. If javascript disabled
appropriate page would open from href. Likely find that load is
very fast and showloading may not be necessary
Erik R. Peterson wrote:
Can;t get it to work correctly.
Here is my existing code:
$(document).ready(function(){
//References
var sections = $("#cs_links a");
var loading = $("#loading");
var content = $("#cst_wrap_mid");
//Manage click events
sections.click(function(){
//show the loading bar
showLoading();
//load selected section
switch(this.id){
case "js_appoint":
content.slideUp();
content.load("/externals/appoint.htm",
hideLoading);
content.slideDown();
break;
case "js_contact":
content.slideUp();
content.load("/externals/contact.htm",
hideLoading);
content.slideDown();
break;
case "js_gifts":
content.slideUp();
content.load("/externals/gifts.htm", hideLoading);
content.slideDown();
break;
case "js_order":
content.slideUp();
content.load("/externals/order.htm", hideLoading);
content.slideDown();
break;
case "js_promise":
content.slideUp();
content.load("/externals/promise.htm",
hideLoading);
content.slideDown();
break;
case "js_quest":
content.slideUp();
content.load("/externals/quest.htm", hideLoading);
content.slideDown();
break;
case "js_returns":
content.slideUp();
content.load("/externals/returns.htm",
hideLoading);
content.slideDown();
break;
case "js_secure":
content.slideUp();
content.load("/externals/secure.htm", hideLoading);
content.slideDown();
break;
case "js_shipping":
content.slideUp();
content.load("/externals/shipping.htm",
hideLoading);
content.slideDown();
break;
case "js_terms":
content.slideUp();
content.load("/externals/terms.htm", hideLoading);
content.slideDown();
break;
case "js_types":
content.slideUp();
content.load("/externals/types.htm", hideLoading);
content.slideDown();
break;
default:
//hide loading bar if there is no selected section
hideLoading();
break;
}
});
//show loading bar
function showLoading(){
loading
.css({visibility:"visible"})
.css({opacity:"1"})
.css({display:"block"})
;
}
//hide loading bar
function hideLoading(){
loading.fadeTo(1000, 0);
};
});
On Jul 4, 2009, at 6:40 AM, MOZ wrote:
Hi,
on your page: http://www.enaturalskin.com/needhelp.htm
each time the window scroll to the top because of anchor #, use
preventDefault(); to avoid this, just a suggestion.
Also see the improved version:
http://yensdesign.com/2009/06/safe-ajax-links-using-jquery/
This trick will make your website work though there is no
javascript.
-Beschi.
On Jul 4, 4:14 am, "Erik R. Peterson" wrote:
Hi buddy!
I'm undecided on the final buttons and graphics, but thanks to
your
help I got the script down.
I actually fixed my own problem after posted this last email.
Have a great weekend.
Erik
On Jul 3, 2009, at 5:14 PM, Cesar Sanz wrote:
Hello.
I see you succed retrieving data using ajax,
Which is the problem?
- Original Message - From: "Erik R. Peterson"
To:
Sent: Friday, July 03, 2009 2:48 PM
Subject: [jQuery] Need help on How to load content via AJAX in
jQuery
I found this script:
ht
[jQuery] Re: Need help on How to load content via AJAX in jQuery
I gave you slideUp twice...oops...bad copy paste
Erik R. Peterson wrote:
Thanks
Charlie,
I'll put it in now. thanks.
E
On Jul 4, 2009, at 9:56 AM, Charlie wrote:
could shorten this all up
and make it accessible for _javascript_ disabled by putting the url into
the href of your links.
Haven't looked at plugin but since you're just loading html will use
load() in jQuery core:
hideLoading();
$("#cs_links a").click(function () {
showLoading();
$("#cst_wrap_mid").slideUp();
$("#cst_wrap_mid").load($(this).attr("href"), function(){
$("#cst_wrap_mid").slideUp();
hideLoading();
});
return false;
});
This would replace all of the switch cases. If _javascript_ disabled
appropriate page would open from href. Likely find that load is very
fast and showloading may not be necessary
Erik R. Peterson wrote:
Can;t get it to work correctly.
Here is my existing code:
$(document).ready(function(){
//References
var sections = $("#cs_links a");
var loading = $("#loading");
var content = $("#cst_wrap_mid");
//Manage click events
sections.click(function(){
//show the loading bar
showLoading();
//load selected section
switch(this.id){
case "js_appoint":
content.slideUp();
content.load("/externals/appoint.htm", hideLoading);
content.slideDown();
break;
case "js_contact":
content.slideUp();
content.load("/externals/contact.htm", hideLoading);
content.slideDown();
break;
case "js_gifts":
content.slideUp();
content.load("/externals/gifts.htm", hideLoading);
content.slideDown();
break;
case "js_order":
content.slideUp();
content.load("/externals/order.htm", hideLoading);
content.slideDown();
break;
case "js_promise":
content.slideUp();
content.load("/externals/promise.htm", hideLoading);
content.slideDown();
break;
case "js_quest":
content.slideUp();
content.load("/externals/quest.htm", hideLoading);
content.slideDown();
break;
case "js_returns":
content.slideUp();
content.load("/externals/returns.htm", hideLoading);
content.slideDown();
break;
case "js_secure":
content.slideUp();
content.load("/externals/secure.htm", hideLoading);
content.slideDown();
break;
case "js_shipping":
content.slideUp();
content.load("/externals/shipping.htm", hideLoading);
content.slideDown();
break;
case "js_terms":
content.slideUp();
content.load("/externals/terms.htm", hideLoading);
content.slideDown();
break;
case "js_types":
content.slideUp();
content.load("/externals/types.htm", hideLoading);
content.slideDown();
break;
default:
//hide loading bar if there is no selected section
hideLoading();
break;
}
});
//show loading bar
function showLoading(){
loading
.css({visibility:"visible"})
.css({opacity:"1"})
.css({display:"block"})
;
}
//hide loading bar
function hideLoading(){
loading.fadeTo(1000, 0);
};
});
On Jul 4, 2009, at 6:40 AM, MOZ wrote:
Hi,
on your page: http://www.enaturalskin.com/needhelp.htm
each time the window scroll to the top because of anchor #, use
preventDefault(); to avoid this, just a suggestion.
Also see the improved version: http://yensdesign.com/2009/06/safe-ajax-links-using-jquery/
This trick will make your website work though there is no _javascript_.
-Beschi.
On Jul 4, 4:14 am, "Erik R. Peterson"
wrote:
Hi
buddy!
I'm undecided on the final buttons and graphics, but thanks to your
help I got the script down.
I actually fixed my own problem after posted this last email.
Have a great weekend.
Erik
On Jul 3, 2009, at 5:14 PM,
[jQuery] Re: JQuery events and a possible scoping error on my part?
Cleaner if you can use a class on the links. Assume they now have class
"dataReveal".
i=1;
$(".dataReveal").each(function () {
var actOnElem = "#dataToReveal" +i;
$(this).click( function() {
$(actOnElem).slideDown();
return false;
});
i++;
});
olsch01 wrote:
OK, I guess this is one possible solution:
$('a[id^=dataRevealLink]').each(function(){
var eventElemId = $(this).attr('id');
var eventElemIdNo = eventElemId.substring(14, eventElemId.length);
var actOnElem = $('#dataToReveal' +eventElemIdNo);
$(this).click(function() {
actOnElem.slideDown();
return false;
})
});
Cheers
On 4 Jul., 12:59, olsch01 wrote:
Hi,
I'm not a JS/jQuery expert, so as a quick test I added alert
(actOnElem); inside your $(eventElem).click( function(), and the
result always was #dataToReveal12.
As mentioned, I am not an expert and still learning myself, but I
think on dom ready the loop simply starts running until i equals 12.
And it's not until then, that the click function comes into play.
That's all I can say at the moment. If I have more time later, I will
look into this again.
Cheers
On 4 Jul., 03:59, bsenftner wrote:
Just learning _javascript_ & JQuery, but an experienced developer, I've
created a page with a series of elements that use the .slideDown() and
.slideUp() functions to reveal and hide the different areas of content on
the page.
To facilitate this, the page's html uses links with ids similar to: {
"dataRevealLink1", "dataToReveal1", "dataHideLink1" }. Clicking on a
"data-reveal-link" causes a .slideDown() animation on "data to reveal", with
appropriate reverse logic attached for the data hiding as well.
The page in question has 12 such sections, and writing the script long form
(no loops) works fine. However, I would like to generalize this logic, but
my first attempt at a loop to attach the DOM element callbacks does not
work, and I suspect it's a scoping issue with _javascript_:
for (var i = 1; i <= 12; i++) {
var eventElem = "#dataRevealLink" + i;
var actOnElem = "#dataToReveal" + i;
$(eventElem).click( function() {
$(actOnElem).slideDown();
return false; // prevents
the link from processing this click
});
}
I suspect that in the above logic, the mouse-click callback is attaching to
the dataRevealLink1-12 fine, however once inside the callback, "actOnElem"
is not what I'm expecting - possibly due to the scope of actOnElem? I'm not
entirely sure...
I've added console.log() calls to the above logic, and everything is as I
expect during the above looping, but I am never getting any of the callbacks
to run, so I can never see any console.log() output from inside a
mouse-click handler...
Any advice anyone?
--
View this message in context:http://www.nabble.com/JQuery-events-and-a-possible-scoping-error-on-m...
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Need help on How to load content via AJAX in jQuery
Thanks Charlie,
I'll put it in now. thanks.
E
On Jul 4, 2009, at 9:56 AM, Charlie wrote:
could shorten this all up and make it accessible for javascript
disabled by putting the url into the href of your links.
Haven't looked at plugin but since you're just loading html will use
load() in jQuery core:
hideLoading();
$("#cs_links a").click(function () {
showLoading();
$("#cst_wrap_mid").slideUp();
$("#cst_wrap_mid").load($(this).attr("href"), function(){
$("#cst_wrap_mid").slideUp();
hideLoading();
});
return false;
});
This would replace all of the switch cases. If javascript disabled
appropriate page would open from href. Likely find that load is very
fast and showloading may not be necessary
Erik R. Peterson wrote:
Can;t get it to work correctly.
Here is my existing code:
$(document).ready(function(){
//References
var sections = $("#cs_links a");
var loading = $("#loading");
var content = $("#cst_wrap_mid");
//Manage click events
sections.click(function(){
//show the loading bar
showLoading();
//load selected section
switch(this.id){
case "js_appoint":
content.slideUp();
content.load("/externals/appoint.htm", hideLoading);
content.slideDown();
break;
case "js_contact":
content.slideUp();
content.load("/externals/contact.htm", hideLoading);
content.slideDown();
break;
case "js_gifts":
content.slideUp();
content.load("/externals/gifts.htm", hideLoading);
content.slideDown();
break;
case "js_order":
content.slideUp();
content.load("/externals/order.htm", hideLoading);
content.slideDown();
break;
case "js_promise":
content.slideUp();
content.load("/externals/promise.htm", hideLoading);
content.slideDown();
break;
case "js_quest":
content.slideUp();
content.load("/externals/quest.htm", hideLoading);
content.slideDown();
break;
case "js_returns":
content.slideUp();
content.load("/externals/returns.htm", hideLoading);
content.slideDown();
break;
case "js_secure":
content.slideUp();
content.load("/externals/secure.htm", hideLoading);
content.slideDown();
break;
case "js_shipping":
content.slideUp();
content.load("/externals/shipping.htm", hideLoading);
content.slideDown();
break;
case "js_terms":
content.slideUp();
content.load("/externals/terms.htm", hideLoading);
content.slideDown();
break;
case "js_types":
content.slideUp();
content.load("/externals/types.htm", hideLoading);
content.slideDown();
break;
default:
//hide loading bar if there is no selected section
hideLoading();
break;
}
});
//show loading bar
function showLoading(){
loading
.css({visibility:"visible"})
.css({opacity:"1"})
.css({display:"block"})
;
}
//hide loading bar
function hideLoading(){
loading.fadeTo(1000, 0);
};
});
On Jul 4, 2009, at 6:40 AM, MOZ wrote:
Hi,
on your page: http://www.enaturalskin.com/needhelp.htm
each time the window scroll to the top because of anchor #, use
preventDefault(); to avoid this, just a suggestion.
Also see the improved version:
http://yensdesign.com/2009/06/safe-ajax-links-using-jquery/
This trick will make your website work though there is no
javascript.
-Beschi.
On Jul 4, 4:14 am, "Erik R. Peterson" wrote:
Hi buddy!
I'm undecided on the final buttons and graphics, but thanks to your
help I got the script down.
I actually fixed my own problem after posted this last email.
Have a great weekend.
Erik
On Jul 3, 2009, at 5:14 PM, Cesar Sanz wrote:
Hello.
I see you succed retrieving data using ajax,
Which is the problem?
- Original Message - From: "Erik R. Peterson"
To:
Sent: Friday, July 03, 2009 2:48 PM
Subject: [jQuery] Need help on How to load content via AJAX in
jQuery
I found this script:
http://yensdesign.com/2008/12/how-to-load-content-via-ajax-in-jquery/
I got it working, but it really looks bad in IE, along with
erros.
Any alternatives or sugestions?
Here is my page: http://www.enaturalskin.com/needhelp.htm
Many tha
[jQuery] Re: Need help on How to load content via AJAX in jQuery
could shorten this all up and make it accessible for _javascript_
disabled by putting the url into the href of your links.
Haven't looked at plugin but since you're just loading html will use
load() in jQuery core:
hideLoading();
$("#cs_links a").click(function () {
showLoading();
$("#cst_wrap_mid").slideUp();
$("#cst_wrap_mid").load($(this).attr("href"), function(){
$("#cst_wrap_mid").slideUp();
hideLoading();
});
return false;
});
This would replace all of the switch cases. If _javascript_ disabled
appropriate page would open from href. Likely find that load is very
fast and showloading may not be necessary
Erik R. Peterson wrote:
Can;t get it to work correctly.
Here is my existing code:
$(document).ready(function(){
//References
var sections = $("#cs_links a");
var loading = $("#loading");
var content = $("#cst_wrap_mid");
//Manage click events
sections.click(function(){
//show the loading bar
showLoading();
//load selected section
switch(this.id){
case "js_appoint":
content.slideUp();
content.load("/externals/appoint.htm", hideLoading);
content.slideDown();
break;
case "js_contact":
content.slideUp();
content.load("/externals/contact.htm", hideLoading);
content.slideDown();
break;
case "js_gifts":
content.slideUp();
content.load("/externals/gifts.htm", hideLoading);
content.slideDown();
break;
case "js_order":
content.slideUp();
content.load("/externals/order.htm", hideLoading);
content.slideDown();
break;
case "js_promise":
content.slideUp();
content.load("/externals/promise.htm", hideLoading);
content.slideDown();
break;
case "js_quest":
content.slideUp();
content.load("/externals/quest.htm", hideLoading);
content.slideDown();
break;
case "js_returns":
content.slideUp();
content.load("/externals/returns.htm", hideLoading);
content.slideDown();
break;
case "js_secure":
content.slideUp();
content.load("/externals/secure.htm", hideLoading);
content.slideDown();
break;
case "js_shipping":
content.slideUp();
content.load("/externals/shipping.htm", hideLoading);
content.slideDown();
break;
case "js_terms":
content.slideUp();
content.load("/externals/terms.htm", hideLoading);
content.slideDown();
break;
case "js_types":
content.slideUp();
content.load("/externals/types.htm", hideLoading);
content.slideDown();
break;
default:
//hide loading bar if there is no selected section
hideLoading();
break;
}
});
//show loading bar
function showLoading(){
loading
.css({visibility:"visible"})
.css({opacity:"1"})
.css({display:"block"})
;
}
//hide loading bar
function hideLoading(){
loading.fadeTo(1000, 0);
};
});
On Jul 4, 2009, at 6:40 AM, MOZ wrote:
Hi,
on your page: http://www.enaturalskin.com/needhelp.htm
each time the window scroll to the top because of anchor #, use
preventDefault(); to avoid this, just a suggestion.
Also see the improved version:
http://yensdesign.com/2009/06/safe-ajax-links-using-jquery/
This trick will make your website work though there is no _javascript_.
-Beschi.
On Jul 4, 4:14 am, "Erik R. Peterson" wrote:
Hi buddy!
I'm undecided on the final buttons and graphics, but thanks to your
help I got the script down.
I actually fixed my own problem after posted this last email.
Have a great weekend.
Erik
On Jul 3, 2009, at 5:14 PM, Cesar Sanz wrote:
Hello.
I see you
succed
[jQuery] Re: JQuery events and a possible scoping error on my part?
OK, I guess this is one possible solution:
$('a[id^=dataRevealLink]').each(function(){
var eventElemId = $(this).attr('id');
var eventElemIdNo = eventElemId.substring(14,
eventElemId.length);
var actOnElem = $('#dataToReveal' +eventElemIdNo);
$(this).click(function() {
actOnElem.slideDown();
return false;
})
});
Cheers
On 4 Jul., 12:59, olsch01 wrote:
> Hi,
>
> I'm not a JS/jQuery expert, so as a quick test I added alert
> (actOnElem); inside your $(eventElem).click( function(), and the
> result always was #dataToReveal12.
>
> As mentioned, I am not an expert and still learning myself, but I
> think on dom ready the loop simply starts running until i equals 12.
> And it's not until then, that the click function comes into play.
> That's all I can say at the moment. If I have more time later, I will
> look into this again.
>
> Cheers
>
> On 4 Jul., 03:59, bsenftner wrote:
>
> > Just learning Java Script & JQuery, but an experienced developer, I've
> > created a page with a series of elements that use the .slideDown() and
> > .slideUp() functions to reveal and hide the different areas of content on
> > the page.
>
> > To facilitate this, the page's html uses links with ids similar to: {
> > "dataRevealLink1", "dataToReveal1", "dataHideLink1" }. Clicking on a
> > "data-reveal-link" causes a .slideDown() animation on "data to reveal", with
> > appropriate reverse logic attached for the data hiding as well.
>
> > The page in question has 12 such sections, and writing the script long form
> > (no loops) works fine. However, I would like to generalize this logic, but
> > my first attempt at a loop to attach the DOM element callbacks does not
> > work, and I suspect it's a scoping issue with java script:
>
> > for (var i = 1; i <= 12; i++) {
> > var eventElem = "#dataRevealLink" + i;
> > var actOnElem = "#dataToReveal" + i;
>
> > $(eventElem).click( function() {
> > $(actOnElem).slideDown();
> > return false; // prevents
> > the link from processing this click
> > });
> > }
>
> > I suspect that in the above logic, the mouse-click callback is attaching to
> > the dataRevealLink1-12 fine, however once inside the callback, "actOnElem"
> > is not what I'm expecting - possibly due to the scope of actOnElem? I'm not
> > entirely sure...
>
> > I've added console.log() calls to the above logic, and everything is as I
> > expect during the above looping, but I am never getting any of the callbacks
> > to run, so I can never see any console.log() output from inside a
> > mouse-click handler...
>
> > Any advice anyone?
>
> > --
> > View this message in
> > context:http://www.nabble.com/JQuery-events-and-a-possible-scoping-error-on-m...
> > Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Need help on How to load content via AJAX in jQuery
Can;t get it to work correctly.
Here is my existing code:
$(document).ready(function(){
//References
var sections = $("#cs_links a");
var loading = $("#loading");
var content = $("#cst_wrap_mid");
//Manage click events
sections.click(function(){
//show the loading bar
showLoading();
//load selected section
switch(this.id){
case "js_appoint":
content.slideUp();
content.load("/externals/appoint.htm",
hideLoading);
content.slideDown();
break;
case "js_contact":
content.slideUp();
content.load("/externals/contact.htm",
hideLoading);
content.slideDown();
break;
case "js_gifts":
content.slideUp();
content.load("/externals/gifts.htm",
hideLoading);
content.slideDown();
break;
case "js_order":
content.slideUp();
content.load("/externals/order.htm",
hideLoading);
content.slideDown();
break;
case "js_promise":
content.slideUp();
content.load("/externals/promise.htm",
hideLoading);
content.slideDown();
break;
case "js_quest":
content.slideUp();
content.load("/externals/quest.htm",
hideLoading);
content.slideDown();
break;
case "js_returns":
content.slideUp();
content.load("/externals/returns.htm",
hideLoading);
content.slideDown();
break;
case "js_secure":
content.slideUp();
content.load("/externals/secure.htm",
hideLoading);
content.slideDown();
break;
case "js_shipping":
content.slideUp();
content.load("/externals/shipping.htm",
hideLoading);
content.slideDown();
break;
case "js_terms":
content.slideUp();
content.load("/externals/terms.htm",
hideLoading);
content.slideDown();
break;
case "js_types":
content.slideUp();
content.load("/externals/types.htm",
hideLoading);
content.slideDown();
break;
default:
//hide loading bar if there is no selected
section
hideLoading();
break;
}
});
//show loading bar
function showLoading(){
loading
.css({visibility:"visible"})
.css({opacity:"1"})
.css({display:"block"})
;
}
//hide loading bar
function hideLoading(){
loading.fadeTo(1000, 0);
};
});
On Jul 4, 2009, at 6:40 AM, MOZ wrote:
Hi,
on your page: http://www.enaturalskin.com/needhelp.htm
each time the window scroll to the top because of anchor #, use
preventDefault(); to avoid this, just a suggestion.
Also see the improved version:
http://yensdesign.com/2009/06/safe-ajax-links-using-jquery/
This trick will make your website work though there is no javascript.
-Beschi.
On Jul 4, 4:14 am, "Erik R. Peterson" wrote:
Hi buddy!
I'm undecided on the final buttons and graphics, but thanks to your
help I got the script down.
I actually fixed my own problem after posted this last email.
Have a great weekend.
Erik
On Jul 3, 2009, at 5:14 PM, Cesar Sanz wrote:
Hello.
I see you succed retrieving data using ajax,
Which is the problem?
- Origina
[jQuery] Re: Need help on How to load content via AJAX in jQuery
Works great... Would you be able to show me how to make the links change via css after selected? Erik On Jul 4, 2009, at 6:40 AM, MOZ wrote: Hi, on your page: http://www.enaturalskin.com/needhelp.htm each time the window scroll to the top because of anchor #, use preventDefault(); to avoid this, just a suggestion. Also see the improved version: http://yensdesign.com/2009/06/safe-ajax-links-using-jquery/ This trick will make your website work though there is no javascript. -Beschi. On Jul 4, 4:14 am, "Erik R. Peterson" wrote: Hi buddy! I'm undecided on the final buttons and graphics, but thanks to your help I got the script down. I actually fixed my own problem after posted this last email. Have a great weekend. Erik On Jul 3, 2009, at 5:14 PM, Cesar Sanz wrote: Hello. I see you succed retrieving data using ajax, Which is the problem? - Original Message - From: "Erik R. Peterson" To: Sent: Friday, July 03, 2009 2:48 PM Subject: [jQuery] Need help on How to load content via AJAX in jQuery I found this script: http://yensdesign.com/2008/12/how-to-load-content-via-ajax-in-jquery/ I got it working, but it really looks bad in IE, along with erros. Any alternatives or sugestions? Here is my page: http://www.enaturalskin.com/needhelp.htm Many thanks. Erik
[jQuery] Re: jQuery MultiFile Upload with ASP.NET
I've got some working VB.NET code here using that great plugin: http://www.morningz.com/?p=5 It's easy enough to convert to C#, just make sure the folder you are saving to has "Write" permissions for the Server's "NETWORK SERVICE" account On Jul 3, 11:19 pm, PsychoCoder wrote: > I'm learning more and more about jQuery and am really enjoying what I > can do with it. I'm working on a multiple file uploader in ASP.NET w/ > C# and am looking for advice (or good tutorials) on uploading multiple > files using the jQuery MultiFile plugin. I've seen examples using it > with a single file, but how can I go about accomplishing this with > multiple files? > > Anyone got any good examples on using this plugin in ASP.NET?
[jQuery] Re: Slide in / out message
Test Object
$(function() {
$(".obj").slideUp(0); // initial state
$(".obj").slideDown(500);
setTimeout(function() {
$(".obj").slideUp(500);
}, 5000);
});
On Sat, Jul 4, 2009 at 2:26 PM, Snaak wrote:
>
> Hi all,
> I try to make a div to slide down, pauze for 5 seconds and then slide
> up. This is meant for showing a message. Just like the Twitter
> interface. But I cannot get it working. Anyone an good idea?
> Thx in advance!
>
> Current code:
> $(".testbutton").click(function () {
> $('#test').slideDown( 'slow' );
>timer = setTimeout('$(".testbutton").click()',500);
>$('#test').slideUp( 'slow' );
>return false;
>});
>
[jQuery] Re: Initial Setup
Thanks, very helpful -- three more questions: * Is there documentation covering basic questions like these? * Can I reference the latest version, if so what would be the URL? * Can I also hotlink to plugins? For example I want to use TreeView, what would be the URL for that .js file? I've tried various URLs to do both, but not found one that works. Andrew On Jul 3, 3:49 pm, Pyrolupus wrote: > On Fri, Jul 3, 2009 at 8:51 AM, Andrew wrote: > > I'm new to JavaScript -- and cannot get jQuery to work (unless I > > accesshttp://code.jquery.com/jquery-latest.js) > > ... > > * my hosting service does doesn't have gzip compression enabled -- > > what file do I need to install on my server if I don't have GZIP > > available? > > If you want/need to "hotlink" to jQuery on a remote server, it's > better to use ajax.googleapis.com. For example: > > http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js > > That will pull the "minimized" (comments and whitespace stripped == > smaller download) 1.3.2 version of jQuery from Google. Google DOES > GZip these files, which is useful if you can't get it gzipped on your > hosting service.
[jQuery] Slide in / out message
Hi all,
I try to make a div to slide down, pauze for 5 seconds and then slide
up. This is meant for showing a message. Just like the Twitter
interface. But I cannot get it working. Anyone an good idea?
Thx in advance!
Current code:
$(".testbutton").click(function () {
$('#test').slideDown( 'slow' );
timer = setTimeout('$(".testbutton").click()',500);
$('#test').slideUp( 'slow' );
return false;
});
[jQuery] [Jquery parent window's table]
Hai,
I want to change the parent windows table from popup window.
I used window.open to open a popup window.
when i click a button in popup window i want to assign some value in
parent windows table (cell).
function resetIndex(res){
$i("index").value=res.parentNode.parentNode.rowIndex;
window.open("./
employee.html","mywindow","status=0,height=400,width=500,location=0,toolbar=0,scrollbars=1,modal=yes");
}
UserID
employeeList.html
function getEmployeeCode(){
//alert($(parent.document).find('#t').html("s"));
I want to change parent windows table from here.
}
[jQuery] Re: JQuery events and a possible scoping error on my part?
Hi,
I'm not a JS/jQuery expert, so as a quick test I added alert
(actOnElem); inside your $(eventElem).click( function(), and the
result always was #dataToReveal12.
As mentioned, I am not an expert and still learning myself, but I
think on dom ready the loop simply starts running until i equals 12.
And it's not until then, that the click function comes into play.
That's all I can say at the moment. If I have more time later, I will
look into this again.
Cheers
On 4 Jul., 03:59, bsenftner wrote:
> Just learning Java Script & JQuery, but an experienced developer, I've
> created a page with a series of elements that use the .slideDown() and
> .slideUp() functions to reveal and hide the different areas of content on
> the page.
>
> To facilitate this, the page's html uses links with ids similar to: {
> "dataRevealLink1", "dataToReveal1", "dataHideLink1" }. Clicking on a
> "data-reveal-link" causes a .slideDown() animation on "data to reveal", with
> appropriate reverse logic attached for the data hiding as well.
>
> The page in question has 12 such sections, and writing the script long form
> (no loops) works fine. However, I would like to generalize this logic, but
> my first attempt at a loop to attach the DOM element callbacks does not
> work, and I suspect it's a scoping issue with java script:
>
> for (var i = 1; i <= 12; i++) {
> var eventElem = "#dataRevealLink" + i;
> var actOnElem = "#dataToReveal" + i;
>
> $(eventElem).click( function() {
> $(actOnElem).slideDown();
> return false; // prevents
> the link from processing this click
> });
> }
>
> I suspect that in the above logic, the mouse-click callback is attaching to
> the dataRevealLink1-12 fine, however once inside the callback, "actOnElem"
> is not what I'm expecting - possibly due to the scope of actOnElem? I'm not
> entirely sure...
>
> I've added console.log() calls to the above logic, and everything is as I
> expect during the above looping, but I am never getting any of the callbacks
> to run, so I can never see any console.log() output from inside a
> mouse-click handler...
>
> Any advice anyone?
>
> --
> View this message in
> context:http://www.nabble.com/JQuery-events-and-a-possible-scoping-error-on-m...
> Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Need help on How to load content via AJAX in jQuery
Hi, on your page: http://www.enaturalskin.com/needhelp.htm each time the window scroll to the top because of anchor #, use preventDefault(); to avoid this, just a suggestion. Also see the improved version: http://yensdesign.com/2009/06/safe-ajax-links-using-jquery/ This trick will make your website work though there is no javascript. -Beschi. On Jul 4, 4:14 am, "Erik R. Peterson" wrote: > Hi buddy! > > I'm undecided on the final buttons and graphics, but thanks to your > help I got the script down. > > I actually fixed my own problem after posted this last email. > > Have a great weekend. > > Erik > > On Jul 3, 2009, at 5:14 PM, Cesar Sanz wrote: > > > > > Hello. > > > I see you succed retrieving data using ajax, > > > Which is the problem? > > > - Original Message - From: "Erik R. Peterson" > > To: > > Sent: Friday, July 03, 2009 2:48 PM > > Subject: [jQuery] Need help on How to load content via AJAX in jQuery > > >> I found this script: > >>http://yensdesign.com/2008/12/how-to-load-content-via-ajax-in-jquery/ > >> I got it working, but it really looks bad in IE, along with erros. > >> Any alternatives or sugestions? > >> Here is my page: http://www.enaturalskin.com/needhelp.htm > >> Many thanks. > >> Erik
[jQuery] Inclusion of external scripts ("best" approach)
Hi, I guess most of you are aware of the peformance tip: put JavaScript at the bottom of the page. Now, what I have seen on quite a few pages is that the jquery.js is placed in the header, and a file with all the code inside $ (document).ready somewhere before the tag. What are the benefits of this approach? Why not putting both files at the bottom, and maybe even merging them into one file to be placed at the bottom (which would also mean that you have one http request less)? One explanation I was thinking about: If you put both scripts at the bottom, the page renders faster, but the delay until certain functionality is available, elements get hidden etc. is greater compared to having the library in the head and the $(document).ready script at the bottom. So it would be a compromise between page loading time and availability of functionality on the page. Could this be a possible reason, or I am being on the wrong track here? :) Cheers
[jQuery] Re: ajax post not sending header
No iframes for me... It's injected into plain old div.
On Jul 4, 11:39 am, waseem sabjee wrote:
> question are you injecting the data into and html element such as div, td, p
> etc or into an iframe ?
>
> On Sat, Jul 4, 2009 at 10:35 AM, hadaraz wrote:
>
> > ok, I found the problem. I didn't see it before because a) it's my
> > first time with jquery, and b) I'm an idiot.
> > Earlier I said I use .load(...) and it works fine. Now the form I'm
> > trying to attach the ajax post to get's loaded by that load call, so
> > it is not available yet on document.ready. It's a classic n00b error.
> > This is the former situation:
>
> > $(function() {
>
> > $('#formdiv').load('/form/url/'); // <-- '#emailform' is
> > loaded here
>
> > $('#emailform').submit(function() {
> > $.ajax({
> > ...
> > ...
> > });
> > return false;
> > });
> > });
>
> > Of-coarse it won't work, there is no '#emailform' yet to bind the ajax
> > call to. The later code:
>
> > $(function() {
>
> > var bindForm = function() {
> > $('#emailform').submit(function() {
> > $.ajax({
> > ...
> > ...
> > });
> > return false;
> > });
> > }
>
> > $('#formdiv').load('/form/url/', bindForm); // <--
> > '#emailform' is loaded here, and binded with ajax call
>
> > });
>
> > The later version works fine. Thanks to the next urls I found the
> > answer:
> >http://docs.jquery.com/Tutorials:AJAX_and_Events
> >http://docs.jquery.com/Ajax/load#urldatacallback
>
> > Thank you James for the help, it led me to the right direction.
>
> > On Jul 3, 11:31 am, hadaraz wrote:
> > > I see the post request, but it is not ajax: the header is missing,
> > > and it is not listed in XHR section in firebug.
> > > Is there another way of disabling the submit action and turning it
> > > into ajax request? maybe that's my problem?
>
> > > On Jul 3, 3:26 am, James wrote:
>
> > > > Earlier when you said:
> > > > I have used firebug, and there is no sign of AJAX request.
>
> > > > Did that mean there was no sign of the AJAX request firing, or no sign
> > > > of the X-Requested-With header?
> > > > Also try using a locally hosted version of jQuery 1.3.2 instead of
> > > > Google's. But I doubt that's the problem.
>
> > > > On Jul 2, 1:50 pm, hadaraz wrote:
>
> > > > > I forgot to mention that on the same page I have
> > $('#loadit').load('/
> > > > > load/url/') and it works fine, so the problem is only with post.
>
> > > > > On Jul 2, 5:32 pm, hadaraz wrote:
>
> > > > > > Nop, it is the same...
>
> > > > > > On 2 יולי, 00:17, James wrote:
>
> > > > > > > Hmm...
>
> > > > > > > What happens if you add:
> > > > > > > type: "POST"
>
> > > > > > > in your AJAX options?
>
> > > > > > > On Jul 1, 10:36 am, hadaraz wrote:
>
> > > > > > > > I have used firebug, and there is no sign of AJAX request.
>
> > > > > > > > On the server side I use python, and yes, I'm checking for
> > > > > > > > 'HTTP_X_REQUESTED_WITH'. Maybe there is a problem with the
> > jquery
> > > > > > > > 1.3.2 (which is what I use, linked from google ajax libs)?
>
> > > > > > > > On Jul 1, 9:21 pm, James wrote:
>
> > > > > > > > > Have you tried using Firebug for Firefox to examine the
> > headers of the
> > > > > > > > > AJAX request to be sure that it wasn't sent? Check that
> > first.
>
> > > > > > > > > You might be reading the headers incorrectly on the PHP side.
> > Are you
> > > > > > > > > using: $_SERVER['HTTP_X_REQUESTED_WITH']
> > > > > > > > > The beginning HTTP_ part is the tricky part. Make sure you
> > have that.
>
> > > > > > > > > On Jun 30, 9:52 pm, hadaraz wrote:
>
> > > > > > > > > > Posting data from a form using this function:
>
> > > > > > > > > > $(function() {
> > > > > > > > > > $('#emailform').submit(function() {
> > > > > > > > > > $.ajax({
> > > > > > > > > > url: '/post/url/',
> > > > > > > > > > dataType: 'json',
> > > > > > > > > > data: $('#emailform').serialize(),
> > > > > > > > > > success: function(rdata) {
>
> > $('#emailformmessage').text(rdata.message).show
> > > > > > > > > > ('slow');
> > > > > > > > > > }
> > > > > > > > > > });
> > > > > > > > > > });
> > > > > > > > > > return false;
>
> > > > > > > > > > });
>
> > > > > > > > > > the server doesn't detect an ajax call ('X-Requested-With'
> > header is
> > > > > > > > > > not sent). I tried forcing it with beforeSubmit and also
> > with
> > > > > > > > > > ajaxSetup, but no go.
> > > > > > > > > > Any solutions to this problem?
>
> > > > > > > > > > hadaraz-הסתר טקסט מצוטט-
>
> > > > > > > -הראה טקסט מצוטט-
[jQuery] Re: ajax post not sending header
question are you injecting the data into and html element such as div, td, p
etc or into an iframe ?
On Sat, Jul 4, 2009 at 10:35 AM, hadaraz wrote:
>
> ok, I found the problem. I didn't see it before because a) it's my
> first time with jquery, and b) I'm an idiot.
> Earlier I said I use .load(...) and it works fine. Now the form I'm
> trying to attach the ajax post to get's loaded by that load call, so
> it is not available yet on document.ready. It's a classic n00b error.
> This is the former situation:
>
> $(function() {
>
>$('#formdiv').load('/form/url/'); // <-- '#emailform' is
> loaded here
>
>$('#emailform').submit(function() {
>$.ajax({
>...
>...
>});
>return false;
>});
> });
>
> Of-coarse it won't work, there is no '#emailform' yet to bind the ajax
> call to. The later code:
>
> $(function() {
>
>var bindForm = function() {
>$('#emailform').submit(function() {
>$.ajax({
>...
>...
>});
>return false;
>});
>}
>
>$('#formdiv').load('/form/url/', bindForm); // <--
> '#emailform' is loaded here, and binded with ajax call
>
> });
>
> The later version works fine. Thanks to the next urls I found the
> answer:
> http://docs.jquery.com/Tutorials:AJAX_and_Events
> http://docs.jquery.com/Ajax/load#urldatacallback
>
> Thank you James for the help, it led me to the right direction.
>
>
> On Jul 3, 11:31 am, hadaraz wrote:
> > I see the post request, but it is not ajax: the header is missing,
> > and it is not listed in XHR section in firebug.
> > Is there another way of disabling the submit action and turning it
> > into ajax request? maybe that's my problem?
> >
> > On Jul 3, 3:26 am, James wrote:
> >
> > > Earlier when you said:
> > > I have used firebug, and there is no sign of AJAX request.
> >
> > > Did that mean there was no sign of the AJAX request firing, or no sign
> > > of the X-Requested-With header?
> > > Also try using a locally hosted version of jQuery 1.3.2 instead of
> > > Google's. But I doubt that's the problem.
> >
> > > On Jul 2, 1:50 pm, hadaraz wrote:
> >
> > > > I forgot to mention that on the same page I have
> $('#loadit').load('/
> > > > load/url/') and it works fine, so the problem is only with post.
> >
> > > > On Jul 2, 5:32 pm, hadaraz wrote:
> >
> > > > > Nop, it is the same...
> >
> > > > > On 2 יולי, 00:17, James wrote:
> >
> > > > > > Hmm...
> >
> > > > > > What happens if you add:
> > > > > > type: "POST"
> >
> > > > > > in your AJAX options?
> >
> > > > > > On Jul 1, 10:36 am, hadaraz wrote:
> >
> > > > > > > I have used firebug, and there is no sign of AJAX request.
> >
> > > > > > > On the server side I use python, and yes, I'm checking for
> > > > > > > 'HTTP_X_REQUESTED_WITH'. Maybe there is a problem with the
> jquery
> > > > > > > 1.3.2 (which is what I use, linked from google ajax libs)?
> >
> > > > > > > On Jul 1, 9:21 pm, James wrote:
> >
> > > > > > > > Have you tried using Firebug for Firefox to examine the
> headers of the
> > > > > > > > AJAX request to be sure that it wasn't sent? Check that
> first.
> >
> > > > > > > > You might be reading the headers incorrectly on the PHP side.
> Are you
> > > > > > > > using: $_SERVER['HTTP_X_REQUESTED_WITH']
> > > > > > > > The beginning HTTP_ part is the tricky part. Make sure you
> have that.
> >
> > > > > > > > On Jun 30, 9:52 pm, hadaraz wrote:
> >
> > > > > > > > > Posting data from a form using this function:
> >
> > > > > > > > > $(function() {
> > > > > > > > > $('#emailform').submit(function() {
> > > > > > > > > $.ajax({
> > > > > > > > > url: '/post/url/',
> > > > > > > > > dataType: 'json',
> > > > > > > > > data: $('#emailform').serialize(),
> > > > > > > > > success: function(rdata) {
> > > > > > > > >
> $('#emailformmessage').text(rdata.message).show
> > > > > > > > > ('slow');
> > > > > > > > > }
> > > > > > > > > });
> > > > > > > > > });
> > > > > > > > > return false;
> >
> > > > > > > > > });
> >
> > > > > > > > > the server doesn't detect an ajax call ('X-Requested-With'
> header is
> > > > > > > > > not sent). I tried forcing it with beforeSubmit and also
> with
> > > > > > > > > ajaxSetup, but no go.
> > > > > > > > > Any solutions to this problem?
> >
> > > > > > > > > hadaraz-הסתר טקסט מצוטט-
> >
> > > > > > -הראה טקסט מצוטט-
[jQuery] Re: ajax post not sending header
ok, I found the problem. I didn't see it before because a) it's my
first time with jquery, and b) I'm an idiot.
Earlier I said I use .load(...) and it works fine. Now the form I'm
trying to attach the ajax post to get's loaded by that load call, so
it is not available yet on document.ready. It's a classic n00b error.
This is the former situation:
$(function() {
$('#formdiv').load('/form/url/'); // <-- '#emailform' is
loaded here
$('#emailform').submit(function() {
$.ajax({
...
...
});
return false;
});
});
Of-coarse it won't work, there is no '#emailform' yet to bind the ajax
call to. The later code:
$(function() {
var bindForm = function() {
$('#emailform').submit(function() {
$.ajax({
...
...
});
return false;
});
}
$('#formdiv').load('/form/url/', bindForm); // <--
'#emailform' is loaded here, and binded with ajax call
});
The later version works fine. Thanks to the next urls I found the
answer:
http://docs.jquery.com/Tutorials:AJAX_and_Events
http://docs.jquery.com/Ajax/load#urldatacallback
Thank you James for the help, it led me to the right direction.
On Jul 3, 11:31 am, hadaraz wrote:
> I see the post request, but it is not ajax: the header is missing,
> and it is not listed in XHR section in firebug.
> Is there another way of disabling the submit action and turning it
> into ajax request? maybe that's my problem?
>
> On Jul 3, 3:26 am, James wrote:
>
> > Earlier when you said:
> > I have used firebug, and there is no sign of AJAX request.
>
> > Did that mean there was no sign of the AJAX request firing, or no sign
> > of the X-Requested-With header?
> > Also try using a locally hosted version of jQuery 1.3.2 instead of
> > Google's. But I doubt that's the problem.
>
> > On Jul 2, 1:50 pm, hadaraz wrote:
>
> > > I forgot to mention that on the same page I have $('#loadit').load('/
> > > load/url/') and it works fine, so the problem is only with post.
>
> > > On Jul 2, 5:32 pm, hadaraz wrote:
>
> > > > Nop, it is the same...
>
> > > > On 2 יולי, 00:17, James wrote:
>
> > > > > Hmm...
>
> > > > > What happens if you add:
> > > > > type: "POST"
>
> > > > > in your AJAX options?
>
> > > > > On Jul 1, 10:36 am, hadaraz wrote:
>
> > > > > > I have used firebug, and there is no sign of AJAX request.
>
> > > > > > On the server side I use python, and yes, I'm checking for
> > > > > > 'HTTP_X_REQUESTED_WITH'. Maybe there is a problem with the jquery
> > > > > > 1.3.2 (which is what I use, linked from google ajax libs)?
>
> > > > > > On Jul 1, 9:21 pm, James wrote:
>
> > > > > > > Have you tried using Firebug for Firefox to examine the headers
> > > > > > > of the
> > > > > > > AJAX request to be sure that it wasn't sent? Check that first.
>
> > > > > > > You might be reading the headers incorrectly on the PHP side. Are
> > > > > > > you
> > > > > > > using: $_SERVER['HTTP_X_REQUESTED_WITH']
> > > > > > > The beginning HTTP_ part is the tricky part. Make sure you have
> > > > > > > that.
>
> > > > > > > On Jun 30, 9:52 pm, hadaraz wrote:
>
> > > > > > > > Posting data from a form using this function:
>
> > > > > > > > $(function() {
> > > > > > > > $('#emailform').submit(function() {
> > > > > > > > $.ajax({
> > > > > > > > url: '/post/url/',
> > > > > > > > dataType: 'json',
> > > > > > > > data: $('#emailform').serialize(),
> > > > > > > > success: function(rdata) {
> > > > > > > > $('#emailformmessage').text(rdata.message).show
> > > > > > > > ('slow');
> > > > > > > > }
> > > > > > > > });
> > > > > > > > });
> > > > > > > > return false;
>
> > > > > > > > });
>
> > > > > > > > the server doesn't detect an ajax call ('X-Requested-With'
> > > > > > > > header is
> > > > > > > > not sent). I tried forcing it with beforeSubmit and also with
> > > > > > > > ajaxSetup, but no go.
> > > > > > > > Any solutions to this problem?
>
> > > > > > > > hadaraz-הסתר טקסט מצוטט-
>
> > > > > -הראה טקסט מצוטט-
[jQuery] Re: 2 different ways of doing the same thing?
>Would this not be 2 different ways to do the same thing?
Yes and no.
The first finds all inputs and excludes checkboxes, returning the
result in the jQuery object.
The second finds all inputs and returns them to the jQuery object,
then excludes those that are checkboxes.
WIth the latter, you can chain .end() and revert to the original
selection of all inputs including checkboxes.
On Jul 2, 9:11 am, expresso wrote:
> Would this not be 2 different ways to do the same thing?
>
> $('input:not(:checkbox));
>
> vs.
>
> $('input').not(:checkbox);
[jQuery] Re: 2 different ways of doing the same thing?
Yes and no. The first filters out all inputs that are not checkboxes
before returning the jQuery object.
The second returns all inputs, including checkboxes, and then filters
out those that aren't checkboxes.
The difference is that with the latter, you can operate on the
filtered result, for example adding a css style, and then chain .end()
to revert to the original selection of all inputs and work with them.
On Jul 2, 9:11 am, expresso wrote:
> Would this not be 2 different ways to do the same thing?
>
> $('input:not(:checkbox));
>
> vs.
>
> $('input').not(:checkbox);
[jQuery] Re: 2 different ways of doing the same thing?
Just like $('div span') == $('div').find('span') and $('div > span')
== $('div').children('span') and so on. Options == good :)
On Jul 2, 1:11 pm, expresso wrote:
> Would this not be 2 different ways to do the same thing?
>
> $('input:not(:checkbox));
>
> vs.
>
> $('input').not(:checkbox);
[jQuery] Re: how to display sortable list with new order
and from the data structure mentioned above
we retrieve the rows holding two key field
position and html
$(function() {
// we just create our items object
var items = [];
// create an array to hold our positions
item.position = new Array();
// create an array to hold our html
item.html = new Array();
/* SERVER SIDE SCRIPT HERE
you should use your php or asp script to retrieve your data
$int i = 0;
start of server side foreach
*/
// javascript between server side script
// just populate our JavaScript arrays with data
item.position[] = position; ?>;
item.html[] = html; ?> ;
/* SERVER SIDE SCRIPT HERE
i++
end of server side foreach
*/
// we just do a for loop to fill our html list items with the correct html
:)
for(var i = 0; i < item.position.length; i++) {// if i is less then amount
of items in array increment i
$("." + item.position[i]).html(item.html[i]);
/*
if the item position was position one then html relating to that position
will be filled in
*/
}
// now we just unhide our list items
$("..listitem").show();
});
/* this style initially hides all our items */
.listitem {
display:none;
}
On Sat, Jul 4, 2009 at 9:12 AM, cs...@hotmail.com wrote:
>
> hi waseem, thx for your idea and really appreciate for doing it. what
> i want to know is how to display these toolbars-"div"s base on
> retrieved data from database.
> for example:
> orginal order
> div id=1 class=1
> div id=2 class=2
> div id=3 class=3
> assume i retrieved data from database is array,which contains the
> customised order "3","1","2"
>
> how to display divs like this?
> div id=3 class=3
> div id=1 class=1
> div id=2 class=2
>
>
> On Jul 4, 2:04 pm, waseem sabjee wrote:
> > lets just see the logic behind this.
> >
> >
> > item
> >
> >
> >
> > item
> >
> >
> >
> > item
> >
> >
> >
> > item
> >
> >
> > say we have item as mentioned above.
> > METHOD 1
> > --
> > save to database :
> > your table would be like so
> >
> > if you are using MYSQL
> > ID INT(11) NOT NULL auto_increment,
> > userID INT(11) NOT NULL,
> > position TEXT NOT NULL,
> > html TEXT NOT NULL
> >
> > if you are using SQL SERVER
> > ID INT NOT NULL -- set identifier to yes and set increment to 1
> > userID INT NOT NULL,
> > position VARCHAR(max) NOT NULL,
> > html VARCHAR(max) NOT NULL
> >
> > for both cases index ID as Primary Key
> > non clustered index on position
> > non clustered index on html
> > my idea is to save the html of a specific position to the db and refill
> the
> > positions based on this
> > note i used classes such as position1, position2 to identify my locations
> > I have created one table that will keep track of the positions for each
> user
> >
> > if you do not want to use a database you can use cookies :)
> > your cookies would be :
> > position, html
> > same type of logic
> >
> > On Sat, Jul 4, 2009 at 3:39 AM, cs...@hotmail.com <
> cs3p...@googlemail.com>wrote:
> >
> >
> >
> > > Hi all:
> >
> > > i am trying to use jquery UI sortable on my webpage to display
> > > toolbars. what i want is, let people sort these toolbars in the way
> > > they like. i have named toolbars with id "1","2","3","4", and i saved
> > > sorted order to database via toArray method. i was wondering how i
> > > could display these toolbars with new order when people browser my
> > > site next time, is there any method that supports it?
> >
> > > i am really appreciate for your help, thx in advance
> >
> > > andy
>
[jQuery] Re: how to display sortable list with new order
hi waseem, thx for your idea and really appreciate for doing it. what i want to know is how to display these toolbars-"div"s base on retrieved data from database. for example: orginal order div id=1 class=1 div id=2 class=2 div id=3 class=3 assume i retrieved data from database is array,which contains the customised order "3","1","2" how to display divs like this? div id=3 class=3 div id=1 class=1 div id=2 class=2 On Jul 4, 2:04 pm, waseem sabjee wrote: > lets just see the logic behind this. > > > item > > > > item > > > > item > > > > item > > > say we have item as mentioned above. > METHOD 1 > -- > save to database : > your table would be like so > > if you are using MYSQL > ID INT(11) NOT NULL auto_increment, > userID INT(11) NOT NULL, > position TEXT NOT NULL, > html TEXT NOT NULL > > if you are using SQL SERVER > ID INT NOT NULL -- set identifier to yes and set increment to 1 > userID INT NOT NULL, > position VARCHAR(max) NOT NULL, > html VARCHAR(max) NOT NULL > > for both cases index ID as Primary Key > non clustered index on position > non clustered index on html > my idea is to save the html of a specific position to the db and refill the > positions based on this > note i used classes such as position1, position2 to identify my locations > I have created one table that will keep track of the positions for each user > > if you do not want to use a database you can use cookies :) > your cookies would be : > position, html > same type of logic > > On Sat, Jul 4, 2009 at 3:39 AM, cs...@hotmail.com > wrote: > > > > > Hi all: > > > i am trying to use jquery UI sortable on my webpage to display > > toolbars. what i want is, let people sort these toolbars in the way > > they like. i have named toolbars with id "1","2","3","4", and i saved > > sorted order to database via toArray method. i was wondering how i > > could display these toolbars with new order when people browser my > > site next time, is there any method that supports it? > > > i am really appreciate for your help, thx in advance > > > andy
