Question

I want to have a JSP like this:

<form id="form1">
 Name is: <%=request.getParameter("name") %>
 <a href="#" onclick="fun1('<%=request.getParameter("name") %>')">Show Email Form</a>
</form>

<form id="form2">
 <input type="text" name="emailid" />
 <a href="#" onclick="fun2('$('input[name=emailid]').val()', <name required here>)">Submit</a>
</form>

My javascript is something like this:

function fun1() {
 //Nothing important here, just show second form
 $('#form2').show();
}

function fun2(myemail, myname) {
 //Do something important here,
 //Like update email for the given name
 xmlhttp = GetXmlHttpObject();
 var url = "updateEmail.do?email=" + myemail + "&name=" + myname;
 xmlhttp.open("POST", url, true);
}

Things to note here:
1) There is no action tied to my form, I am submitting the second form through Ajax.
2) I need to have two different forms, first form has more elements besides Name. And the second form has another different set of elements besides the email. Only one of the functions (fun2) in form2 needs both parameters of the name from form1 and email id from form2.
3) Form1 has an uneditable name parameter, and form2 has an editable email parameter. The onclick function in form2 picks up the email text input with jQuery.
4) One other scenario to consider is if there are multiple entries of name in form1, like a list of names using loops. Eg,

<form id="form1">
 <logic:iterate id="record" name="peoplerecords" property="records">
  Name is: <bean:write name="record" property="name">
 <a href="#" onclick="fun1('<bean:write name="record" property="name">')">Show Email Form</a>
 </logic:iterate>
 </form>

What is the best way to write the name parameter from form1 into the javascript onclick url in form2?

form1 :- onclick=”fun1(name);”
form2 :- onclick=”fun2(email, name);”

Answer 1

You can either directly put the name in with JSP:

<a href="#" onclick="fun2($('input[name=emailid]').val(), <%=request.getParameter("name") %>)">Submit</a>

Or you can give the dom node containing the name an id and access it with jQuery

Name is: <span id="nameNode"><%=request.getParameter("name") %></span>


<a href="#" onclick="fun2($('input[name=emailid]').val(), $('#nameNode').innerHTML)">Submit</a>

Also consider getting the required parameters directly in your functions or define the onclick handlers in your script section to avoid the code getting messy. Watch out for the quotes inside HTML attributes, you used single quotes twice in the second onclick handler.