0
Я немного смущен здесь. У меня большая часть моей формы завершена. Мне просто нужна помощь в получении значения моих блоков выбора и функции для вычисления этих значений. Наряду с кодом, отображающим сообщение об ошибке, если флажок не выбран.JavaScript Validation
/* Запускает ссылку на массив, чтобы установить цены на событиях */
var aaffa_Price = new Array();
aaffa_Price ["AAFFA Membership"] = 45;
aaffa_Price ["Early Registration"] = 135;
aaffa_Price ["Registration"] = 150;
aaffa_Price ["Early Mini Camp"] = 35;
aaffa_Price ["Mini Camp"] = 40;
aaffa_Price ["Three Mini Camp Special"] = 90;
/* This function validates selected events values and totals up the cost */
function getaaffaTotalCost()
{
var aaffa_Cost = 0;
var myForm = document.forms["aaffaForm"];
var selectedEvent = myForm.elements["selectedEvent"];
aaffa_Cost += aaffa_Price[selectedEvent.value];
return aaffa_Price;
}
function calcTotal()
{
var aaffa_Price = getaaffaTotalCost();
var divobj = document.getElementById('eventsTotalPrice');
divobj.style.display='block';
divobj.innerHTML = "Total Price For the Registration $"+aaffa_Cost;
}
function aaffaDisplay(aaffa)
{
var selAAffa = document.getElementById("spryselect1");
var selAAp = document.getElementById("spryselect2");
var girlsRad=document.getElementById("League_0");{
var boysRad=document.getElementById("League_1");
if (girlsRad.checked){
return true
selAAffa.hidden=false
}
selAAffa.hidden=true
}
}
<body>
<div class="container">
<div class="header">
<!-- end .header -->
</div>
<div class="content">
<form action="mailto:[email protected]" method="post" enctype="text/plain" target="_parent" id="myForm" name: "aaffa" onsumbit="return validate(this);">
<div class="league">
<fieldset>
<legend><em>Select A League</em>
</legend>
<span id="spryradio1">
<label>
<input type="radio" name="League" value="Girls" id="League_0" onchange="aaffaDisplay" />
AAFFA</label>
<label>
<input type="radio" name="League" value="Boys" id="League_1" />
Boys Passing</label>
<br />
<span class="radioRequiredMsg">Please make a selection.</span></span>
</fieldset>
<br />
</div>
<div class="AA Events">
<fieldset>
<legend><em>ALL American Events</em>
</legend>
<span id="sprytrigger1">Select more than one?</span>
<div class="tooltipContent" id="sprytooltip1">Hold ctrl to select more than one choice</div>
<span id="spryselect1"><br />
<select name="girlsEvent" id="aaffa" multiple="multiple" onchange="addTotal">
<option value="000" name="Select AAFFA Events" selected="selected"><strong><strong>AAFFA Events</strong></strong></option>
<option value="$45.00" name="All American Flag Football Memebership" onchange="addTotal">All American Memebership</option>
<option value="$135.00" name="Early Girl's Flag Football Registration">Early Girl's Flag Football Registration</option>
<option value="$150.00" name="Girl's Flag Football Registration" >All American Memebership</option>
<option value="$35.00" name="Early Mini Camp Registration Girls">Early Mini Camp Registration</option>
<option value="$40.00" name="Mini Camp Registration Girls">Mini Camp Registration</option>
<option value="$90.00" name="3 Mini Camp Special Registration Girls">3 Mini Camp Special Registration</option>
</select><<label for="girlsevent"></label>
<span class="selectRequiredMsg">Please select an item.</span>
<span id="spryselect2">
<select name="boysEvents" id="aapl" multiple="multiple" onchange="addTotal">
<option value="000" name="Select AA Pride Events" selected="selected">AA Pride Events</option>
<option value="$45.00" name="All American Pride Memebership" onchange="addTotal">All American Pride Memebership</option>
<option value="$135.00" name="Early Boys Passing League Registration">Early Boys Passing League Registration</option>
<option value="$150.00" name="All American Pride Flag Football Registration" >All American Memebership</option>
<option value="$35.00" name="Early Mini Camp Boys">Boys Early Mini Camp Registration</option>
<option value="$40.00" name="Mini Camp Registration Boys">Mini Camp Registration</option>
<option value="$90.00" name="3 Mini Camp Special Registration Boys">3 Mini Camp Special Registration</option>
</select> <br /><label for="event"></label>
<span class="selectRequiredMsg">Please select an item.</span></span>
<br />
<br />
<input type="text" name="aaffaTotal" id="aaffaTotal" placeholder=" " />
<input type="text" name="aapTotal" id="aapTotal" placeholder=" " />
</fieldset>
</div>
<div class="Boys Events">
</div>
<div class="contactInfo">
<fieldset>
<fieldset>
<legend><em>Contact Info</em>
</legend>
First Name:
<br />
<input name="fName" type="text" required="required" class="input" size="30" maxlength="15" placeholder="First Name" id="confName" tabindex="9" />
<br />Last Name:
<br />
<input name="lname" type="text" required="required" class="input" size="30" maxlength="45" placeholder="Last Name" id="conlName" tabindex="10" />
<br />Street:
<br />
<input name="street" type="text" required="required" class="input" size="35" maxlength="45" tabindex="11" />
<br />
<label for="city">City:</label>
<select name="city" class="select" id="city" tabindex="12">
<option value="000">None</option>
<option value="1">Boulder City</option>
<option value="2">Green Valley</option>
<option value="3">Henderson</option>
<option value="4">Las Vegas</option>
<option value="5">North Las Vegas</option>
</select>
State:
<input name="state" required="required" size='4' class="content" value="N.V." tabindex="13" />Zip Code:
<input type="text" name="zipCode" required="required" tabindex="14" size="15" pattern="(\d{5}([\-]\d{4})?)" maxlength="10" />
<br />
<br/>E-Mail:
<input type="text" name: "email" required="required" class="input" size="35" maxlength="50" />Phone #:
<input name="Contact Number" type="tel" required="required" size="12" pattern="\d{3}[\-]\d{3}[\-]\d{4}" placeholder="777-777-7777" maxlength="13" />
<br/>
<div class="emerContactInfo">
<br />
<fieldset>
<legend>Emergency Contact</legend>
First Name:
<br />
<input name="pfname" type="text" required="required" class="input" size="30" maxlength="15" placeholder="Parent's First Name" tabindex="9" />
<br />Last Name:
<br />
<input name="plname" type="text" required="required" class="input" size="30" maxlength="45" placeholder="Last Name" tabindex="10" />
<br />
<label>Address:
<br />
</label>
<label>City:
<input name="pcity" type="text" required="required" class="input" size="35" maxlength="45" tabindex="11" />
</label>
<label>State:
<br />
<input name="pstate" type="text" required="required" class="input" size="35" maxlength="45" tabindex="11" />
</label>
</fieldset>
</div>
<p>
<!-- Load jQuery from Google's CDN -->
<!-- Load jQuery UI CSS -->
<input name="pstreet" type="text" required="required" class="input" size="35" maxlength="45" tabindex="11" />
<br/>
<br/>
<input type="submit" value="Submit" onclick="return getaaffaTotalCost()" />
<input type="button" value="reset" />
</p>
<p><</p>
</fieldset>
</form>
<!-- end.contactInfo -->
</div>
<!-- end .content -->
</div>
Вы говорите о выпадающем списке? Поскольку вы не использовали флажок в своем коде. И FYI вам не нужно писать required = "required". Запись, требуемая только в теге ввода, также будет работать. В html мы также вводим тип type = "email", который может проверять основной синтаксис электронной почты для u. –
В вашем названии вы пишете 'JavaScript Validation', но вы не показываете код JavaScript, где вы пытаетесь выполнить проверку. Когда вы задаете вопросы, вы должны показать, что вы уже пробовали. Кроме того, вы всегда должны убедиться, что код вашего шоу действителен. Ваш html-код полон ошибок. например 'name:" email "вместо' name = "email" ',' select' не является допустимым дочерним элементом 'span' и другими. –
http://stackoverflow.com/questions/1085801/get-selected-value-in-dropdown-list-using-javascript это поможет вам, и я предлагаю использовать jQuery, потому что это может облегчить жизнь с помощью DOM-манипуляций –