hello there,
i have a form for a user to add an article to the CMS system. one
section of the form, the user has the ability to "attach" publications
that are already in the system to the article. one div
("#attachSelect") contains articles the user can add. when a user
click on a label, i make a copy of the containing div switch the class
names, then insert the dive into a div containing the added
publications ("#currAttachments). i then remove the div using
element.parentNode.remove(). if the user click on one of the added
publications, the reverse should happen and the div is removed from
the added div and inserted into the div of publications to be added.
the checkboxe's value should never be touched so that when inside
div#attachSelect the checkbox is not selected, and with within
div#currAttachments the checkbox is selected. everything works fine in
FF 2/3, netscape, google chrome, but breaks in IE 7. in IE 7 the
publications are added ok, but are unable to be removed. (checkbox can
be toggled, but its parent div is not removed). i get no errors with
firebug in FF or through IE
i originally tried to do this with the checkbox event "onchange", and
i got the same result, except for the added IE bug of the delayed
onchange (delayed until the element looses focus).
also, the checkboxes are intended to be hidden (with display:none;)
once i have everything working
any ideas on how to get this working in IE?
my environment:
FF 3, IE7 on win XP SP3
serving from apache w/ php mysql backend
prototype 1.6.0
scriptaculous 1.8.0
//the html:
<div id="attachments">
<h3>Select Files to Attach</h3>
<div id="attachSelect">
<div class="add">
<input name="pubAttachments[85]" id="pubAttach_85"
title="Attach
this Form"
style="" type="checkbox"><label for="pubAttach_85"
onclick="addPub
(this)">
Class 1 Medical Form</label>
</div>
<div class="add">
<input name="pubAttachments[55]" id="pubAttach_55"
title="Attach
this Minute"
style="" type="checkbox"><label for="pubAttach_55"
onclick="addPub
(this)">
March 2006 Minute</label>
</div>
<div class="add">
<input name="pubAttachments[59]" id="pubAttach_59"
title="Attach
this Minute"
style="" type="checkbox"><label for="pubAttach_59"
onclick="addPub
(this)">
September 2005 Minute</label>
</div>
</div>
<div id="currAttachments">
<div class="remove">
<input name="pubAttachments[56]" id="pubAttach_56"
title="Attach
this Minute"
style="" type="checkbox"><label for="pubAttach_56"
onclick="removePub(this)">
February 2006 Minute</label>
</div>
<div class="remove">
<input name="pubAttachments[57]" id="pubAttach_57"
title="Attach
this Minute"
style="" type="checkbox"><label for="pubAttach_57"
onclick="removePub(this)">
November 2005 Minute</label>
</div>
<div class="remove">
<input name="pubAttachments[58]" id="pubAttach_58"
title="Attach
this Minute"
style="" type="checkbox"><label for="pubAttach_58"
onclick="removePub(this)">
October 2005 Minute</label>
</div>
</div>
</div>
//the javascript
addPub = function(element){
element = $(element);
var copy = element;
$(copy.parentNode).addClassName('remove');
$(copy.parentNode).removeClassName('add');
$(copy).writeAttribute('onclick', 'removePub(this)');
$(element.parentNode).remove();
$('currAttachments').insert(copy.parentNode, 'bottom');
};
removePub = function(element2){
element2 = $(element2);
var copy2 = element2;
$(copy2.parentNode).addClassName('add');
$(copy2.parentNode).removeClassName('remove');
$(copy2).writeAttribute('onclick', 'addPub(this)');
$(element2.parentNode).remove();
$('attachSelect').insert(copy2.parentNode, 'bottom');
};
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---
