Forum Moderators: open

Message Too Old, No Replies

Javascript form validation plus Alert with choices

textbox radio button validation alert box with choices

         

hugeusrealeus

2:38 pm on Aug 17, 2004 (gmt 0)

10+ Year Member



I read thoughly this very detialed post and have tried to make them
work on my own rather unsuccessfully. :(
[webmasterworld.com...]
I need to validate a form that contains roughly 40 radio buttons, 10 submit buttons and 1
text field. If the text field and a radio button are filled out I need to ask the user if they wish to clear one of the selections. If yes clear the text field and submit the data. If no return to the page and without submiting the data with a warning that says something like you may only have one field filed out. I am using (on submit) so the number of radio and submit buttons shouldnt matter, but I am having a hard time validating the text field and I have no idea where to start with the options on clearing the text field. Could some one please show me the way. This must be included in the page and it is going on some one elses jsp server and of course it was due yesterday?!?:(
here is a sample of the code I am working with,
<html>
<head>
<title></title>
<meta name="Description" content="">
<meta name="keywords" content="">
<link rel="STYLESHEET" type="text/css" href="/jp-m2004/css/styles.css">
<script src="/2004/js/other-issuers-validation.js" type="text/javascript"></script>
</head>

<body bgcolor="#FFFFFF" topmargin="0" leftmargin="0" rightmargin="0" marginheight="0" marginwidth="0" text="#000000" link="#666633" vlink="#999999" alink="#999966">

<!--jsp&#29992; &#12490;&#12499;&#37096;&#20998;

<jsp:include page="/inc/header.html"/>
<jsp:include page="/inc/navtabs.html"/>

-->

<!--jsp&#29992;&#12395;&#12377;&#12427;&#26178;&#12399;&#19979;&#35352;ssi&#12479;&#12464;&#12399;&#21066;&#38500;&#12377;&#12427;-->

<!--#include virtual="/jp/inc/specialoffers_header.ssi"-->

<!--#include virtual="/jp/inc/specialoffers_present_navtabs.ssi"-->

<br>
<!--&#12426;-->
<a name="ri"></a>
<table border="0" width="100%" cellspacing="0" cellpadding="0" bgcolor="#349999">
<tr>
<td>
<table border="0" width="100%" cellspacing="1" cellpadding="3" class="text">
<tr bgcolor="#B7EBEB">
<td width="100%" align="left" valign="top" colspan="2">&#12426;</td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="5%" align="left" valign="top">
<input type="radio" name="issuer" value="1_33¦&#65288;&#26666;&#65289;&#12426;&#12421;&#12358;&#12366;&#12435;&#12487;&#12451;&#12540;&#12471;&#12540;">
</td>
<td width="95%" align="left" valign="top">
&#65288;&#26666;&#65289;&#12426;&#12421;&#12358;&#12366;&#12435;&#12487;&#12451;&#12540;&#12471;&#12540;
</td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="5%" align="left" valign="top">
<input type="radio" name="issuer" value="1_26¦&#33777;&#20449;&#12487;&#12451;&#12540;&#12471;&#12540;&#12459;&#12540;&#12489;&#65288;&#26666;&#65289;">
</td>
<td width="95%" align="left" valign="top">
&#33777;&#20449;&#12487;&#12451;&#12540;&#12471;&#12540;&#12459;&#12540;&#12489;&#65288;&#26666;&#65289;
</td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="100%" align="left" valign="top" colspan="2"><a href="#other">&#8251;&#12381;&#12398;&#20182;&#65288;&#12354;&#12390;&#12399;&#12414;&#12427;&#30330;&#34892;&#20250;&#31038;&#12364;&#12394;&#12356;&#22580;&#21512;&#12399;&#12289;&#12371;&#12398;&#12506;&#12540;&#12472;&#12398;&#26368;&#19979;&#27573;&#12398;&#26528;&#20869;&#12395;&#30330;&#34892;&#20250;&#31038;&#21517;&#12434;&#35352;&#20837;&#12375;&#12390;&#19979;&#12373;&#12356;&#12290;&#65289;</a></td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="100%" align="right" valign="top" colspan="2">
<input type="submit" name="action_entry_confirm" style="font-size:10pt;" value="&#30906;&#35469;&#30011;&#38754;&#12408;">
&nbsp;
<input type="reset" style="font-size:10pt;" value="&#12463;&#12522;&#12450;"> &#12288;
<a href="#top">&#9650;Top</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
<br>
<!--&#12429;-->
<a name="ro"></a>
<table border="0" width="100%" cellspacing="0" cellpadding="0" bgcolor="#349999">
<tr>
<td>
<table border="0" width="100%" cellspacing="1" cellpadding="3" class="text">
<tr bgcolor="#B7EBEB">
<td width="100%" align="left" valign="top" colspan="2">&#12429;</td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="5%" align="left" valign="top">
<input type="radio" name="issuer" value="4_36¦&#65288;&#26666;&#65289;&#21172;&#37329;&#12459;&#12540;&#12489;&#12469;&#12540;&#12499;&#12473;">
</td>
<td width="95%" align="left" valign="top">
&#65288;&#26666;&#65289;&#21172;&#37329;&#12459;&#12540;&#12489;&#12469;&#12540;&#12499;&#12473;
</td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="100%" align="left" valign="top" colspan="2"><a href="#other">&#8251;&#12381;&#12398;&#20182;&#65288;&#12354;&#12390;&#12399;&#12414;&#12427;&#30330;&#34892;&#20250;&#31038;&#12364;&#12394;&#12356;&#22580;&#21512;&#12399;&#12289;&#12371;&#12398;&#12506;&#12540;&#12472;&#12398;&#26368;&#19979;&#27573;&#12398;&#26528;&#20869;&#12395;&#30330;&#34892;&#20250;&#31038;&#21517;&#12434;&#35352;&#20837;&#12375;&#12390;&#19979;&#12373;&#12356;&#12290;&#65289;</a></td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="100%" align="right" valign="top" colspan="2">
<input type="submit" name="action_entry_confirm" style="font-size:10pt;" value="&#30906;&#35469;&#30011;&#38754;&#12408;">
&nbsp;
<input type="reset" style="font-size:10pt;" value="&#12463;&#12522;&#12450;"> &#12288;
<a href="#top">&#9650;Top</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
<br>
<!--&#12431;-->
<a name="wa"></a>
<table border="0" width="100%" cellspacing="0" cellpadding="0" bgcolor="#349999">
<tr>
<td>
<table border="0" width="100%" cellspacing="1" cellpadding="3" class="text">
<tr bgcolor="#B7EBEB">
<td width="100%" align="left" valign="top" colspan="2">&#12431;</td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="5%" align="left" valign="top">
<input type="radio" name="issuer" value="2_22¦&#21644;&#27468;&#23665;&#37504;&#12459;&#12540;&#12489;&#65288;&#26666;&#65289;">
</td>
<td width="95%" align="left" valign="top">
&#21644;&#27468;&#23665;&#37504;&#12459;&#12540;&#12489;&#65288;&#26666;&#65289;
</td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="100%" align="left" valign="top" colspan="2"><a href="#other">&#8251;&#12381;&#12398;&#20182;&#65288;&#12354;&#12390;&#12399;&#12414;&#12427;&#30330;&#34892;&#20250;&#31038;&#12364;&#12394;&#12356;&#22580;&#21512;&#12399;&#12289;&#12371;&#12398;&#12506;&#12540;&#12472;&#12398;&#26368;&#19979;&#27573;&#12398;&#26528;&#20869;&#12395;&#30330;&#34892;&#20250;&#31038;&#21517;&#12434;&#35352;&#20837;&#12375;&#12390;&#19979;&#12373;&#12356;&#12290;&#65289;</a></td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="100%" align="right" valign="top" colspan="2">
<input type="submit" name="action_entry_confirm" style="font-size:10pt;" value="&#30906;&#35469;&#30011;&#38754;&#12408;">
&nbsp;
<input type="reset" style="font-size:10pt;" value="&#12463;&#12522;&#12450;"> &#12288;
<a href="#top">&#9650;Top</a>
</td>
</tr>
</table>

</td>
</tr>
</table>
</form>

</td>
</tr>
<!--Start textbox-->
<tr>
<td align="right">
<form>
<a name="other"></a>
<table border="0" width="100%" cellspacing="1" cellpadding="5" bgcolor="#B7EBEB" class="copy">
<tr valign="top">
<td align="left">
&#8251;&#19978;&#35352;&#12522;&#12473;&#12488;&#12398;&#20013;&#12395;&#12354;&#12390;&#12399;&#12414;&#12427;&#30330;&#34892;&#20250;&#31038;&#12364;&#12394;&#12356;&#22580;&#21512;&#12399;&#12289;&#24656;&#12428;&#20837;&#12426;&#12414;&#12377;&#12364;&#30330;&#34892;&#20250;&#31038;&#21517;&#12434;<br>&#26528;&#20869;&#12395;&#35352;&#20837;&#12375;&#12390;&#19979;&#12373;&#12356;&#12290;
</td>
</tr>
<tr valign="top">
<td bgcolor="#FFFFFF" align="center">
&#30330;&#34892;&#20250;&#31038;&#21517;&#65306;<input type="TEXT" name="Issuer" value="" size="30" maxlength="200">&#12288;<input type="submit" name="action_entry_confirm" style="font-size:10pt;" value="&#30906;&#35469;&#30011;&#38754;&#12408;"> &#12288;<input type="reset" style="font-size:10pt;" value="&#12463;&#12522;&#12450;">
</td>
</tr>
</table>
</form>


</body>
</html>

Thanks for anything you can do to help,
E./

RonPK

3:18 pm on Aug 17, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hello there hugeusrealeus,

Welcome to WebmasterWorld. Please have a look at the posting guidelines [webmasterworld.com], and keep in mind that many of us mortals have problems with lines 4000px wide...

One important question: do you have one (1) form, as in your question, or two (2), as in your code?

hugeusrealeus

12:12 am on Aug 18, 2004 (gmt 0)

10+ Year Member



OUCH!
Ron sorry about that!
I wanted to include as much info as possible I have 2 form tags now. Last night as I rode home I thought I maybe I should try to take one out and make it all one form.
I did not write this code but have been asked to finnish it. I will post the code I am using for validation in a min. sorry again!

hugeusrealeus

7:21 am on Aug 19, 2004 (gmt 0)

10+ Year Member



Apoligies again for the long string.
but here is the code I have that is located in a JS File that is used to validate the form
<!--
var WC_ERRORS = '';
var wc_pageID = "jpissother";
function validate(form) {
var cardIssuer_Checked = false;
var Alert = '';

for (var i=0;i<form.issuer.length;i++)
{if(form.issuer[i].checked){cardIssuer_Checked=true;break;}}
if(!cardIssuer_Checked){Alert+="\n\n ERROR MSSG";WC_ERRORS+="No_Issuer_Checked;";}
if(!Alert){return true;}else{alert("ALERTMSSG"+Alert);return false;}}
//-->

This checks only to see if the field is filled in and if not it derives a error.
I need to check if both a radio button and the text box are filled out,
and if both are filled out at the same time
then issue a confirmation.
That confirmation will either clear the field or return the user to the page.

Here is also a sample of the page I am working with.

<script src="/jpbile2004/js/other-issuers-validation-1.js" type="text/javascript"></script>


</head>

<body bgcolor="#FFFFFF" topmargin="0" leftmargin="0"
rightmargin="0" marginheight="0" marginwidth="0"
text="#000000" link="#666633" vlink="#999999" alink="#999966">

<form action="/jp-mobile2004/selectOtherIssuer.do" method="post" >
<!--&#12354;-->
<a name="a"></a>
<table border="0" width="100%" cellspacing="0" cellpadding="0" bgcolor="#349999">
<tr>
<td>
<table border="0" width="100%" cellspacing="1" cellpadding="3" class="text">
<tr bgcolor="#B7EBEB">
<td width="100%" align="left" valign="top" colspan="2">&#12354;</td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="5%" align="left" valign="top">
<input type="radio" name="issuer" value="1_1¦">
</td>
<td width="95%" align="left" valign="top">

</td>
</tr>
<tr bgcolor="#FFFFFF">
<td align="left" valign="top">
<input type="radio" name="issuer" value="14_1¦">
</td>
<td align="left" valign="top">

</td>
</tr>
<tr bgcolor="#FFFFFF">
<td align="left" valign="top">
<input type="radio" name="issuer" value="1_2¦">
</td>
<td align="left" valign="top">

</td>
</tr>
<tr bgcolor="#FFFFFF">
<td align="left" valign="top">
<input type="radio" name="issuer" value="1_3¦">
</td>
<td align="left" valign="top">
</td>
</tr>
<tr bgcolor="#FFFFFF">
<td align="left" valign="top">
<input type="radio" name="issuer" value="4_2¦">
</td>
<td align="left" valign="top">
</td>
</tr>
<tr bgcolor="#FFFFFF">
<td align="left" valign="top">
<input type="radio" name="issuer" value="4_13_1¦">
</td>
<td align="left" valign="top">
</td>
</tr>
<tr bgcolor="#FFFFFF">
<td align="left" valign="top">
<input type="radio" name="issuer" value="13_3¦">
</td>
<td align="left" valign="top">
</td>
</tr>
<tr bgcolor="#FFFFFF">
<td align="left" valign="top">
<input type="radio" name="issuer" value="13_1¦">
</td>
<td align="left" valign="top">
</td>
</tr>
<tr bgcolor="#FFFFFF">
<td align="left" valign="top">
<input type="radio" name="issuer" value="13_2¦">
</td>
<td align="left" valign="top">
text1 </td>
</tr>
<tr bgcolor="#FFFFFF">
<td align="left" valign="top">
<input type="radio" name="issuer" value="15_1">
</td>
<td align="left" valign="top">
text2
</td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="100%" align="left" valign="top" colspan="2"><a href="#other"></a></td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="100%" align="right" valign="top" colspan="2">
<input type="submit" name="action_entry_confirm" style="font-size:10pt;" value="text2" onclick="return validate(form)>
&nbsp;
<input type="reset" style="font-size:10pt;" value="text3"> &#12288;
<a href="#top">&#9650;Top</a>

</tr>
<!--Start textbox-->
<tr>
<td align="right">

<a name="other"></a>
<table border="0" width="100%" cellspacing="1"
cellpadding="5" bgcolor="#B7EBEB" class="copy">
<tr valign="top">
<td align="left">
text4a
</td>
</tr>
<tr valign="top">
<td bgcolor="#FFFFFF" align="center">
text5&#65306;<input type="TEXT" name="Issuer-text" value="" size="30"
maxlength="200">&#12288;<input type="submit"
name="action_entry_confirm" style="font-size:10pt;"
value="text6" onclick="return validate(form)>

123<input type="reset" style="font-size:10pt;" value="XX">
</td>
</tr>
</table>
</form>
</td>
</tr>
<!--End textbox-->

</table><!-- END OF MAIN CONTENT -->
<!--content end-->
</body>
</html>

I hope someone can please be of assitance I will
post a followup to this with the code I am trying to use.

Thanks in Advance Erin