|
JavaScript - Javascript Onchange Method
Hello,
i wrote this code, But is not working, i want to use onChange event and redirect user into a url accordingly. this is my code; <script type="text/javascript"> function goto() { var URL = document.frmsort.optsort.options[document.optsort.optsort.selectedIndex].value; window.location.href = URL; } </script> <form id="frmsort" name="frmsort" action="http://localhost/APP/category.php" method="post"> <select name="urls" onChange="goto()"> <option value="http://localhost/APP/category.php?sub=1">-- choose option --</option> <option value="http://localhost/APP/category.php?sub=1&sort=1">OP1</option> <option value="http://localhost/APP/category.php?sub=1&sort=2">OP2</option> </select> </form> I really appreciate your help... thank you... Similar TutorialsHi everyone. i hope you could help me for my problem. I want to place a value in the option when i change the contenent. ie when i select North America It shoulde be <option value='1'>Canada</option><option value='2'>United States</option> and so on and so fort... Please help. Code: <script type="text/javascript">
//<![CDATA[
// array of possible countries in the same order as they appear in the country selection list
var countryLists = new Array(4)
ccountryLists["empty"] = ["Select a Country"];
countryLists["North America"] = ["Canada", "United States", "Mexico"];
countryLists["South America"] = ["Brazil", "Argentina", "Chile", "Ecuador"];
countryLists["Asia"] = ["Russia", "China", "Japan"];
countryLists["Europe"]= ["Britain", "France", "Spain", "Germany"];
/* CountryChange() is called from the onchange event of a select element.
* param selectObj - the select object which fired the on change event.
*/
function countryChange(selectObj) {
// get the index of the selected option
var idx = selectObj.selectedIndex;
// get the value of the selected option
var which = selectObj.options[idx].value;
// use the selected option value to retrieve the list of items from the countryLists array
cList = countryLists[which];
// get the country select element via its known id
var cSelect = document.getElementById("country");
// remove the current options from the country select
var len=cSelect.options.length;
while (cSelect.options.length > 0) {
cSelect.remove(0);
}
var newOption;
// create new options
for (var i=0; i<cList.length; i++) {
newOption = document.createElement("option");
newOption.value = cList[i]; // assumes option string and value are the same
newOption.text=cList[i];
// add the new option
try {
cSelect.add(newOption); // this will fail in DOM browsers but is needed for IE
}
catch (e) {
cSelect.appendChild(newOption);
}
}
}
//]]>
</script>
Code: <noscript>This page requires JavaScript be available and enabled to function properly</noscript>
<h1>Dynamic Select Statements</h1>
<label for="continent">Select Continent</label>
<select id="continent" onchange="countryChange(this);">
<option value="empty">Select a Continent</option>
<option value="1">North America</option>
<option value="2">South America</option>
<option value="3">Asia</option>
<option value="4">Europe</option>
</select>
<br/>
<label for="country">Select a country</label>
<select id="country">
<option value="0">Select a country</option>
</select>
Problem with onchange Javascript Hi, I have a variable declarared called minute which chanches every 3 minutes. if the variable output changes i want to call a href not using onclick but my trigger the change of my varable "minute" in detail <div> <input type="text" size="11" id="loadvideoid" value="u1zgFlCw8Aw" /> <a href="javascript:void(0)" onclick="loadNewVideo(document.getElementById('loadvideoid').value, document.getElementById('startseconds').value)"><- Load video</a> | Start at: <input type="text" size="4" id="startseconds" value="0" /> </div> The part of the script above is coming from http://code.google.com/intl/nl/apis/...example_1.html Have sombody a hint or a script for me how to do this PS i am a newbee, and want to learn !!! Thanks in advance Simon Netherlands Hoorn Hello, I am working on a CGI/Ajax application to interface with a database. I have the back-end Perl/CGI application working, so now it it is time to design the web interface and respective forms. So here goes, I am attempting to create dynamic list boxes, but I am unable to pass a value to the 'onChange' event. Here is my code (this is a proof of concept and highly stripped down): Code: <html>
<head>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
var array = [ 'name', 'age', 'year'];
function init(sel_val){
for (var i = 0; i < array.length; i++){
document.write(i + " " + array[i] + "<br />");
}
for (var i = 0; i< array.length; i++){
document.product.id_type.options[i] = new Option(i + array[i], i);
}
}
function OnChange(sel_val) {
// for(i = document.product.id_style.length - 1; i > 0; i--)
// document.product.id_style.options[i] = null;
// document.product.id_style.options[0] = new Option("something else", 15);
alert("pressed" + " " + sel_val + "<br />");
}
</script>
<form name="product">
<select name="id_type" size="5" style="width: 150px;" onChange="OnChange()"></select>
<select name="id_style" size="5" style="width: 150px;" ></select>
</form>
<script>
init();
</script>
</body>
</html>
I'm well versed in Perl and Java but I am a JavaScript newbie, so go easy. I understand that sel_val is not being set, but I'm not sure how it should (or could) be set. I would like to use a hash instead of integer values for `i` document.product.id_type.options[i] = new Option(i + array[i], i); becomes document.product.id_type.options[i] = new Option(hash[key], key); Any thoughts, comments, criticisms, jokes are welcome. Thanks in advance for the assist. Trying to get the divs to switch style properties when selected form select menu. Any help would be great! Code: <script type="text/javascript">
function showstuff(element){
if(document.getElementById(element).style.display = 'block')
{
document.getElementById(have).style.visibility="block";
document.getElementById(look).style.visibility="none";
}
else if(document.getElementById(element).style.visibility = 'block')
{
document.getElementById(look).style.visibility="block";
document.getElementById(have).style.visibility="none";
}
}
</script>
<select name="type" onchange="showstuff(this.value);">
<option value="look">Look</option>
<option value="have">Have</option>
</select>
<div id="have" style="display:block;">Have</div>
<div id="look" style="display:none;">Look</div>
You may have see various sites where urls are encoded by advertisement redirection service mostly by adf.ly now I want to write a personal java snippet for tor remove this spam [In opera you can specify a custom js to run at every page] mostly the html will look like this Code: <a target="_blank" href="http://adf.ly/246619/http://www.mediafire.com/download.php?lg5z42ra13ac9hi">SteamTable App</a> I want to use .split() method as you see this part http://adf.ly/246619/ [before the second http] has to be splitted some how & url to be reinserted in the a tag. any help here would it be better to place the javascript into a .js file or just place the js code somewhere else in the html? How should it look? Code: <div style="width: 225px; height: 155px; float: left; height: 16px; background-color: #000000; color: #FFFFFF; margin-left: 0px; margin-bottom: 0px; font-size: small; padding-left: 0px;">
<img alt="" src="images/news.png" height="16" width="222" /><div style="width: 225px; height: 155px; float: left;"><script type="text/javascript">// <![CDATA[if(document.layers){document.write('<ilayer id="ns4div" width="'+swidth+'" height="'+sheight+'" bgcolor='+sbcolor+'><div id="ns4div1" width="'+swidth+'" height="'+sheight+'" onmouseover="sspeed=0;" onmouseout="sspeed=rspeed"></div></ilayer>')}
if(document.getElementById||document.all){document.write('<div style="position:relative;overflow:hidden;width:'+swidth+'px;height:'+sheight+'px;clip:rect(0 '+swidth+'px '+sheight+'px 0);background-color:'+sbcolor+';" onmouseover="sspeed=0" onmouseout="sspeed=rspeed"><div id="iens6div" style="position:relative;width:'+swidth+'px;"></div></div>');} // ]]></script>
</div></div>
Hey peeps, I'm trying to use wget to access this website that uses javascript. The website is from my work. Basically I made a program that parses information from our payment page. It tells me how much I am being paid for the month. Anywho, the variables on the page are in javascript, and thats one language I'm not proficient at. I need to change the month that it gets the pay for. The default is the current month. But it can be changed to last month, and from the code I can tell that something has to be changed from "THIS_MONTH" to "LAST_MONTH", but I'm not sure how to properly do it. Posted below is the source code from the website. Please let me know how I can change that without actually having to click the button to change the scope to last month. And also, is there any way to change this in the post method, or any other method that wget uses? I only included the parts I thought could be relevant. Thanks guys! BTW, I think it pertains with g_FiltersMenuStr Code:
<title>SupportSpace - Tech Support for Computers, Printer, Security, Gadgets...</title>
<meta name = "description" content = "get immediate tech support for your PC / Computer, Printers, Outlook / Email Setup, Wireless, Networking, Anti-Virus & Security, Spyware, XP, Vista, I-Pod, MP3 Player Setup, Zune, Printer Setup, Backup Services for your Documents & Many other online live support"/>
<meta name = "keywords" content = "online live tech support PC Computer Printers Outlook Email Setup Wireless Networking AntiVirus Security Spyware XP Vista IPod MP3 Player Zune Printer Setup Backup Services hardware software help chat"/>
<meta name = "language" content = "English"/>
<link REL="SHORTCUT ICON" HREF="/support/images//icons/shortcut_icon.ico"/>
<script type="text/javascript">if(!JAWR){var JAWR = {};};;JAWR.jawr_dwr_path='/support/dwr';JAWR.dwr_scriptSessionId='CCA333F742C70F495236AA2C97D653D2';JAWR.app_context_path='/support';</script>
<link rel="stylesheet" type="text/css" media="screen" href="/support/styles/31289092/bundles/common_connection.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/support/styles/1893248551/bundles/sessionHistory.css" />
</head>
<script type="text/javascript">if(!JAWR){var JAWR = {};};;JAWR.jawr_dwr_path='/support/dwr';JAWR.dwr_scriptSessionId='BF92335E3E86FC7586F1F5BFB96E81FB';JAWR.app_context_path='/support';</script>
<script type="text/javascript" src="/support/scripts/122785183/bundles/common.js" ></script>
<body class="supportspace">
<script type="text/javascript">
var jabberConnectorSrc = "/support/extra_scripts/1.23a1.6/flashconnector/jabberConnector.swf";
if (!!(window.attachEvent && !window.opera)){
document.write('\
<OBJECT id="jabberConnector" dontRewriteMe=true codeBase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" height="1" width="1" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000">\
<PARAM value="'+jabberConnectorSrc+'" name="Src" />\
</OBJECT>');
}
else{
document.write('<embed swliveconnect="true" name="jabberConnector" id="jabberConnector" src="'+jabberConnectorSrc+'" quality=low height="1" width="1" type="application/x-shockwave-flash"></embed>');
}
</script>
<!--[if lt IE 7]>
<style>
#dSSLogo{position:relative}
</style>
<![endif]-->
<div id="dHeader">
<div id="dHeader_1" class="center s2DarkGray">
<div id="dSSLogo" onclick="document.location = 'http://www.supportspace.com/support/'"></div>
<div class="rightLinks">
<div id="dHeaderLinks" style='display:none;' class='invisible'>
<div class="dHeaderLink"><a class="mainlevel-trans" href="javascript:void(0);" id="dSigninMenu">Sign In</a></div>
<div class="dHeaderLinksSep">|</div>
<div class="dHeaderLink"><a class="mainlevel-trans" href="https://www.supportspace.com/support/affiliates.s2?aiu=UserRegistration" id="headerSecondMenu">Register</a></div>
<div class="dHeaderLinksSep">|</div>
<div class="dHeaderLink"><a class="mainlevel-trans" href="http://corporate.supportspace.com/about_us">About Us</a></div>
<div class="dHeaderLinksSep">|</div>
<div class="dHeaderLink"><a class="mainlevel-trans" href="http://www.supportspace.com/support/faq.s2" id="menuHelp">Help</a></div>
</div>
<div id="dHeaderLinksAfterLogin" class='visible'>
<div id="dHeaderMailNotification">
<a id="nomailNotification" class="s2LightGray nounderline" href="http://www.supportspace.com/support/inbox.s2">(<span class="nbNewOfflineMessagesHeader">0</span>) <img src="/support/images/offline_messages/message_icon_grey_16x14.gif" alt="" title="" width="16" height="14" align="absmiddle" border="0"/></a>
<a id="mailNotification" style="display:none" class="s2Blue nounderline" href="http://www.supportspace.com/support/inbox.s2">(<span class="nbNewOfflineMessagesHeader">0</span>) <img src="/support/images/offline_messages/message_icon_blue_16x14.gif" alt="" title="" width="16" height="14" align="absmiddle" border="0"/></a>
</div>
<div id="dHeaderWelcome" class="dHeaderWelcome">Hello </div>
<div style="float:left;">
<table cellpadding=0 cellspacing=0 border=0>
<tr>
<td width="5">|</td>
<td>
<a id="dMySpaceMenu" class="mainlevel-trans" href="#">My Account</a>
<ul id="dMySpaceMenuContent" class="menu" style="display:none;"></ul>
</td>
<td width="5">|</td>
<td><a id="dSignOut" class="mainlevel-trans" href="http://www.supportspace.com/support/j_spring_security_logout">Sign Out</a></td>
<td width="5">|</td>
<td><a class="mainlevel-trans" href="http://corporate.supportspace.com/about_us">About Us</a></td>
<td width="5">|</td>
<td><a id="menuHelpAfter" class="mainlevel-trans" href="http://www.supportspace.com/support/faq.s2">Help</a></td>
</tr>
</table>
</div>
</div>
</div>
<div style="clear:both;"></div>
</div>
<div id="dHeader_2" class="center">
<div id="dHeaderMenus">
<div>
<a href="http://www.supportspace.com/support/" onclick="this.blur()" title="SupportSpace homepage" tabindex="1" id="menuHome">
<img src="/support/images/header/home_btn_regular.gif" alt="" width="127" height="32"/>
</a>
</div>
<div>
<a href="http://www.supportspace.com/support/expert" onclick="this.blur()" id="menuExperts" title="Search for online experts">
<img src="/support/images/header/experts_btn_regular.gif" alt="" width="127" height="32"/>
</a>
</div>
<div>
<a href="http://www.supportspace.com/support/services" onclick="this.blur()" id="menuPackages" title="Search for featured support services">
<img src="/support/images/header/services_btn_regular.gif" alt="" width="127" height="32"/>
</a>
</div>
</div>
<div id="dSearchBox">
<div id="dSearchBoxQuery">
<input type="text" id="searchBoxQuery" style="color:#7C7C7C" name="searchBoxQuery" value="Search" onkeypress="submitEnter(this,event,runExternalSearch)">
</div>
<div id="dSearchBoxGo">
<img id="dSearchBoxGoBtn" width="22" height="22" border="0" alt="Search"
src="/support/images/header/search_icon_regular_22x22.gif"
onmouseout="this.src='/support/images/header/search_icon_regular_22x22.gif'"
onmouseup="this.src='/support/images/header/search_icon_regular_22x22.gif'"
onmouseover="this.src='/support/images/header/search_icon_mouse_over_22x22.gif'"
onmousedown="this.src='/support/images/header/search_icon_pressed_22x22.gif'"
/>
</div>
<div style="clear:both;"></div>
</div>
</div>
<div class="clearboth"></div>
</div>
<div id="dTemplateBody" class="center">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td class="leftPanel" >
<div >
<div class="getHelp box">
<div class="title"><img src="/support/images/header/menu_get_help.gif" width="170" height="27" alt="Get help on products"></div>
<div class="s2Gray productList content">
<ul>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/Virus_-_Spyware" title="Virus - Spyware">Virus - Spyware</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/Printers" title="Printers">Printers</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/PC_Support" title="PC Support">PC Support</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/Windows" title="Windows">Windows</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/Security" title="Security">Security</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/Backup" title="Backup">Backup</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/PC_to_PC_Transfer" title="PC to PC Transfer">PC to PC Transfer</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/Wireless_Network" title="Wireless Network">Wireless Network</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/Email_and_Internet" title="Email and Internet">Email and Internet</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/Browsers" title="Browsers">Browsers</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/iPod_and_MP3" title="iPod and MP3">iPod and MP3</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/Camera_-_Photo" title="Camera - Photo">Camera - Photo</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/Mobile_Phones" title="Mobile Phones">Mobile Phones</a></li>
<li class="product ellipsis"><a class="linkOnHover" href="http://www.supportspace.com/support/category/Green_PC" title="Green PC">Green PC</a></li>
</ul>
</div>
</div>
<div class="box howdoesitwork s2Gray">
<div class="title">
<img src="/support/images/left_pannel/menu_how_it_works_170x43.gif" width="170" height="43" alt=" ">
</div>
<div class="steps">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td><img src="/support/images/left_pannel/3_steps_1_icon_55x60.gif" width="55" height="60" alt=""/></td>
<td valign="top">
<p><span class="title bold">1.Choose</span><br/>
a service or an online expert.</p>
</td>
</tr>
<tr height="5"></tr>
<tr>
<td><img src="/support/images/left_pannel/3_steps_2_icon_55x60.gif" width="55" height="60" alt=""/></td>
<td valign="top">
<p><span class="title bold">2.Connect</span><br/>
to the expert and watch your problem being solved.</p>
</td>
</tr>
<tr height="5"></tr>
<tr>
<td><img src="/support/images/left_pannel/3_steps_3_icon_55x60.gif" width="55" height="60" alt=""/></td>
<td valign="top">
<p><span class="title bold">3.Done</span><br/>
Relax and rate your experience.</p>
</td>
</tr>
</table>
</div>
</div>
</div>
</td>
<td class="panelSpacer" > </td>
<td class="rightPanel" >
<div id="dBodyPage" class="bodyPage" >
<script type="text/javascript" src="/support/scripts/N1461701270/bundles/session_history.js" ></script>
<script type="text/javascript">
var gExternalParameterType = "";
var gSupportSessionId = "";
var gIsSupporter = true;
var gError = false;
var gExternalSessionFatalError = true;
var gDefaultFilterList = {};
gDefaultFilterList['SESSION_DATE'] = "";
gDefaultFilterList['SESSION_STATUS'] = "";
gDefaultFilterList['SESSION_TYPE'] = "";
gDefaultFilterList['SUPPORT_SESSION'] = "";
gDefaultFilterList["SESSION_DATE"] = "THIS_MONTH";
gDefaultFilterList["SESSION_TYPE"] = "PAID";
var gSHistoryStrings = {
error_feedback_add:"You cannot add feedback to this session.",
error_feedback_fatal:"Required session is not availible. You cannot add feedback.",
error_session_report_add:"You cannot edit the solution report for this session.",
error_session_report_fatal:"Required session is not available. You cannot edit the solution report."
}
var g_FiltersMenuStr = {
"SESSION_DATE":"Date",
"SESSION_DATE.TODAY":"Today",
"SESSION_DATE.YESTERDAY":"Yesterday",
"SESSION_DATE.THIS_WEEK":"This week",
"SESSION_DATE.LAST_WEEK":"Last week",
"SESSION_DATE.THIS_MONTH":"This Month",
"SESSION_DATE.LAST_MONTH":"Last month",
"SESSION_DATE.LAST_6_MONTH":"Last 6 months",
"SESSION_DATE.THIS_YEAR":"This year (2011)",
"SESSION_DATE.LAST_YEAR_AND_EARLIER":"Earlier than (2011)",
"SESSION_STATUS":"Status",
"SESSION_STATUS.UNRESOLVED":"Unresolved",
"SESSION_STATUS.ENDED_BEFORE_PAYMENT":"Ended before payment",
"SESSION_STATUS.FORWARDED":"Forwarded",
"SESSION_STATUS.DISPATCHED":"Dispatched",
"SESSION_STATUS.RESOLVED":"Resolved",
"SESSION_STATUS.UNCOMPLETED":"Uncompleted",
"SESSION_STATUS.IN_PROGRESS":"In progress",
"SESSION_STATUS.LEFT_OPEN":"Left Open",
"SESSION_TYPE":"Type",
"SESSION_TYPE.PAID":"Paid",
"SESSION_TYPE.FREE_COUPON":"Free (Coupon)",
"SESSION_TYPE.FREE_EXPERT":"Free (Expert)",
"SUPPORT_SESSION":"Current Support Session",
"DEFAULT_FILTER_MENU":"Back to default",
"NO_FILTERS_MENU":"Clear all filters",
"NO_FILTERS_NOTE":"No filters (All sessions)"
};
var gSessionFeedbackHistoryUrl = "/support/sessionFeedbackHistory.s2";
var gSessionHistory = "/support/sessionHistory.s2";
var gSessionHistoryUrls = {
filter_empty:"http://images.supportspace.com/support/images/common/empty.gif",
filter_X:"http://images.supportspace.com/support/images/session_history/filter_X_mark.gif",
filter_V:"http://images.supportspace.com/support/images/session_history/filter_V_select.gif",
filter_arrow_white:"http://images.supportspace.com/support/images/session_history/filter_arrow_white.gif",
filter_arrow_grey:"http://images.supportspace.com/support/images/session_history/filter_arrow_grey.gif"
}
var g_experts;
</script>
<div id="dSHistoryPage">
<div class="dSmallPreloaderContainer"><div id="dSmallPreloader" style="display:none;"><img src="http://images.supportspace.com/support/images//common/preloader_16x16.gif" alt=""></div></div>
<h1 style="float:left">Session History</h1>
<div class="clearboth"></div>
<div id="dSHistoryContent">
<div id="dListBar" class="listBar">
<div id="dFiltersMenuButton">Filtered by: <img src="/support/images/session_history/filter_arrow_down.gif" alt=""/></div>
<div id="dFiltersSelected"></div>
<div class="displayedCounter">Displaying: 38</div>
</div>
<div id="dFiltersMenuContent"><div id="dFiltersMenuDivToReplace"></div></div>
<div class="clearboth"></div>
<div id="dSHistoryResults">
<script type="text/javascript">
var gSelectedFilters = {};
gSelectedFilters['SESSION_DATE'] = "";
gSelectedFilters['SESSION_STATUS'] = "";
gSelectedFilters['SESSION_TYPE'] = "";
gSelectedFilters['SUPPORT_SESSION'] = "";
gSelectedFilters["SESSION_DATE"] = "THIS_MONTH";
gSelectedFilters["SESSION_TYPE"] = "PAID";
(function(){
var dDisplayedCounter = $("dListBar") ? $("dListBar").down(".displayedCounter") : null;
if(dDisplayedCounter){
dDisplayedCounter.update("Displaying: 38");
}
}).defer();
var gSolutionReport;
</script>
<div class="dThreads">
<div id="dSessionHistoryError" style="display:none;"></div>
<script type="text/javascript">
if (typeof(window.g_experts) == "undefined" || !window.g_experts){
window.g_experts = [];
window.gIsAnExpertIsOnline = false;
}
g_experts.push({
id:193037,
supporterDynamicDetails:{
online4Customer:{
customer:{
id:""
},
customerCookie:""
},
supporterDisplayPresenceStatusForExpectedCustoemr:"online",
supporterDisplayPresenceStatus:"online"
},
displayUserName:"",
jabberUsername:"23a9ea173c4a7923ef41c9d6afa208d36ea1900f",
photoUri:"193037_1273126504113.gif"
});
</script>
I use this code in a form that posts to two different destinations, I use JavaScript to achieve it. Code: <SCRIPT type="text/javascript">
function submitTo(where) {
document.form.action = where;
document.form.submit();
}
</SCRIPT>
<FORM action="" method="post" name="form">
<DIV>
<INPUT onClick="return submitTo('1.html')" type="button" value="1">
<INPUT onClick="return submitTo('2.html')" type="button" value="2">
</DIV>
</FORM>
I am still wanting to do is the same thing, but with drop down menu's (SELECT) instead of INPUT. Is there anyone clever that can think of a solution? I'm still trying to work on it, but haven't thought of anything up yet.. I'm designing a page that uses javascript+css for enhanced interaction. However, if javascript is disabled, I'd still like the page to be functional, albeit less fancy. Likewise, if css is disabled, it still needs to be functional. Finally, if both js+css are disabled, the page will be quite bare but still usable. For example, I use javascript to set a css style that hides certain panels of content. JS is used to toggle these and all is fine. If JS is disabled, then the css isn't applied, and all the content is visible (though not too pretty). If CSS is disabled, the inline CSS applied by the JS works fine. Finally, if both are disabled, all the content is visible. I'm wondering what's the best way to do this. Currently, I set the styles like this in the js file: Code: function initialize() {
// set styles, for example:
document.getElementById("panel").style.display = "none";
}
var onloadFlag = false;
document.onreadystatechange = function() {
if (!onloadFlag) {
onloadFlag = true;
initialize();
}
};
// for older browsers
window.onload = function() {
if (!onloadFlag) {
onloadFlag = true;
initialize();
}
};
The problem that sometimes comes up is I see the "fallback" styles briefly, before the JS kicks in and applies the enhanced css. How can I avoid this? Hi , I am inserting an image into a span tag by click on button and resize the image using resize_image_height_weight function. I am using two function to do this task. setImage setImage_w3Validation setImage function resize the image but fail on w3validation on my webpage( As per w3c there is no attribute onload for image tag.) To fix out this issue I am using setImage_w3Validation function which pass on w3validation but unable to call resize_image_height_weight function. My purpose is to resize the image. Kindly suggest me how to do it? <html> <head> <script TYPE="text/javascript" language="javascript"> function resize_image_height_weight(id, hgt, wdth){ //alert(id); Obj=document.getElementById(id); myImage = new Image(); myImage.src = Obj.src; var heights = myImage.height; var widths = myImage.width; // alert("Height=>" + heights + " Width=> " + widths); if(heights > hgt || widths > wdth) { if(heights > widths) { var temp = heights/hgt; var new_width = widths / temp; new_width = parseInt(new_width); heights = hgt; widths = new_width; } else { var temp = widths/wdth; var new_height = heights / temp; new_height = parseInt(new_height); heights = new_height; widths = wdth; } } Obj.height = heights; Obj.width = widths; } function setImage(){ document.getElementById("IM0").innerHTML ="<center><img src=\"http://www.google.co.in/intl/en_com/images/srpr/logo1w.png\" id=\"img1\" alt=\"\" height=\"125\" width=\"125\" onload=\"resize_image_height_weight('img1',125,125);\"><\/center>"; } function setImage_w3Validation(){ document.getElementById("IM1").innerHTML ="<center><img src=\"http://www.google.co.in/intl/en_com/images/srpr/logo1w.png\" id=\"img2\" alt=\"\" height=\"125\" width=\"125\"><script type=\"text/javascript\">document.getElementById('img2').onload = function(){resize_image_height_weight('i12',125,125);};<\/SCRIPT><\/center>"; //I wanna to do the task using this one function to resize img for w3validation } function clear_page(){ document.getElementById("IM0").innerHTML =""; document.getElementById("IM1").innerHTML =""; } </script> </head> <body> <div class="img3"><span id="IM0"></span></div> <div class="img3"><span id="IM1"></span></div> <input type="button" name="btn1" value="Image Onload W3C Fail" onclick="setImage();"> <input type="button" name="btn2" value="Image Onload W3C Pass" onclick="setImage_w3Validation();"> <input type="button" name="btn2" value="Clear" onclick="clear_page();"> </body> </html> Why is the callwhy is the slice method only a method of an Array instance? The reason why I ask is because if you want to use it for the arguments property of function object, or a string, or an object, or a number instance, you are forced to use Array.prototype.slice.call(). And by doing that, you can pass in any type of object instance (Array, Number, String, Object) into it. So why not just default it as a method of all object instances built into the language? In other words, instead of doing this: Code: function Core(){
var obj = {a : 'a', b : 'b'};
var num = 1;
var string = 'aff';
console.log(typeof arguments);//Object
console.log(arguments instanceof Array);//false
var args1 = Array.prototype.slice.call(arguments);
console.log(args1);
var args2 = Array.prototype.slice.call(obj);
console.log(args2);
var args3 = Array.prototype.slice.call(num);
console.log(args3);
var args4 = Array.prototype.slice.call(string);
console.log(args4);
Core('dom','event','ajax');
Why not just be able to do this: Code: function Core(){
var obj = {a : 'a', b : 'b'};
var num = 1;
var string = 'aff';
var args = arguments.slice(0);
var args2 = obj.slice(0);
var args3 = num.slice(0);
var args4 = string.slice(0);
//right now none of the above would work but it's more convenient than using the call alternative.
}
Core('dom','event','ajax');
Why did the designers of the javascript scripting language make this decision? Thanks for response. This is my first post. I am reading "Javascript The Good Parts" ~ The Method Invocation Pattern Page 28 and tried this, var myObject= { value:0, increment:function(inc){ this.value+= typeof inc==="number" ? inc:1; } } myObject.increment(2); alert(myObject.value); but alert(myObject.value); is returning a value of "2", when it should return "3". Can someone help? Reply With Quote 12-22-2014, 09:59 AM #2 rnd me View Profile View Forum Posts Visit Homepage Senior Coder Join Date Jun 2007 Location Urbana Posts 4,497 Thanks 11 Thanked 603 Times in 583 Posts 0+2=2, not 3; the code is working correctly. Code: <input type = "text" style ='display:none;' onchange="display_data_from_server(this.value)"/> Value inside that input is cahanged from js. Is there any reason that onchange would not happen ? i mean, it does not. Hi folks. I'm working on a calculator and need to use the 'onchange' function. Basically, the user selects the year (id=taxYear) and once the year is select (default is 2008) this year will appear in 2 different lines of the page under 2 seperate ID's(ageYear & totalYear). I've looked at a few example of the function but I'm still not sure how to approach it. At the moment the year changes once I hit the 'calculate' button but the onChange would obviously offer a better alternative with the date changing once 'taxYear' is changed. here is the script; Code: //check the year
var taxYear = document.getElementById('taxYear').options[document.getElementById('taxYear').selectedIndex].value;
document.getElementById('ageYear').innerHTML = taxYear;
document.getElementById('totalYear').innerHTML = taxYear;
Here is the jsp; Code: <tr>
<td align="left" width="203" colspan=""><p> Your Tax Year: </p></td>
<td align="left" >
<s:select name="taxYear" id="taxYear" list="#{'2008':'2008', '2009':'2009'}" theme="simple" />*
</td>
</tr>
<tr>
<td align="left" width="203"><p> Age at December 31st <span id="ageYear"></span></p></td>
<td align="left" colspan="1">
<s:textfield name="age" id="age" theme="simple" cssClass="text" value="30" /> *
<div id="errorage" class="warningmessage" style="display:none">
Please enter your Age to proceed.
</div>
</td>
</tr>
<tr>
<td colspan="2" class="basicboldtext">
<br/>
The total pension contribution you can make for year <span id="totalYear"></span> is €<span id="totalTax2"></span>
<br/>
</td>
</tr>
Appreciate any help on this! I have a onChange value
Code:
var people = [
["Timothy Conner", "1999-Present", "Age: 12", "Male", ""],
["Andrew Conner", "1992-Present", "Age: 19", "Male", ""]
];
var how = "Brothers";
function find()
{
if(document.getElementById("name").value == people [0] [0])
{
document.getElementById("desc").value = people [0] [1] + " " + people [0] [2] + " " + people [0] [3];
}
if(document.getElementById("name").value == people [1] [0])
{
document.getElementById("desc").value = people [1] [1] + " " + people [1] [2] + " " + people [1] [3];
}
document.getElementById("relateb").value = document.getElementById("name").value;
}
Code: Name: <input type="text" id="name" value="" onChange="find()"/> So for it to proses a name you must click out of a box is ther a way to make it instead of when you click out of it, it would immidiatly change? hi i have a form where i need to join fields from the form prior to submission to flow into a pdf form. here is the function PHP Code: <SCRIPT language='javascript' type='text/javascript'> function joinna(form, elemName, ttl) { form.bname.value = form.b_fname.value + ' ' + form.b_lname.value; } </script> here is what the form input looks like PHP Code: <input class="left" onBlur="mark(this,'#ffffff','#000000')" name="b_fname" size="20" maxlength="40" onFocus="nextfield ='cb_fname'; mark(this,'#FFFF99','#0000FF')" value="<?php echo $row['b_fname'];?>" onChange="joinna(this.form,'b_fname','p1f6');"> </span> <input class="left" onBlur="mark(this,'#ffffff','#000000')" name="b_lname" size="20" maxlength="40" onFocus="nextfield ='cb_fname'; mark(this,'#FFFF99','#0000FF')" value="<?php echo $row['b_lname'];?>" onChange="joinna(this.form,'b_lname','p1f6');"> </span> and here is the calc field PHP Code: <input type="hidden" NAME="bname" value="" Size="7" onBlur="mark(this,'#ffffff','#000000')" onFocus="blur();document.smartform.bname.focus()" onChange="this.form.b_fname.value + this.form.b_lname.value; joinna(this.form,'field');" > this works fine IF i manually insert something new into the b_fname field. but lets say a user pulls the for to edit, and then makes no changes, "bname" will remain blank. what i want to do is call the function and/or force an 'onchange' or do whatever so bname is not left blank in the event the user submits w/o making any changes to the form tia How can i change this code to do not duplicate the boxes when one option is selected in the same box as before? http://www.plpgolfandturf.com.au/rr/rrboxes_test.php Code: <script type="text/javascript">
function SetHTML2(type) {
//document.getElementById("1").style.display = "none"
//document.getElementById("2").style.display = "none"
//document.getElementById("3").style.display = "none"
//document.getElementById("4").style.display = "none"
//document.getElementById("1.1").style.display = "none"
//document.getElementById("1.2").style.display = "none"
//document.getElementById("1.3").style.display = "none"
//document.getElementById("1.4").style.display = "none"
document.getElementById("2.1").style.display = "none"
document.getElementById("2.2").style.display = "none"
document.getElementById("2.3").style.display = "none"
document.getElementById("2.4").style.display = "none"
document.getElementById("3.1").style.display = "none"
document.getElementById("3.2").style.display = "none"
document.getElementById("3.3").style.display = "none"
document.getElementById("3.4").style.display = "none"
document.getElementById("4.1").style.display = "none"
document.getElementById("4.2").style.display = "none"
document.getElementById("4.3").style.display = "none"
document.getElementById("4.4").style.display = "none"
document.getElementById("1.1.1").style.display = "none"
document.getElementById("1.1.2").style.display = "none"
document.getElementById("1.1.3").style.display = "none"
document.getElementById("1.1.4").style.display = "none"
document.getElementById("1.2.1").style.display = "none"
document.getElementById("1.2.2").style.display = "none"
document.getElementById("1.2.3").style.display = "none"
document.getElementById("1.2.4").style.display = "none"
document.getElementById("1.3.1").style.display = "none"
document.getElementById("1.3.2").style.display = "none"
document.getElementById("1.3.3").style.display = "none"
document.getElementById("1.3.4").style.display = "none"
document.getElementById("1.4.1").style.display = "none"
document.getElementById("1.4.2").style.display = "none"
document.getElementById("1.4.3").style.display = "none"
document.getElementById("1.4.4").style.display = "none"
document.getElementById(type).style.display = ""
}
</script>
<!--Display box -->
<font face="Verdana, Geneva, sans-serif" size="4" color="#FF0000"><br />
Search Parts</font><br />
<br />
<select onchange="SetHTML2(this.value)">
<option selected="selected">Choose your option</option>
<option value="1">Beck</option>
<option value="2">BobCat</option>
<option value="3">Briggs</option>
<option value="4">Yazoo</option>
</select>
<span id="1" style="display:none" ><br /><select onchange="SetHTML2(this.value)">
<option selected="selected">Choose your option</option>
<option value="1.1">Beck 1</option>
<option value="1.2">Beck 2</option>
<option value="1.3">Beck 3</option>
<option value="1.4">Beck 4</option>
</select></span>
<span id="2" style="display:none"><br /><select onchange="SetHTML2(this.value)">
<option selected="selected">Choose your option</option>
<option value="2.1">BobCat 1</option>
<option value="2.2">BobCat 2</option>
<option value="2.3">BobCat 3</option>
<option value="2.4">BobCat 4</option>
</select></span>
<span id="3" style="display:none"><br /><select onchange="SetHTML2(this.value)">
<option selected="selected">Choose your option</option>
<option value="3.1">Briggs 1</option>
<option value="3.2">Briggs 2</option>
<option value="3.3">Briggs 3</option>
<option value="3.4">Briggs 4</option>
</select></span>
<span id="4" style="display:none"><br /><select onchange="SetHTML2(this.value)">
<option selected="selected">Choose your option</option>
<option value="4.1">Yazoo 1</option>
<option value="4.2">Yazoo 2</option>
<option value="4.3">Yazoo 3</option>
<option value="4.4">Yazoo 4</option>
</select></span>
<span id="1.1" style="display:none"><br /><select onchange="SetHTML2(this.value)">
<option selected="selected">Choose your option</option>
<option value="1.1.1">Beck 1.1</option>
<option value="1.1.2">Beck 1.2</option>
<option value="1.1.3">Beck 1.3</option>
<option value="1.1.4">Beck 1.4</option>
</select></span>
<span id="1.2" style="display:none"><br /><select onchange="SetHTML2(this.value)">
<option selected="selected">Choose your option</option>
<option value="1.2.1">Beck 2.1</option>
<option value="1.2.2">Beck 2.2</option>
<option value="1.2.3">Beck 2.3</option>
<option value="1.2.4">Beck 2.4</option>
</select></span>
<span id="1.3" style="display:none"><br /><select onchange="SetHTML2(this.value)">
<option selected="selected">Choose your option</option>
<option value="1.3.1">Beck 3.1</option>
<option value="1.3.2">Beck 3.2</option>
<option value="1.3.3">Beck 3.3</option>
<option value="1.3.4">Beck 3.4</option>
</select></span>
<span id="1.4" style="display:none"><br /><select onchange="SetHTML2(this.value)">
<option selected="selected">Choose your option</option>
<option value="1.4.1">Beck 4.1</option>
<option value="1.4.2">Beck 4.2</option>
<option value="1.4.3">Beck 4.3</option>
<option value="1.4.4">Beck 4.4</option>
</select></span>
<span id="2.1" style="display:none"> text </span>
<span id="2.2" style="display:none"> text </span>
<span id="2.3" style="display:none"> text </span>
<span id="2.4" style="display:none"> text </span>
<span id="3.1" style="display:none"> text </span>
<span id="3.2" style="display:none"> text </span>
<span id="3.3" style="display:none"> text </span>
<span id="3.4" style="display:none"> text </span>
<span id="4.1" style="display:none"> text </span>
<span id="4.2" style="display:none"> text </span>
<span id="4.3" style="display:none"> text </span>
<span id="4.4" style="display:none"> text </span>
<span id="1.1.1" style="display:none"> text </span>
<span id="1.1.2" style="display:none"> text </span>
<span id="1.1.3" style="display:none"> text </span>
<span id="1.1.4" style="display:none"> text </span>
<span id="1.2.1" style="display:none"> text </span>
<span id="1.2.2" style="display:none"> text </span>
<span id="1.2.3" style="display:none"> text </span>
<span id="1.2.4" style="display:none"> text </span>
<span id="1.3.1" style="display:none"> text </span>
<span id="1.3.2" style="display:none"> text </span>
<span id="1.3.3" style="display:none"> text </span>
<span id="1.3.4" style="display:none"> text </span>
<span id="1.4.1" style="display:none"> text </span>
<span id="1.4.2" style="display:none"> text </span>
<span id="1.4.3" style="display:none"> text </span>
<span id="1.4.4" style="display:none"> text </span>
<br />
<br /><a href="http://www.plpgolfandturf.com.au/rr/rrboxes_test.php"><img src="http://www.plpgolfandturf.com.au/rr/bt2.png" border="0" /></a>
I have an onchange event JS working fine in IE, but not in FF. It's intended to reset an input field to zero when an adjacent drop-down menu value is changed. I've spent a half-hour looking for answers, and nothing has worked. Decided to post here in the hope there is a quick solution I've overlooked. TIA. Code: function resetInput()
{
y = document.getElementById("baseInput");
y.setAttribute("value","0");
}
And the HTML... Code:
<select id="baseMethod" onchange="resetInput()">
<option value="baseGrowth" selected="selected">Annual Growth Rate (%)</option>
<option value="baseTarget">Target Year Projection</option>
</select>
<input type="text" name="baseInput" id="baseInput" value="0" size="14" maxlength="14" /><br />
I'm trying to figure out how to call multiple functions within the same onchange attribute, associated in the same select object. I have a drop-down menu in which I can select MN, WI, and Other. I've worked it now so that when I select MN, a new drop-down menu appears in which I can select one of MN's Counties. I want to be able to do the same with WI and Other, but my code is only calling MN. Here it is: Code: <html>
<head>
<script="text/javascript">
function showMN(select)
{
select.form.MN.value=""; // reset the text box value
document.getElementById("MNBox").style.display =
select.value == "MN" ? "inline" : "none";
}
function showWI(select)
{
select.form.WI.value=""; // reset the text box value
document.getElementById("WIBox").style.display =
select.value == "WI" ? "inline" : "none";
}
function showOther(select)
{
select.form.otherState.value = ""; // reset the text box value
document.getElementById("otherBox").style.display =
select.value == "Other" ? "inline" : "none";
</script>
</head>
<body>
<select name="state" onchange="showMN(this);showWI(this);showOther(this)">
<option value="" selected="selected">Choose...</option>
<option value="MN">MN</option>
<option value="WI">WI</option>
<option value="Other">Other</option>
</select><font color="red">*</font>
<span id="MNBox" style="display:none">
County: <select name="MN">
<option value="" selected="selected">Choose...</option>
<option value="List of MN Counties">List of MN Counties</option> </select><font color="red">*</font>
<span id="WIBox" style="display:none">
County: <select name="WI">
<option value="" selected="selected">Choose...</option>
<option value="List of WI Counties">List of WI Counties</option>
</select><font color="red">*</font>
<span id="otherBox" style="display:none">
<input type="text" name="otherState" placeholder="Enter state here"/><font color="red">*</font> <input type="text" name="otherCounty" placeholder="Enter County here"</span>
</body>
</html>
Am I even close? Hi I'm a newbie. Please help me. I'm using Joomla. I've got a dropdown which reads the filename from the database. When the user selects it I want an onchange event to open the pdf. I've been at it for 2 days now. Code: <?php
$con = mysql_connect('localhost', 'root', '');
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("metnet", $con);
$sql="SELECT * FROM newsletter";
$result = mysql_query($sql);
echo "<form method='post'>";
$dropdown = "<select name='sname' onChange='location(this.form.sname)' >";
while($row = mysql_fetch_assoc($result)) {
$dropdown .= "\r\n<option value='{$row['fpath']}'>{$row['fpath']}</option>";
}
$dropdown .= "\r\n</select>";
echo $dropdown;
?>
|
|||||||