First two lines are from js file where value is fetching through id.
var activity = document.getElementById("bactivity").value;
var activity1 = activity.options[activity.selectedIndex].value;
<select style="font-size:15px" ng-model="activity" value="Enter activity" id="bactivity">
<option selected>select</option>
<option value="Fitness">Fitness</option>
<option value="Aerobics">Aerobics</option>
<option value="Dance">Dance</option>
<option value="Martial arts">Martial arts</option>
<option value="Boxing">Boxing</option>
<option value="Athletics">Athletics</option>
</select>
the above code is from html file where I am displaying data in form of dropdown and when I am selecting any value it generate error that option is invalid. Some tell what was my mistake there so I can make it correct.
Herre you can find the working code, you just had to take the elements not their value (first 2 lines of code):
var activity = document.getElementById("bactivity");
var activity1 = activity.options[activity.selectedIndex];
<select style="font-size:15px" ng-model="activity" value="Enter activity" id="bactivity">
<option selected>select</option>
<option value="Fitness">Fitness</option>
<option value="Aerobics">Aerobics</option>
<option value="Dance">Dance</option>
<option value="Martial arts">Martial arts</option>
<option value="Boxing">Boxing</option>
<option value="Athletics">Athletics</option>
</select>
Related
I have this in my code
$this->Form->month('cc_month',['monthNames' => false]);
It generates the following code:
<select name="cc_month[month]">
<option value="" selected="selected"></option>
<option value="01">1</option>
<option value="02">2</option>
<option value="03">3</option>
<option value="04">4</option>
<option value="05">5</option>
<option value="06">6</option>
<option value="07">7</option>
<option value="08">8</option>
<option value="09">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
But I only want <select name="cc_month">, without the [month] prefix. How can I do that?
The method
Cake\View\Helper\FormHelper::month(string $fieldName, array $attributes)
is meant to be used with date related fields.
The property $fieldName will be used as a prefix for the HTML name attribute of the select element, as described in Creating Date & Time Related Controls.
In your case, I understand that field month stores an integer. You can use the following code to generate the appropriate SELECT tag:
echo $this->Form->select('cc_month',range(1,12))
I am trying to select one of the option , my code is pass but at UI no option get selected .
Here is HTML code:
<select name="ddlMarketSource" id="ddlMarketSource" class="select fontb selectchange" originalvalue="0" style="width:100px;">
<option selected="selected" value="0">Select</option>
<option value="1">Call In</option>
<option value="2">Fax</option>
<option value="3">Email</option>
<option value="4">SMS</option>
<option value="5">News(Includes EPRC, Cybernet, Newspaper)</option>
<option value="6">Cold Call</option>
<option value="7">Search</option>
<option value="8">Mortgage</option>
<option value="9">Referral</option>
<option value="10">N/A</option>
</select>
Here is my statement to select :
Select mrkSource = new Select(driver.findElement(By.xpath("//*[#id='ddlMarketSource']")));
mrkSource.selectByValue("1");
Your code works on my machine.
I have selenium 2.52.0 and Firefox 44.
Try to verify if you are selecting right element. In Chrome you can open console and write
$x("//*[#id='ddlMarketSource']")
to check your xpath.
<div class="field-wrap">
<select name=courses class="input-field1" name="state" title="state" ng-model="signup.state" >
<option value="">Select State</option>
<option value="Andaman and Nicobar Islands">Andaman and Nicobar Islands</option>
<option value="Andhra Pradesh">Andhra Pradesh</option>
<option value="Arunachal Pradesh">Arunachal Pradesh</option>
<option value="Assam">Assam</option>
<option value="Bihar">Bihar</option>
<option value="Chandigarh">Chandigarh</option>
<option value="Chhattisgarh">Chhattisgarh</option>
<option value="Dadra and Nagar Haveli">Dadra and Nagar Haveli</option>
<option value="Daman and Diu">Daman and Diu</option>
<option value="Delhi">Delhi</option>
<option value="Goa">Goa</option>
<option value="Gujarat">Gujarat</option>
<option value="Haryana">Haryana</option>
<option value="Himachal Pradesh">Himachal Pradesh</option>
<option value="Jammu and Kashmir">Jammu and Kashmir</option>
<option value="Jharkhand">Jharkhand</option>
<option value="Karnataka">Karnataka</option>
<option value="Kerala">Kerala</option>
<option value="Lakshadweep">Lakshadweep</option>
<option value="Madhya Pradesh">Madhya Pradesh</option>
<option value="Maharashtra">Maharashtra</option>
<option value="Manipur">Manipur</option>
<option value="Meghalaya">Meghalaya</option>
<option value="Mizoram">Mizoram</option>
<option value="Nagaland">Nagaland</option>
<option value="Orissa">Orissa</option>
<option value="Pondicherry">Pondicherry</option>
<option value="Punjab">Punjab</option>
<option value="Rajasthan">Rajasthan</option>
<option value="Sikkim">Sikkim</option>
<option value="Tamil Nadu">Tamil Nadu</option>
<option value="Tripura">Tripura</option>
<option value="Uttaranchal">Uttaranchal</option>
<option value="Uttar Pradesh">Uttar Pradesh</option>
<option value="West Bengal">West Bengal</option>
</select>
</div>
this is the select menu i am using i want to fetch the selected value in my controller but don't know how to do that, I already fetched the value for textbox but have no idea about the select box.
$scope.signupForm = function() {
if ($scope.signup_form.$valid) {
var data = {
firstname : $scope.signup_form.firstname.$modelValue,
lastname : $scope.signup_form.lastname.$modelValue,
email : $scope.signup_form.email.$modelValue,
mobileNumber : $scope.signup_form.mobileNumber.$modelValue,
district : $scope.signup_form.district.$modelValue,
state : $scope.signup_form.state.$modelValue,
course : $scope.signup_form.course.$modelValue,
collegeName : $scope.signup_form.collegeName.$modelValue,
};
This is my controller, I think I have to use ng-option but not sure.
Thanks
In your case $scope.signup.state will have value of selected state.
The value of selected option is saved into model assigned to dropdown
I'd suggest adding an array of options in your Controller instead of hardcoding it in the HTML and then use the ng-options directive to display the options from that array, you'd end up with something like:
<select name=courses class="input-field1" name="state" title="state" ng-model="signup.state" ng-options="option in options">
(where options is an array of options declared inside your controller
$scope.options = ['option1', 'option2'];
Then you can simply bind that input to an ng-model and use it regularly from the controller
$scope.signup.state
will give you access to whatever option is selected
You can use ng-change here. When ever an option is selected from the drop down then this method will be fired and we can persist the selected option data.
html
<div>
<select ng-model="selState" ng-change="selectedState(selState)"
data-ng-options="state as state.name for state in states">
<option value="">Select Account</option>
</select>
{{selectedState}}
</div>
script.js
myApp.controller('Ctrl', function($scope) {
$scope.states=[
{name:"AP"},
{name:"Karnataka"},
{name:"Tamilnadu"}
];
$scope.selectedState = function(item) {
alert(item.name);
};
Working Plunker
Hello I have a project on hand where I have to calculate how long a mom can expect her babies colic to last. They do this by selecting the age their babies colic started in weeks as well as how old their baby is currently. I then subtract their current age by the age their colic started and take that number and run it through an array that has assigned values for the left over number to get an overall percentage.
Here is the code I have so far:
<body onload='hideTotal()'>
<div id="wrap">
<form action="" id="colicStartForm" onsubmit="return false;">
<div>
<div class="cont_order">
<fieldset>
<h1>Colic Duration Calculator</h1>
<p>In 1954, Pediatrician Morris Wessel published a study on the behavior of infants with symptoms of inconsorable crying and developed the modern definition of colic known as the rule of threes (link to rule of three on colic page). His guidelines have been used ever since by Peditraicians to diagnose infant colic. Our tool below uses a statistical model derived from Wessles original clinical data to help you assess the how long your baby's colic will last. Please note this information is for educational and information purposes only and is not a substitute the advice of a qualified physician (link to disclaimer).</p>
<h2>When Will My Child's Colic End?</h2>
<p>At what age did your child begin crying inconsolably? </p>
<label >Weeks</label>
<select id="weeks" name='weeks' onchange="calculateTotal()">
<option value="0">Select Week</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
</select>
<br/>
<p>How old is your child now? </p>
<label >Weeks</label>
<select id="weeks2" name='weeks2' onchange="calculateTotal()">
<option value="0">Select Week</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
</select>
<br/>
<p>__________________</p>
<div id="totalPrice"></div>
</fieldset>
</div>
</div>
</form>
</div><!--End of wrap-->
</body>
Script
// Set up of Wessel data array
// The keys represent what percent of babies colic will end by that week
// The values represent the week
var wessel_data = new Array();
wessel_data[1]="1.196%";
wessel_data[2]="4.850%";
wessel_data[3]="12.288%";
wessel_data[4]="23.649%";
wessel_data[5]="37.528%";
wessel_data[6]="51.661%";
wessel_data[7]="64.002%";
wessel_data[8]="73.444%";
wessel_data[9]="79.891%";
wessel_data[10]="83.905%";
wessel_data[11]="86.263%";
wessel_data[12]="87.670%";
wessel_data[13]="88.635%";
wessel_data[14]="89.470%";
wessel_data[15]="90.336%";
wessel_data[16]="91.296%";
wessel_data[17]="92.347%";
wessel_data[18]="93.453%";
wessel_data[19]="94.561%";
wessel_data[20]="95.618%";
wessel_data[21]="96.579%";
wessel_data[22]="97.413%";
wessel_data[23]="98.106%";
wessel_data[24]="98.656%";
wessel_data[25]="99.077%";
wessel_data[26]="99.386%";
wessel_data[27]="99.604%";
wessel_data[28]="99.753%";
wessel_data[29]="99.851%";
wessel_data[30]="99.914%";
wessel_data[31]="99.952%";
wessel_data[32]="99.975%";
wessel_data[33]="99.988%";
wessel_data[34]="99.996%";
wessel_data[35]="100%";
var week = []; //set week to new empty array
for (var i = 0; i < 35; i++) //loop from 0 to 34 by increments of 1
{
week.push(i); //push (add) the element of the loops to week (an array)
}
function getWeeksStarted()
{
var weekStarted=0;
//Get a reference to the form id="colicStartForm"
var theForm = document.forms["colicStartForm"];
//Get a reference to the select id="weeks"
var selectedWeek = theForm.elements["weeks"];
//set week equal to value user chose
//For example week["1".value] would be equal to 1
weekStarted = week[selectedWeek.value];
//finally we return week
return weekStarted;
}
function getCurrentWeek()
{
var weekStarted=0;
//Get a reference to the form id="colicStartForm"
var theForm = document.forms["colicStartForm"];
//Get a reference to the select id="weeks2"
var selectedWeek = theForm.elements["weeks2"];
//set week equal to value user chose
//For example week["1".value] would be equal to 1
weekStarted = week[selectedWeek.value];
//finally we return week
return weekStarted;
}
function calculateTotal()
{
//Here we get the total weeks by calling our function
//Each function returns a number so by calling them we subtract the values they return together
var colicWeeks = getCurrentWeek() - getWeeksStarted();
var percentage = wessel_data[colicWeeks]; //since this will be an integer you can use it to index the array.
//display the result
var divobj = document.getElementById('totalPrice');
divobj.style.display='block';
divobj.innerHTML = "Your child has currently had colic for "+ colicWeeks + " weeks. The odds of your childs colic resolving in this timeframe is " + percentage;
}
function hideTotal()
{
var divobj = document.getElementById('totalPrice');
divobj.style.display='none';
}
I have the subtraction working so that I get the left over number from subtracting their current age minus the age their colic started. What I dont have working is taking that number and running it through the wessel_data array to get the percentage.
Updated
Now that the subtraction and the percentage are working I was wondering how to make it so the selections subtraction and percentage dont show until after the second select box is selected. Then I can show the results. I also want to take the result and show them set percentages of weeks based on which week is a set value of 80%, 95% and 99% so they will have some sort of idea of how much longer they have.
Any help would be appreciated.
For the show hide divobj would it be best to put it into an if else statement?
Since you are trying to use the number of weeks to determine the percentage, you should reverse the way you are indexing into your wessel_data. Right now, you would need the percentage to find the age, but if you reversed that like
wessel_data[1]= "1.196%";
wessel_data[2]= "4.850%"; //etc.
Or Using a static array assignment:
wessel_data = ["0%", //javascript array are 0-indexed
"1.196%",
"4.850%" //more elements comma-separated
];
Then your calculateTotal() might look something like:
function calculateTotal()
{
var colicWeeks = getCurrentWeek() - getWeeksStarted();
var percentage = wessel_data[colicWeeks]; //since this will be an integer you can use it to index the array.
//display the result
var divobj = document.getElementById('totalPrice');
divobj.style.display='block';
divobj.innerHTML = "The probability that your childs colic will end in "
+ colicWeeks + " weeks is " + percentage + "%";
}
On an unrelated note, your previous syntax of wessel_data["1.196%"]=1; is actually adding a property to the array object, instead of placing the data into the array itself.
A quick fiddle.
i am using a angular to populate an selectInput, but i want to use a "Custom" values in the option value
My current output
<select ng-change="getModels(selected.id)" ng-model="selected" ng-options="category.name for category in categories">
<option value="0">red</option>
<option value="1">green</option>
<option value="2">yellow</option>
</select>
My Json
$scope.categories = [
{id:1000, name:red}
{id:2000, name:green}
{id:3000, name:yellow}
}
and i want this output:
<select>
<option value="1000">red</option>
<option value="2000">green</option>
<option value="3000">yellow</option>
</select>
You can use track by expression like this:
<select
ng-options="category.id as category.name for category in categories track by category.id"
ng-model="selected">
</select>
Please see this jFiddle.