[jQuery] Help: Iterate through unknown number of elements, apply function
Hey there, newbie here...
Still getting a grasp on jQuery, so I'm probably overthinking or extra-
typing...
Anyway, I have 2 select boxes. I can populate SelectA with items from
a database, move the items from selectA to selectB and back again by
clicking add and remove...
BASIC CODE (HTML):
div
select multiple id=selectA
?php
//populate with database information
?
/select
add
/div
div
select multiple id=selectB/select
remove
/div
(JQUERY):
$(document).ready(function(){
$('#add').click(function() {
return !$('#selectA
option:selected').remove().appendTo('#selectB');
});
$('#remove').click(function() {
return !$('#selectB
option:selected').remove().appendTo('#selectA');
});
});
THE ABOVE SITUATION WORKS...
What I want to do is generate a set of these selects for each
category in my database. I can do that through php and the use of a
counter I get selectA_.$ctr, selectB_.$ctr, add.$ctr, and
remove.$ctr as I should (i.e. first set of generated boxes would have
the elements: selectA_1, selectB_1, add1, and remove1). BUT I have to
add the click functions in the document ready function to this unknown
number of elements, so I'm trying my first jQuery each statement -
without any luck
HERE IT IS sorry if I butchered it... #input4 is the name of the
form I have this scenario in...
$(#input4).find(select).each(function(i){
var addButton = #add+i
var selectA = #selectA_+i+ option:selected;
var B = #selectB_+i;
$('+addButton+').click(function() {
return !$('+selectA+ ').remove().appendTo('+B
+');
});
var removeButton = #remove+i
var selectB = #selectB_+i+ option:selected;
var A = #selectA_+i;
$('+removeButton+').click(function() {
return !$('+selectB+ ').remove().appendTo('+A
+');
});
});
I'm a little lost at the moment and you could say overwhelmed. I just
need a little bump in the right direction to regain my get up and
go.
Thanks in advance.
[jQuery] Re: Sortable list - even when list is changed
Hi , please check this: http://jsbin.com/oququ3/6/edit As you can see: - sortable list works - accordion works ...but: - POPUP 'update' does not come what could be wrong here? regards Rafal
[jQuery] Re: Sortable list - even when list is changed
Hi , please check this: http://jsbin.com/oququ3/6/edit As you can see: - sortable list works - accordion works ...but: - POPUP 'update' does not come what could be wrong here? regards Rafal
[jQuery] Re: Sortable list - even when list is changed
Hi , please check this: http://jsbin.com/oququ3/6/edit As you can see: - sortable list works - accordion works ...but: - POPUP 'update' does not come what could be wrong here? regards Rafal
[jQuery] Re: Sortable list - even when list is changed
Hi , please check this: http://jsbin.com/oququ3/6/edit As you can see: - sortable list works - accordion works ...but: - POPUP 'update' does not come what could be wrong here? regards Rafal
Re: [jQuery] Re: Sortable list - even when list is changed
In your example, you have two calls to $('#elements').sortable().
The second one has the update event added, but the first (the one which
creates the sortable) doesn't. If you add the update handler to the
first call, it works OK.
on 23/02/2010 08:26 rafald said::
Hi ,
please check this:
http://jsbin.com/oququ3/6/edit
As you can see:
- sortable list works
- accordion works
...but:
- POPUP 'update' does not come
what could be wrong here?
regards
Rafal
[jQuery] Re: Sortable list - even when list is changed
Hi Peter, Indeed! It works ;-) THANKS! It was enough to remove line with $(#elements).sortable(); So, what is the right place to put: $(#elements).sortable(); ? in my example: the first place was outside $(document).ready(function() the second place (where I added event) was inside $ (document).ready(function() What are the rules here and what will be difference if I put inside or outside ? Could you please explain this to me ? regards Rafal
[jQuery] Send XML to the server gets Type Mismatch error in IE, though works fine with Firefox
Hi When I checked the google forum for jQuery I was told its not monitored anymore. Instead of this another forum is proposed. So few days ago I created a post here: http://forum.jquery.com/topic/send-xml-to-the-server-gets-type-mismatch-error-in-ie-though-works-fine-with-firefox This is for the problem with XML Unfortunatelly nobody replied. Maybe on this forum is somebody who knows how to send XML file to the server without errors ? Thank you in advance for all sugestions. Regards Rafal
Re: [jQuery] Re: Sortable list - even when list is changed
No problem,
$(document).ready(function(){
});
and
$(function(){
});
are the same - both will run whatever you have in them when the DOM is
ready - the second is just a kind of shorthand for the (much easier to
read) first. Docs:
.ready()
http://api.jquery.com/ready/
$(callback)
http://api.jquery.com/jQuery/#jQuery3
When you have multiple instances of these constructs in your scripts,
the code within them will run in the order in which they are defined, so
in your example, what was happening was the first
$(#elements).sortable(); (defined within the $(function(){}); block)
was creating the sortable list - the second call (within
$(document).ready) was ignored.
Hope this helps,
Peter
on 23/02/2010 10:32 rafald said::
Hi Peter,
Indeed! It works ;-) THANKS!
It was enough to remove line with $(#elements).sortable();
So, what is the right place to put:
$(#elements).sortable();
?
in my example:
the first place was outside $(document).ready(function()
the second place (where I added event) was inside $
(document).ready(function()
What are the rules here and what will be difference if I put inside
or outside ?
Could you please explain this to me ?
regards
Rafal
[jQuery] JQPRINT - Need help!!
has anyone used JQPRINT? I know it looks really simple, but how do you call the function with a link? Erik
[jQuery] Re: FOUND THE SOLUTION FOR ROUNDIES FOR IE8 !!!!!!
Use the ROUNDIES script for IE7, which is really easy. I personally don't care for IE8 so I convert IE8 to work like IE7 by placing the following tag under the head: meta content=IE=7 http-equiv=X-UA-Compatible
[jQuery] Problem with load event
I have simple document:
script
$(document).load(function(){
alert('Document loaded')}
);
$(document).ready(function(){
alert('Document ready')}
);
$(document).live('load', function(){
alert('Document loaded (live)')}
);
/script
But from 3 attached events on page load fired only one -
$(document).ready. I even can't imagine why :( .
Test page: http://ru.bir.ru/_/svg/jquery-test.htm
I've tested it in FireFox 3.6 and Google Chrome 5.0.322.2 dev.
Any sugestion?
Re: [jQuery] Help: Iterate through unknown number of elements, apply function
On Tue, Feb 23, 2010 at 2:20 AM, xstaceyamayx sta...@staceymay.com wrote:
Anyway, I have 2 select boxes. I can populate SelectA with items from
a database, move the items from selectA to selectB and back again by
clicking add and remove...
Change your HTML to look something like this:
div class=input
select multiple class=selectA
?php //populate with database information ?
/select
div
button class=addadd gt;gt;/buttonbr /
button class=removelt;lt; remove/button
/div
select multiple class=selectB/select
/div
Then your Javascript to something like:
$().ready(function() {
$(.input).each(function(i) {
$(this).find(.add).click(function() {
var container = $(this).closest(.input);
container.find(.selectA
option:selected).appendTo(container.find(.selectB));
});
$(this).find(.remove).click(function() {
var container = $(this).closest(.input);
container.find(.selectB
option:selected).appendTo(container.find(.selectA));
});
});
});
See it in action here: http://jsbin.com/osipu/edit
Nathan
[jQuery] Selection from a list should rewrite the page.
I'm building a select from a java Resultset for a given userID.
Where the value for the options are a recordD for each record in the
Resultset.
On loading of the page, it gets a userID and recordD from session.
If recordD=null then it uses the first record from the Resultset.
So the select contains all records for a given userID and the page is
populated from data asscoiated to a recordD.
Interaction:
The user can repopulate the page by making a selection.
I makes an AJAX to a sevrlet that reset the session attribute for the
recordD.
So that when the callback() is called it triggers the page reload.
It seems trivial but it is as if the callback() is triggered before
the session is written.
I have a session and request dumper upon writing the page and I'm not
seeing the session modified.
I know the the url parameters are being built because I have an alert
to display them.
$('#select_note').change(function() {
// Get the index of the selected item
INDEX = $(#select_note option).index($(#select_note
option:selected)) +1;
RID = $(#select_note option:selected).val();
document.getElementById(rid).value= RID;
document.getElementById(current_note).innerHTML = INDEX;
var parameters = 'rid='+ RID + 'state=
%=AdvisorDictionary.STATE_GETRECORD%';
var url = %=context%/secure/Submit;
var GO2TAB = function (url, parameters) {
http_request = false;
if (window.HttpRequest) { // Mozilla, Safari,...
http_request = new HttpRequest();
if (http_request.overrideMimeType) {
http_request.overrideMimeType('text/xml');
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject(Msxml2.HTTP);
} catch (e) {
try {
http_request = new
ActiveXObject(Microsoft.HTTP);
} catch (e) {}
}
}
if (!http_request) {
alert('Cannot create XMLHTTP instance');
return false;
}
http_request.onreadystatechange =
alert(Yes);
http_request.open('POST', url + parameters, true);
http_request.send(null);
}
});
Re: [jQuery] Re: FOUND THE SOLUTION FOR ROUNDIES FOR IE8 !!!!!!
What are roundies? - Original Message - From: Erik eriks...@mac.com To: jQuery (English) jquery-en@googlegroups.com Sent: Tuesday, February 23, 2010 10:50 AM Subject: [jQuery] Re: FOUND THE SOLUTION FOR ROUNDIES FOR IE8 !! Use the ROUNDIES script for IE7, which is really easy. I personally don't care for IE8 so I convert IE8 to work like IE7 by placing the following tag under the head: meta content=IE=7 http-equiv=X-UA-Compatible
