Witam!
Mam problem z wysłaniem danych z formularza do mootools'a. Chodzi o moduł Accordion (demo -
http://mootools.net/demos/?demo=Accordion). Chciałbym dodawać nowe zakładki wraz z tekstami przez formularz. Dodałem do index.html podkreśleniem fragment JS, który pobiera te pola i przekazuje do frameworka, dodaje nową zakładkę, ale gdy chcę dodać kolejną dodaje się kopia poprzedniej. Dlatego proszę o poradę, bo pewnie robie to źle...
index.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="demo.css" type="text/css" /> <script type="text/javascript" src="../mootools.js"></script> <form action="index.html" name="form" method="post"> Podaj tytuł paragrafu:
<input type="text" name="title" id="title"><br /> Wpisz zawartośc paragrafu...:
<br /> <script type="text/javascript"> var title = document.forms['form'].elements['title'].value;
var text = "<p>"+document.forms['form'].elements['text'].value+"</p>"; <h3 class="toggler">History
</h3>
<h3 class="toggler">Evidence of universal common descent
</h3> <h4>Common biochemistry and genetic code
</h4> <img src="images/phylogenetic_tree.png" width="340" height="230" align="right" alt="" /> <p>The universality of many aspects of cellular life is often pointed to as supportive evidence to the more compelling evidence listed above. These similarities include the energy carrier ATP, and the fact that all amino acids found in proteins are left-handed. It is possible that these similarities resulted because of the laws of physics and chemistry, rather than universal common descent and therefore resulted in convergent evolution.
</p> <h4>Phylogenetic trees
</h4>
<h3 class="toggler">Examples of common descent
</h3> <h4>Artificial selection
</h4> <img src="images/biglittledog.jpg" width="180" height="151" align="right" alt="" />
demo.js :
window.addEvent('domready', function() {
// var title2 = ${'title'};
// var text2 = ${'text'}; Probowałem też tak, ale to w ogóle nie działa...
//create our Accordion instance
var myAccordion = new Accordion($('accordion'), 'h3.toggler', 'div.element', {
opacity: false,
onActive: function(toggler, element){
toggler.setStyle('color', '#41464D');
},
onBackground: function(toggler, element){
toggler.setStyle('color', '#528CE0');
}
});
//add click event to the "add section" link
$('add').addEvent('click', function(event) {
event.stop();
// create toggler
var toggler = new Element('h3', {
'class': 'toggler',
'html': title
});
// create content
var content = new Element('div', {
'class': title,
'html': text
});
// position for the new section
var position = 0;
// add the section to our myAccordion using the addSection method
myAccordion.addSection(toggler, content, position);
});
});
Ten post edytował Raz0r 4.04.2011, 18:51:31
[Mootools] Wysłanie formularza do Accordion
4.04.2011, 18:45:59
