¿Por qué mi if-else no funciona correctamente en javascript?
Frecuentes
Visto 775 veces
-3
I have this form in which, when the order type selected is a market order the stop price and limit price should have value zero and should be readonly.
when i select limit order it should make stop price 0 and read only.
when i select stop order it should make limit price 0 and read only.
i m trying to use simple if-else in js. What am i doing wrong?
please try to avoid jquery. School project please. Thanks in advance...
I have my code below.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="ETcss.css" />
<script src="jquery-1.10.2.min.js"></script>
</head>
<body>
<div class="header">
<h1 style="font-family: Cambria; color: #F0F0F0;" align="center">Welcome User</h1>
<br>
</div>
<div class="sidemenu">
<ul>
<li>
<a href="pmHome.html">Home</a>
</li>
<li>
<a href="createOrder.html">Create Order</a>
</li>
</ul>
</div>
<div class="mainmenu">
<h1>Create Equity Order</h1>
<form action="">
<table>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Symbol :</td>
<td>
<input type="text" name="symbol" />
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Secutrity name :</td>
<td>
<input type="text" name="securityName" value="sapient" placeholder="sapient" />
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Side :</td>
<td>
<select>
<option>buy</option>
<option>sell</option>
</select>
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Order Type :</td>
<td>
<select id="orderType">
<option value="market" selected>market</option>
<option value="limit">limit</option>
<option value="stop">stop</option>
</select>
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Order Qualifiers :</td>
<td>
<select>
<option>day order</option>
<option>gtc</option>
</select>
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Trader :</td>
<td>
<select>
<option>trader1</option>
<option>trader2</option>
</select>
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Account Type :</td>
<td>
<select>
<option>cash</option>
<option>margin</option>
</select>
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Portfolio :</td>
<td>
<select>
<option>p1</option>
<option>p2</option>
</select>
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Stop Price :</td>
<td>
<input type="text" id="stopprice" name="stopprice" readonly="readonly" onfocus="this.blur()" />
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Limit Price :</td>
<td>
<input type="text" id="limitprice" name="limitprice" readonly="readonly" onfocus="this.blur()" />
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Qty :</td>
<td>
<input type="text" name="qty" />
</td>
</tr>
<tr>
<a href="pmHome.html">
<td colspan="2" align="center">
<input type="submit" onclick="display_alert()" value="Create Equity Order" />
</a>
</td>
</tr>
</table>
</form>
</div>
</body>
<script>
function updatePrice(el, priceLog, priceLog1, priceList) {
var e = document.getElementById("orderType");
var pricevalue = e.options[e.selectedIndex].text;
if (pricevalue.toLowerCase() == "market") {
priceLog.value = priceList[el.getElementsByTagName('option')[el.selectedIndex].value
.toLowerCase()];
priceLog1.value = priceList[el.getElementsByTagName('option')[el.selectedIndex].value
.toLowerCase()];
}
alert(pricevalue);
else if (pricevalue.toLowerCase() == "limit") {
document.getElementByName('limitprice').readOnly = false;
priceLog.value = priceList[el.getElementsByTagName('option')[el.selectedIndex].value
.toLowerCase()];
priceLog1.value = priceList[el.getElementsByTagName('option')[el.selectedIndex].value
.toLowerCase()];
} else if (pricevalue.toLowerCase() == "stop") {
document.getElementByName('stopprice').readOnly = false;
priceLog.value = priceList[el.getElementsByTagName('option')[el.selectedIndex].value
.toLowerCase()];
priceLog1.value = priceList[el.getElementsByTagName('option')[el.selectedIndex].value
.toLowerCase()];
}
}
var stopPrices = {
'market' : 0,
'limit' : 1,
'stop' : 2,
};
var limitPrices = {
'market' : 0,
'limit' : 1,
'stop' : 2,
};
var select = document.getElementById('orderType'), hidden = document
.getElementsByName('stopprice')[0];
hidden1 = document.getElementsByName('limitprice')[0];
select.addEventListener('change', function() {
updatePrice(select, hidden, hidden1, stopPrices);
});
</script>
</html>
2 Respuestas
1
Problemas
- Entre
if
yelse
you have put analert()
- ERROR DE SINTAXIS el
,e
yselect
are all same and have the value -document.getElementById('orderType')
.onfocus="this.blur()"
!!!, I am stopping here.
Hope this code will fix your issues -
<html>
<head>
<link rel="stylesheet" type="text/css" href="ETcss.css" />
<script src="jquery-1.10.2.min.js"></script>
</head>
<body>
<div class="header">
<h1 style="font-family: Cambria; color: #F0F0F0;" align="center">Welcome User</h1>
<br>
</div>
<div class="sidemenu">
<ul>
<li>
<a href="pmHome.html">Home</a>
</li>
<li>
<a href="createOrder.html">Create Order</a>
</li>
</ul>
</div>
<div class="mainmenu">
<h1>Create Equity Order</h1>
<form action="">
<table>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Symbol :</td>
<td>
<input type="text" name="symbol" />
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Secutrity name :</td>
<td>
<input type="text" name="securityName" value="sapient" placeholder="sapient" />
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Side :</td>
<td>
<select>
<option>buy</option>
<option>sell</option>
</select>
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Order Type :</td>
<td>
<select id="orderType">
<option value="market" selected>market</option>
<option value="limit">limit</option>
<option value="stop">stop</option>
</select>
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Order Qualifiers :</td>
<td>
<select>
<option>day order</option>
<option>gtc</option>
</select>
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Trader :</td>
<td>
<select>
<option>trader1</option>
<option>trader2</option>
</select>
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Account Type :</td>
<td>
<select>
<option>cash</option>
<option>margin</option>
</select>
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Portfolio :</td>
<td>
<select>
<option>p1</option>
<option>p2</option>
</select>
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Stop Price :</td>
<td>
<input type="text" id="stopprice" name="stopprice" readonly="readonly" />
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Limit Price :</td>
<td>
<input type="text" id="limitprice" name="limitprice" readonly="readonly" />
</td>
</tr>
<tr onmouseover="this.style.backgroundColor='#ffff66';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Qty :</td>
<td>
<input type="text" name="qty" />
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" onclick="display_alert()" value="Create Equity Order" />
</td>
</tr>
</table>
</form>
</div>
</body>
<script>
var select = document.getElementById('orderType');
var priceLog = document.getElementsByName('stopprice')[0];
var priceLog1 = document.getElementsByName('limitprice')[0];
var stopPrices = {
'market' : 0,
'limit' : 1,
'stop' : 2,
};
var limitPrices = {
'market' : 0,
'limit' : 1,
'stop' : 2,
};
select.addEventListener('change', updatePrice);
function updatePrice() {
var select = document.getElementById("orderType");
var selectedIndex = select.selectedIndex;
var pricevalue = select.options[selectedIndex].text.toLowerCase();
var selectedValue = select.options[selectedIndex].value.toLowerCase();
if (pricevalue == "market") {
priceLog.disabled = "disabled";
priceLog1.disabled = "disabled";
priceLog.value = 0;
priceLog1.value = 0;
} else if (pricevalue == "limit") {
priceLog1.disabled = "disabled";
priceLog.removeAttribute("disabled");
priceLog1.value = 0;
} else if (pricevalue == "stop") {
priceLog.disabled = "disabled";
priceLog1.removeAttribute("disabled");
priceLog.value = 0;
}
}
</script>
</html>
Respondido el 13 de Septiembre de 13 a las 17:09
actually it was not working earlier as well. so i put an alert in between just to see if its capturing the value or not... apart from that what could be wrong - anshul singh
did you try this code? because its not working on my side, sorry. can you please take a look at it again.. - anshul singh
Fixed all the issues and also took the liberty to cleaning up your code. Hope you wont mind. - moazzam khan
0
Correctly said by Moazzam Khan, there is a syntax alert as well as no of parameter :
select.addEventListener('change', function(){ updatePrice(document.getElementById('orderType'), document.getElementsByName('stopprice')[0], document.getElementsByName('limitprice')[0], stopPrices); },false);
Use the following script code:
<script>
function updatePrice (el, priceLog, priceLog1, priceList) {
try{
var e = document.getElementById("orderType");
var pricevalue = e.options[e.selectedIndex].text;
if(pricevalue.toLowerCase() == "market"){
priceLog.value = priceList[el.getElementsByTagName('option')[el.selectedIndex].value.toLowerCase()];
priceLog1.value = priceList[el.getElementsByTagName('option')[el.selectedIndex].value.toLowerCase()];
}
else if(pricevalue.toLowerCase() == "limit"){
document.getElementByName('limitprice').readOnly = false;
priceLog.value = priceList[el.getElementsByTagName('option')[el.selectedIndex].value.toLowerCase()];
priceLog1.value =priceList[el.getElementsByTagName('option')[el.selectedIndex].value.toLowerCase()];
}
else if(pricevalue.toLowerCase() == "stop"){
document.getElementByName('stopprice').readOnly = false;
priceLog.value = priceList[el.getElementsByTagName('option')[el.selectedIndex].value.toLowerCase()];
priceLog1.value = priceList[el.getElementsByTagName('option')[el.selectedIndex].value.toLowerCase()];
}
}
catch(err)
{
}
}
var stopPrices = {
'market' : 0,
'limit' : 1,
'stop' : 2,
};
var limitPrices={
'market' : 0,
'limit' : 1,
'stop' : 2,
};
var select = document.getElementById('orderType'),
hidden = document.getElementsByName('stopprice')[0];
hidden1= document.getElementsByName('limitprice')[0];
select.addEventListener('change', function(){
updatePrice(document.getElementById('orderType'), document.getElementsByName('stopprice')[0], document.getElementsByName('limitprice')[0], stopPrices);
},false);
</script>
Respondido el 13 de Septiembre de 13 a las 12:09
No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas javascript jquery or haz tu propia pregunta.
utilizan el
===
en lugar de==
- baamNunca poner
td
dentro<a>
- Moazzam KhanIt's not a good idea to put an "alert()" between if and else if statement - Oliboy50
Pls format your code a bit ; and show us the problematic code only instead of copying the whole code. - Sahil Mittal
@Oliboy50 more exactly, it produces a syntax error - John Dvorak