Struts 2 and javascript...?

**Dormilich** · Feb 19 '10, 05:18 AM

you are aware that the shown code is not even well-formed?

**larztheloser** · Feb 19 '10, 07:20 AM

Also could we see your adduploat function please?

**sumitvyas13** · Feb 19 '10, 02:11 PM

Here is the design.jsp page

This page has the addupload function. So, the question is clear to you guys that I am adding the struts tags repeatedly using javascript and I want to collect all the information from the form. So, basically they share same 'name' attribute.
I am also attaching a screen shot for your reference of what actually the form looks like.
here is the code

Code:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%> 
<%@ taglib prefix="s" uri="/struts-tags" %>
    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
   <title>Notification Services</title>
 <SCRIPT type="text/javascript">
			function toggleDisplay(attachments){
			element = document.getElementById('attachments').style;
		    if (element.display=='none') {element.display='block';}
			else {element.display='none';}
			}

var max = 0; // maximum # of attachments allowed
var currentUploads = 0; // current # of attachment sections on the web page
var nameDesc = ''; // Name property for the Description Input field
var nameFile = '';	//Name property for the File Input field
var nameChec = ''; // Checkbox property for the File Input field
var scrollPosVert = 0; // stores the current scroll position on the form
// for some reason when a div is taken out, the form
// will scroll to the top on both Firefox and IE

// SCROLL FUNCTIONS
function saveScrollPos(offset)
{
scrollPosVert=(document.all)?document.body.scrollTop:window.pageYOffset-offset;
}

function setScrollPos()
{
window.scrollTo(0, scrollPosVert);
setTimeout('window.scrollTo(0, scrollPosVert)',1);
}




// This function adds a new attachment section to the form
// It is called when the user clicks the "Add contact" button...
// It takes three arguments:
// maxUploads - the maximum number of attachments allowed
//checFieldName - the name for checkbox type
// descFieldName - the field name for the Description Input field
// fileFieldName - the field name for the File Input field
function addUpload(maxUploads, checFieldName, descFieldName, fileFieldName)
{
nameDesc=descFieldName;
nameFile=fileFieldName;
nameChec=checFieldName
max = Number(maxUploads);

currentUploads++;
if (currentUploads>max) return;

if (currentUploads>0)
document.getElementById('addupload').childNodes[0].data='Add more contacts';

if (currentUploads==max) document.getElementById('addupload').childNodes[0].data='Max level reached';


// First, clone the hidden attachment section
var newFields = document.getElementById('attachment').cloneNode(true);
newFields.id = '';


// Make the new attachments section visible
newFields.style.display = 'block'; 



// loop through tags in the new Attachment section
// and set ID and NAME properties


var newField = newFields.childNodes;
for (var i=0;i<newField.length;i++)
{

if (newField[i].name==nameChec)
{
newField[i].id=nameChec+currentUploads;
newField[i].name=nameChec+currentUploads;
}

if (newField[i].name==nameFile)
{
newField[i].id=nameFile+currentUploads;
newField[i].name=nameFile+currentUploads;
}

if (newField[i].name==nameDesc)
{
newField[i].id=nameDesc+currentUploads;
newField[i].name=nameDesc+currentUploads;
}
}


// Insert our new Attachment section into the Attachments Div
// on the form...
var insertHere = document.getElementById('attachmentmarker');
insertHere.parentNode.insertBefore(newFields,insertHere);
}





// This function removes an attachment from the form
// and updates the ID and Name properties of all other
// Attachment sections 
function removeFile(container, item)
{
// get the ID number of the upload section to remove
var tmp = item.getElementsByTagName('input')[0];
var basefieldname = '';
if (tmp.type=='text') basefieldname = nameDesc; else basefieldname = nameFile;


var iRemove=Number(tmp.id.substring(basefieldname.length, tmp.id.length));

// Shift all INPUT field IDs and NAMEs down by one (for fields with a
// higher ID than the one being removed)
var x = document.getElementById('attachments').getElementsByTagName('input');
for (i=0;i<x.length;i++)
{
if (x[i].type=='text') basefieldname=nameDesc; else basefieldname=nameFile;

var iEdit = Number(x[i].id.substring(basefieldname.length, x[i].id.length));
if (iEdit>iRemove)
{
x[i].id=basefieldname+(iEdit-1);
x[i].name=basefieldname+(iEdit-1);
}
}
currentUploads--;
saveScrollPos(0);
container.removeChild(item);
setScrollPos();
document.getElementById('addupload').style.visibility='visible';
if (currentUploads==0)
document.getElementById('addupload').childNodes[0].data='Attach a file';
}

//remove the last add contact info elments from the span
function removeFilelast(container, item)
{
// get the ID number of the upload section to remove
var tmp = item.getElementsByTagName('input')[0];
var basefieldname = '';
if (tmp.type=='text') basefieldname = nameDesc; else basefieldname = nameFile;


var iRemove=Number(tmp.id.substring(basefieldname.length, tmp.id.length));

// Shift all INPUT field IDs and NAMEs down by one (for fields with a
// higher ID than the one being removed)
var x = document.getElementById('attachments').getElementsByTagName('input');
for (i=0;i<x.length;i++)
{
if (x[i].type=='text') basefieldname=nameDesc; else basefieldname=nameFile;

var iEdit = Number(x[i].id.substring(basefieldname.length, x[i].id.length));
if (iEdit>iRemove)
{
x[i].id=basefieldname+(iEdit-1);
x[i].name=basefieldname+(iEdit-1);
}
}
currentUploads--;
saveScrollPos(0);
container.removeChild(item);
setScrollPos();
document.getElementById('addupload').style.visibility='visible';
if (currentUploads==0)
document.getElementById('addupload').childNodes[0].data='Attach a file';
}





</SCRIPT>
<link href="<s:url value="/CSS/style.css"/>" rel="stylesheet" type="text/css"/>
</head>

<body>
<div id="welcome"><h4 align="center">Hello, please add our notification services to
				your VIN# &nbsp;<s:property value="message"/></h4></div>

<div id="container">
	<div id="padding_container">
<div id="header">
   <div id="header1"><h3>NOTIFICATIONS</h3></div>
   <P align="left"><font face="Times New Roman, Times, serif">Find out immediately if there is an issue with your vehicle, 
   such as an attempted break-in or a red alert in your OnStar Vehicle
Diagnostics report. Simply enroll in our notifiaction services and we'll let you know right away via your preferred You can edit your preferences and contacts at any time after enrolling.
</font></P>
</div>
<div id="wrapper"> 
   <div id="navigation" align="center" >Theft Notifications<br>
   <a href="javascript:toggleDisplay('attachments')">Enroll Now</a>
</div>

<div id="content">
        <p align="left"><strong>Opt In Theft Notifications</strong><br>
   Some text to simplifySome text to simplifySome text to simplifySome text to simplifySome text to simplify
   Some text to simplifySome text to simplifySome text to simplify<br>
<a href="#">Read Sample Email</a>, &nbsp;&nbsp;&nbsp;<a href="#">Read SAmple TEXT/SMS</a>, &nbsp;&nbsp;&nbsp;<a href="#">Hear Sample Voicemail</a></p>
</div>
</div>

<div id="attachment" class="attachment" style="display:none">
	<s:checkbox id="chec" name="chec" name='OnOff' value=''/>&nbsp;&nbsp;&nbsp;
<s:select 
    name="file" 
    id='file'
    headerKey="1"
    headerValue="-- Please Select --"
    list="#{'01':'Email','02':'SMS/TXT','03':'Voicemail'}"
    />
	<s:textfield id="desc" name="desc"  maxlength="55" size="55"/>
	

<a href="#" onclick="javascript:removeFile(this.parentNode.parentNode,this.parentNode);">Delete</a>


</div>
 
<div id="attachments" class="container" style="display:none">
<table><tr><td width="15%"><strong>On/Off</strong></td>
<td width="25%"><strong>Contact</strong></td>
<td  width="35%%"><strong>Information</strong></td>
</tr></table>
 <div id="attachmentssub" >
 <s:checkbox id="chec" name="chec" name='OnOff' value=''/>&nbsp;&nbsp;&nbsp;
<s:select  
    name="file" 
    id='file'
    headerKey="1"
    headerValue="-- Please Select --"
    list="#{'01':'Email','02':'SMS/TXT','03':'Voicemail'}"/>
	<s:textfield id="desc" name="desc"  maxlength="55" size="55"/>
<a href="#" onclick="javascript:removeFilelast(this.parentNode.parentNode,this.parentNode);">Delete</a></div><br>
<span id="attachmentmarker"></span>
<a id="addupload" style="floar:left;" href="javascript:addUpload(4, 'chec', 'desc', 'file')">Add Contact Information</a>
<s:submit action="SaveButton" cssStyle="float:right;" value="save"></s:submit><button type="button2" style="float:right;">Cancel</button><!-- <button type="button1" style="float:right;">Save</button> -->

</div>

<div id="wrapper1">
   <div id="OVD"  align="center" >OVD Notifications<br>
   <a href="#">Enroll Now</a></div>

<div id="OVD_content">
   <h2>Content</h2>
   <p>Some sample content, add your own here</p>
</div>
</div></div>
</div>
</body>
</html>

Attached Files

form.jpg (4.7 KB, 665 views)

Struts 2 and javascript...?

Struts 2 and javascript...?

Comment

Comment

Comment