If...else based on random selection from string - javascript

I am creating a script to populate an email template with random variables, using the replace() method.
Unfortunately, I am struggling to find a way of inserting a gender pronoun, based on the gender of a random name chosen from a string. Is there a way to do this using the excerpts of the scripts below (or am I missing something incredibly obvious)?
HTML
<p id="lineTwo">firstName told genderPronounOne friends...</p>
JavaScript
//Random Name
var maleNames = ['Tom', 'Tony'];
var femaleNames = ['Tina', 'Tracy'];
var maleRandom = maleNames[Math.round(Math.random()*(maleNames.length-1))]+'\n';
var femaleRandom = femaleNames[Math.round(Math.random()*(femaleNames.length-1))]+'\n';
var nameGender = [maleRandom, femaleRandom
var name = nameGender[Math.round(Math.random()*(nameGender.length-1))]+'\n';
//Determine Gender
var pronounOne;
if(/* this is where I'm struggling */){
pronounOne = 'his';
} else {
pronounOne = 'her';
}
//Replace HTML
var replaceHTML = document.getElementById("lineTwo").innerHTML;
var replaceName = replaceHTML.replace("firstName", name);
var replacePronoun = replaceHTML.replace("genderPronounOne", pronounOne);
document.getElementById("lineTwo").innerHTML = replaceName;
document.getElementById("lineTwo").innerHTML = recplacePronoun;
Can anyone help? Thank you.

Store the 0 or 1 in a variable and use it
var mf = Math.round(Math.random()*(nameGender.length-1))
var name = nameGender[mf]+'\n';
//Determine Gender
var pronounOne = mf ? "her" :'his';

How about you check to see if the name that you selected is in the array of male names?
if (maleNames.indexOf(name) > -1) {
pronounOne = 'his';
} else {
pronounOne = 'her';
}

Related

Naming a variable based on user input Javascript

So I am trying to have a program where a variables name is determined by user input, like:
<html>
<script>
var name = prompt("User input")
var hold = prompt("More stuff")
var (Test + (name)) = (hold)
</script>
</html>
But this doesn't work. What can I do?
You can't name variables by a string. You can name properties on an object however.
var name = prompt("User input")
var hold = prompt("More stuff")
var obj = {};
obj['Test' + name] = (hold)

Keep Javascript constant the same after function is recalled

I am trying to create a dynamic list so when the user performs a search it will repopulate the list. The problem is that I can't seem to make an immutable constant to store the original div content. Every time the function get's called this variable gets reinitialized.
Is there a way to achieve this without using cookies ? Any help is sincerely appreciated. The code is not complete because I couldn't get passed this step but if you think I am totally heading toward the wrong direction please let me know.
const originalList = document.getElementById('patientList').getElementsByTagName('li');
frozen = Object.freeze(originalList);
<script>
const originalList = document.getElementById('patientList').getElementsByTagName('li');
frozen = Object.freeze(originalList);
var newList = '';
var found = false;
function filterPatients(){
var searchQuery = document.getElementById('search');
var query = searchQuery.value;
var listContainer = document.getElementById('patientList');
var patientList = listContainer.getElementsByTagName('li');
for (var i = 0; i < originalList.length; i++){
var link = patientList[i].getElementsByTagName('a');
var link = link[0].text;
/** remove whitespaces for easy comparison **/
link = link.toLowerCase();
query = query.toLowerCase();
link = link.replace(/\s/g, "");
query = query.replace(/\s/g, "");
/** check every character in query **/
if (link.length > query.length && link.substring(0,query.length) == query){
found = true;
newList += '<li>' + patientList[i].innerHTML + '</li>';
}
}
if (found == true){
listContainer.innerHTML = newList;
newList = '';
}
else{
listContainer.innerHTML = "<li>No patient by that name</li>";
}
console.log(frozen);
}
</script>
const originalList = document.getElementById('patientList').getElementsByTagName('li').cloneNode(true);
Make originalList a copy of the element. Currently, you are setting originalList and patientList to be the same list of elements, so changing one will also change the other. Use element.cloneNode(true) to make a deep copy of a DOM element

Loop through all defined variables jquery

Hi I want to loop through all defined variables in a jquery function for pushing corresponding variable name into an array. The code is given below
function pushallvariables()
{
var list = [];
var name = /^[A-Za-z\s.]+$/;
var general = /^[A-Za-z0-9\s.\-\/]{2,20}$/;
var email = /^([\w-]+(?:\.[\w-]+)*)#((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/;
var digit = /^[+]?[0-9\s]+$/;
list.push('name');
list.push('general');
list.push('email');
list.push('digit');
}
I want to modify this function into
function pushallvariables()
{
var list = [];
var name = /^[A-Za-z\s.]+$/;
var general = /^[A-Za-z0-9\s.\-\/]{2,20}$/;
var email = /^([\w-]+(?:\.[\w-]+)*)#((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/;
var digit = /^[+]?[0-9\s]+$/;
for each(variable as var)
{
list.push(var.name);
}
}
But the modified function is not correct. How can I write the function ?
The best and clear way to do that is:
var list = {};
list.name = /^[A-Za-z\s.]+$/;
list.general = /^[A-Za-z0-9\s.\-\/]{2,20}$/;
list.email = /^([\w-]+(?:\.[\w-]+)*)#((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/;
list.digit = /^[+]?[0-9\s]+$/;
without loops, etc

How do I overwrite object properties in an array?

I would like to overwrite a certain allOrders[i] with data, similar to how I create a new one. For some reason I can't figure out what to search on.
I have an array of objects allOrders.
I have an object BusinessCard. I take the form fields, serialize() them, clean up the data with a regex, then push the them into an array.
allOrders.push(new BusinessCard(currentOrder.quantity, currentOrder.FullName, currentOrder.Title, currentOrder.CellNumber, currentOrder.OfficeNumber, currentOrder.FaxNumber, currentOrder.EmailAddress, currentOrder.Address, currentOrder.website, currentOrder.price));
I've tried searching for overwriting existing object properties in an array and the likes and haven't figured out what to do here.
My best guess was allOrders[i].push -- but it seems to me that I have to write a new function to replace each property in the object.
Right now I am using(because using serialize() on the form inputs doesn't help me at all:
allOrders[i].quantity = $('#bcQuantity').val();
allOrders[i].fullname = $('#fullName').val();
allOrders[i].title = $('#Title').val();
allOrders[i].cell = $('#CellNumber').val();
allOrders[i].office = $('#OfficeNumber').val();
allOrders[i].fax = $('#FaxNumber').val();
allOrders[i].email = $('#EmailAddress').val();
allOrders[i].address = $('#Address').val();
allOrders[i].website = $('#website').val();
allOrders[i].price = $('#bcCostBeforeCart').text();
There has to be a smarter way to do this. Thank you.
EDIT:
function getFormData(formId) {
var currentForm = '#' + formId;
var currentPrice = $('#bcCostBeforeCart').text();
var currentFormData = $(currentForm).serialize();
var currentFormDataFinal = currentFormData + '&price=' + currentPrice;
return JSON.parse('{"' + decodeURI(currentFormDataFinal.replace(/\+/g, " ").replace(/&/g, "\",\"").replace(/=/g, "\":\"")) + '"}');
}
MEANING i could be using
currentOrder = getFormData('businessCardForm');
then
allOrders[i] = currentOrder;
Seems odd that you would be updating all items with the selector's you're using, but I would wrap up getting the updated order information then, you can run thru a loop.
Depending on your output, as long as it's outputing the respective properties and values of an order object you could just do:
for(int i =0; i < allOrders.length; i++){
var currentFormId = '' // update this for each iteration.
allOrders[i] = getFormData(currentFormId);
}
allOrders[i] = getUpdatedOrder();
function getUpdatedOrder() {
var order = {};
order.quantity = $('#bcQuantity').val();
order.fullname = $('#fullName').val();
order.title = $('#Title').val();
order.cell = $('#CellNumber').val();
order.office = $('#OfficeNumber').val();
order.fax = $('#FaxNumber').val();
order.email = $('#EmailAddress').val();
order.address = $('#Address').val();
order.website = $('#website').val();
order.price = $('#bcCostBeforeCart').text();
return order;
}

Javascript / JQuery comma separated value find last in list and build array

I have a list of options in a select field and each one of these has a comma separated list in the value, I need to loop through these and get the last item in the list and build an array to set into some input fields.
I need to do this in reverse as the ',' separated value I am getting is from a web service which will parse either 5 or 6 items of data which build into an address.
I have started on JSFiddle but I am a bit stuck.
http://jsfiddle.net/justinerswell/feDTU/1/
Any help would be great, I know that this is no the best way of processing data but its all I have to work with.
I have reposted this as it warrants it as the question has evolved.
Thanks
From the question I assume that you are looking to parse the value from either 5 or 6 comma separated value in your option and then separate them into array and want to do something with them (like putting it somewhere else). Below is the modification of your script that I made. I am not getting the question clearly, but I am assuming this is what you want.
$(document).ready(function () {
$('select').click(function () {
var selected = $(this).find(':selected').text();
var substr = selected.split(',');
var country = "";
var postcode = "";
var county = "";
var city = "";
var addthree = "";
var addtwo = "";
var addone = "";
if(substr.length == 5) {
country = substr[4];
postcode = substr[3];
county = substr[2];
city = substr[1];
addone = substr[0];
} else if (substr.length == 6) {
country = substr[5];
postcode = substr[4];
county = substr[3];
city = substr[2];
addtwo = substr[1]
addone = substr[0];
}
// do something here with the array
});
});

Categories