...
Code Block |
---|
<script type="text/javascript">
if(jQuery){
$j(document).ready(function(){
$j('#1-removeEntry').remove();
$j('#10-addEntry').remove();
$j('#1-toggleContainer').show();
$j('#11-removeEntry').remove();
$j('#20-addEntry').remove();
$j('#11-toggleContainer').show();
});
$j(document).ready(function(){
$j('button.addEntry').live("click", function(){
var correctedAddButtonId = parseFloat(this.id) + 1;
var contentAddId = "#" + correctedAddButtonId + "-toggleContainer";
$j(contentAddId).toggle(true);
$j('#' + this.id).toggle(false); $j('#' + parseFloat(this.id) + '-removeEntry').toggle(false);
return false;});
});
$j(document).ready(function(){
$j('button.removeEntry').live("click", function(){
var correctedRemoveButtonId = parseFloat(this.id) - 1;
var contentAddId = "#" + parseFloat(this.id) + "-toggleContainer";
$j(contentAddId).toggle(false);
$j( ':input:not(:button)', contentAddId).val([]);
$j('#' + correctedRemoveButtonId + '-addEntry').toggle(true); $j('#' + correctedRemoveButtonId + '-removeEntry').toggle(true);
return false;});
});
}
</script>
|
...
As you can see, the form only displays the add and remove buttons next the the current rendered template and travels as you move through the list of available renders.
Discussion
New Issue:: When viewing a saved form only the first toggleContainers are displayed by default. All toggleContainers that have values=!null should be displayed. This is currently under revision and any suggestions are welcome!
FIXED::An issue with this that is not addressed in this example that prior to removing a field the user must have nothing selected within the input or else they could accidentally input a value that they didn't intend to input after toggling the value hidden with the remove button. This will be addressed in the next version of the script.