javascript - How do I print user input with the first letter of each word capitalized? -
i working form , print user's input first letter of each word capitalized no matter how type in. example, want user's "ronald smith" print rondald smith. address , city. have read of similar questions , answers on here , not working me. not sure if putting code in wrong place or i'm doing wrong. code using:
function correctformat(customer) { var first = customer.charat(0).touppercase(); var rest = customer.substring(1).tolowercase(); return first + rest; } i have tried placing in variety of places within whole document, have tried renaming string (eg. name, city, address). have read others postings on here seems same question none working. not entering string want capitalized. user entering data form , need print in alert in correct format. here above code within entire document. sorry long again, @ loss.
<html> <!--nff add title web page.--> <head> <title>pizza order form</title> <script> /*nff add doclear function clear information entered user , enter information cleared when clear entries button clicked @ bottom of web page.*/ function doclear() { var elements = document.getelementsbytagname('select'); elements[0].value = 'pa'; document.pizzaform.customer.value = ""; document.pizzaform.address.value = ""; document.pizzaform.city.value = ""; document.pizzaform.state.value = ""; document.pizzaform.zip.value = ""; document.pizzaform.phone.value = ""; document.pizzaform.email.value = ""; document.pizzaform.sizes[0].checked = false; document.pizzaform.sizes[1].checked = false; document.pizzaform.sizes[2].checked = false; document.pizzaform.sizes[3].checked = false; document.pizzaform.toppings[0].checked = false; document.pizzaform.toppings[1].checked = false; document.pizzaform.toppings[2].checked = false; document.pizzaform.toppings[3].checked = false; document.pizzaform.toppings[4].checked = false; document.pizzaform.toppings[5].checked = false; document.pizzaform.toppings[6].checked = false; document.pizzaform.toppings[7].checked = false; document.pizzaform.toppings[8].checked = false; return; } //nff add dosubmit button indicate outcome when user clicks submit order button @ bottom of form. function dosubmit() /*nff add if statement dosubmit function return false if there missing information in text fields once user clicks submit order button.*/ { if (validatetext() == false) { return false; } //nff add if statement dosubmit function return false if there no pizza size selected using radio buttons. if (validateradio() == false) { return false; } //nff add if statement dosubmit function return false if there no toppings selected using checkboxes. if (validatecheckbox() == false) { return false; } //nff add if statement dosubmit function return false if email entered user empty or not fit acceptable format. if (validateemail() == false) { return false; } /*nff add if statement dosubmit function return false if phone number entered user empty or not fit acceptable formats.*/ if (validatephone() == false) { return false; } if (validatezip() == false) { return false; } //nff add alert box show customer information text fields when submit order button clicked. var customer = document.pizzaform.customer.value; var address = document.pizzaform.address.value; var city = document.pizzaform.city.value; var state = document.pizzaform.state.value; var zip = document.pizzaform.zip.value; var phone = document.pizzaform.phone.value; var email = document.pizzaform.email.value; var size = ""; (var = 0; < document.pizzaform.sizes.length; i++) { if (document.pizzaform.sizes[i].checked) { size = document.pizzaform.sizes[i].nextsibling.nodevalue.trim(); break; } } var toppings = []; (var = 0; < document.pizzaform.toppings.length; i++) { if (document.pizzaform.toppings[i].checked) { toppings.push(document.pizzaform.toppings[i].nextsibling.nodevalue.trim()); } } alert("name: " + customer + '\n' + "address: " + address + '\n' + "city: " + city + '\n' + "state: " + state + '\n' + "zip: " + zip + '\n' + "phone: " + phone + '\n' + "email: " + email + '\n' + "size: " + size + '\n' + (toppings.length ? 'toppings: ' + toppings.join(', ') : '')); } //nff add validatetext function ensure text fields complete before order submitted. function validatetext() { var customer = document.pizzaform.customer.value; if (customer.length == 0) { alert('name data missing'); document.pizzaform.customer.focus(); return false }; var address = document.pizzaform.address.value; if (address.length == 0) { alert('address data missing'); return false; } var city = document.pizzaform.city.value; if (city.length == 0) { alert('city data missing'); return false; } var state = document.pizzaform.state.value; if (state.length == 0) { alert('state data missing'); return false; } var zip = document.pizzaform.zip.value; if (zip.length == 0) { alert('zip data missing'); return false; } var phone = document.pizzaform.phone.value; if (phone.length == 0) { alert('phone data missing'); return false; } var email = document.pizzaform.email.value; if (email.length == 0) { alert('email data missing'); return false; } return true; } //nff add validateradio function if none of radio buttons pizza size selected alert user. function validateradio() { if (document.pizzaform.sizes[0].checked) return true; if (document.pizzaform.sizes[1].checked) return true; if (document.pizzaform.sizes[2].checked) return true; if (document.pizzaform.sizes[3].checked) return true; alert('size of pizza not selected'); document.pizzaform.sizes[0].foucs(); return false; } //nff add validatecheckbox function if none of checkboxes toppings selected alert user. function validatecheckbox() { if (document.pizzaform.toppings[0].checked) return true; if (document.pizzaform.toppings[1].checked) return true; if (document.pizzaform.toppings[2].checked) return true; if (document.pizzaform.toppings[3].checked) return true; if (document.pizzaform.toppings[4].checked) return true; if (document.pizzaform.toppings[5].checked) return true; if (document.pizzaform.toppings[6].checked) return true; if (document.pizzaform.toppings[7].checked) return true; if (document.pizzaform.toppings[8].checked) return true; alert ('toppings not selected'); return false; } //nff add validateemail function ensure email address has been entered in correct format. function validateemail() { if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{3,4})+$/.test(pizzaform.email.value)) { return (true) } alert("you have entered invalid email address") return (false) } //nff add validatephone function ensure phone number has been entered in of acceptable formats. function validatephone() { if (/^[(]{0,1}[0-9]{3}[)]{0,1}[-\s\.]{0,1}[0-9]{3}[-\s\.]{0,1}[0-9]{4}$/.test(pizzaform.phone.value)) { return (true) } alert("you have entered invalid phone number") return (false) } function validatezip() { if (/^\d{5}([\-]\d{4})?$/.test(pizzaform.zip.value)) { return (true) } alert("you have entered invalid zip") return (false) } function correctformat(customer) { var first = customer.charat(0).touppercase(); var rest = name.substring(1).tolowercase(); return first + rest; } </script> </head> <body> <!--nff add form user enter information into.--> <form name="pizzaform"> <!--nff add title @ top of web page--> <h1>the javascript pizza parlor</h1> <!--nff add directions user information entered--> <p> <h4>step 1: enter name, address, , phone number:</h4> <!--nff change font--> <font face="courier new"> <!--nff insert text field user enter name, add spaces between title of text box , box itself, specify size of input box, , type of input box text.--> name: <input name="customer" size="50" type="text"><br> <!--nff insert text field user enter address, specify size of input box, , type of input box text.--> address: <input name="address" size="50" type="text"><br> <!--nff insert text field user enter city, add spaces between title of text box , box itself, specify size of input box, , type of input box text.--> city: <input name="city" size="15" type="text"> <!--nff insert text fields user enter state , zip, specify sizes of input boxes, , specify text entered boxes in caps state box. these input boxes should on same line last one.--> state:<select name="state"> <option selected value="pa">pa</option> <option value="nj">nj</option> <option value="ny">ny</option> <option value="de">de</option> </select> zip: <input name="zip" size="5" type="text"><br> <!--nff insert text field user enter phone number, insert spaces after title of box, specify size of box, , type of input text.--> phone: <input name="phone" size="50" type="text"><br> <!--nff insert text field user enter email address, insert spaces after title of box, specify size of box, , type of input text.--> email: <input name="email" size="50" type="text"><br> </font> </p> <!--nff add second step order pizza--> <p> <h4>step 2: select size of pizza want:</h4> <font face="courier new"> <!--nff add radio buttons choose 4 options pizza sizes.--> <input name="sizes" type="radio" value="small">small <input name="sizes" type="radio" value="medium">medium <input name="sizes" type="radio" value="large">large <input name="sizes" type="radio" value="jumbo">jumbo<br> </font> </p> <p> <!--nff add third step order pizza--> <h4>step 3: select pizza toppings want:</h4> <font face="courier new"> <!--nff add check boxes user choose toppings.--> <input name="toppings" type="checkbox" value="pepperoni">pepperoni <input name="toppings" type="checkbox" value="canadian bacon">canadian bacon <input name="toppings" type="checkbox" value="sausage">sausage<br> <input name="toppings" type="checkbox" value="mushrooms">mushrooms <input name="toppings" type="checkbox" value="pineapple">pineapple <input name="toppings" type="checkbox" value="black olives">black olives<br> <input name="toppings" type="checkbox" value="green peppers">green peppers <input name="toppings" type="checkbox" value="extra cheese">extra cheese <input name="toppings" type="checkbox" value="none">none<br> </font> </p> <!--nff add buttons options submit order or clear entries. add onclick event show 1 of alerts entered earlier in document when submit button clicked @ bottom of web page. add , onclick event clear entries in form upon clicking clear entries button.--> <input type="button" value="submit order" onclick="dosubmit()"> <input type="button" value="clear entries" onclick="doclear()"> </form> </body> </html>
you can use regular expression, such this:
function correctformat(customer){ return customer.replace(/\b(.)(.*?)\b/g, function(){ return arguments[1].touppercase() + arguments[2].tolowercase(); }); }
Comments
Post a Comment