|
JavaScript - How To Connect Two Dropdowns?
Hello,
I am very new to HTML. Yesterday I have started learning HTML. I want to make two Dropdown but should be linked with each other. There value should change after click "go" button. In other word I want to make one html for Post Code/Pin Codes of my state. Please Help Me!!! I have made script till he <html> <body> <table width="500" border="0"> <tr> <td colspan="2" style="background-color:#FFA500;"> <h1>PIN CODES OF GOA</h1> </td> </tr> <tr valign="top"> <td style="background-color:#FFD700;width:100px;text-align:top;"> <b>GOA</b><br /> BEACHES<br /> CHURCHES<br /> BARS </td> <td style="background-color:#eeeeee;height:200px;width:400px;text-align:top;"> </body> </html> </body> <form> <select name="menu" style="width:200px;"="font-family:'Arial';color:#FFFFFF;background-color:#000000;font-size:10pt;"> <option value=VASCO</option> <option value=FATORDA</option> </select> <select name="menu" style="width:200px;"="font-family:'Arial';color:#FFFFFF;background-color:#000000;font-size:10pt;"> <option value="403802"</option> <option value="403602"</option> </select> <input type="button" onClick="location=this.form.menu.options[this.form.menu.selectedIndex].value;" value="GO" style="font-family:'Arial';color:#FFFFFF;background-color:#000000;font-size:10pt;"> </form> <script type="text/javascript"> tday =new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"); tmonth=new Array("January","February","March","April","May","June","July","August","September","October","Novem ber","December"); function GetClock(){ d = new Date(); nday = d.getDay(); nmonth = d.getMonth(); ndate = d.getDate(); nyear = d.getYear(); nhour = d.getHours(); nmin = d.getMinutes(); nsec = d.getSeconds(); if(nyear<1000) nyear=nyear+1900; if(nhour == 0) {ap = " AM";nhour = 12;} else if(nhour <= 11) {ap = " AM";} else if(nhour == 12) {ap = " PM";} else if(nhour >= 13) {ap = " PM";nhour -= 12;} if(nmin <= 9) {nmin = "0" +nmin;} if(nsec <= 9) {nsec = "0" +nsec;} document.getElementById('clockbox').innerHTML=""+tday[nday]+", "+tmonth[nmonth]+" "+ndate+", "+nyear+" "+nhour+":"+nmin+":"+nsec+ap+""; setTimeout("GetClock()", 1000); } window.onload=GetClock; </script> <div id="clockbox"></div> </td> </tr> <tr> <td colspan="2" style="background-color:#FFA500;text-align:center;"> Search Your Post Code</td> </tr> </table> Similar TutorialsI have a status page on my website, but I have multiple servers, and they cramp up the one page. I was wondering if it was possible if I could have a link that says "CSS Server Status" and it drops down with the code for the CSS server, and say for "SAMP Server Status" drops down with the code/html for the samp server. I haven't a clue about Javascript, so as much help as possible would be appretiated. Apologizes for the long post, I wanted to be thorough. I am not very familiar with Javascript at all, learning every day - but hopefully this has an easy fix. I'm making an application where students can select their SCHOOL in a dropdown, which based on the selection, displays a second dropdown containing CLASSES. This part works fine. It then converts the value of the dropdown-selection to an ID-number which is used pasted in a URL for that class's online schedule (Example: www. url.com/generator/school= '+chosenSchool+' class= '+chosenClass+' blablabla.aspx) - plus saves the ID to recognize the selection for later use. This also worked fine, before I added the more than one school. Now, whenever I select a SCHOOL and a CLASS, I get the correct SCHOOL but the CLASS is always the FIRST ID in the list (marked in red ), and I'm not sure why. I thought about creating different variables for each class-list, but there is really more than two, and I need the name of the variable to be the same (chosenSchool) for the storing and URL-input. Code:
$(function() {
$("#school").change(function() {
// DROPDOWN LIST WITH DIFFERENT SCHOOLS
var schoolValue = document.getElementById('dropdown-school').selectedIndex; // GETS THE DROPDOWN VALUE (0-1)
var schoolID = ["60690","60360"] // NEEDED ID
chosenSchool=schoolID[schoolValue] // CONVERTS TO ID
var selectedSchool = $("#school").val(); // MANAGE DROPDOWNS BELOW
// DISPLAYS DROPDOWN LIST WITH CLASSES FROM THE FIRST SCHOOL WHEN SELECTED
if(selectedSchool == "firstSchool") {
$("#firstSchool").show(); // SHOWS DROPDOWN IF THE RIGHT ONE
var firstClassValue = document.getElementById('classlist-1').selectedIndex; // GETS THE DROPDOWN VALUE (0-5)
var firstClassID =
[" 45B9D5AD-8E32 ","0A9261F7-8BC7E","307C7E8C-054E","B21D19A7-5076","99ECF5B8-E0E1","36B44988-006F""] // NEEDED ID
chosenClass=firstClassID[firstClassValue] // CONVERTS TO ID
}
else {
$("#firstSchool").hide(); // HIDES DROPDOWN IF NOT THE RIGHT ONE
}
// DISPLAYS DROPDOWN LIST WITH CLASSES FROM THE SECOND SCHOOL WHEN SELECTED
if(selectedSchool == "secondSchool") {
$("#secondSchool").show(); // SHOWS DROPDOWN IF THE RIGHT ONE
var secondClassValue = document.getElementById('classlist-2').selectedIndex; // GETS THE DROPDOWN VALUE (0-5)
var secondClassID =
[" 4EBF33E0E514 ","05F96E17-8DF9","4EA71DA6-5CCC","F7D08749-746E","0CA6F782-6B9D","BBD66276-752F"] // NEEDED ID
chosenClass=secondClassID[secondClassValue] // CONVERTS TO ID
}
else {
$("#secondSchool").hide(); // HIDES DROPDOWN IF NOT THE RIGHT ONE
}
});
$('#school').trigger('change'); // TRIGGERS THE CHANGE
});
// SAVES THE SELECTED VALUES
function saveSettings() {
localStorage.setItem('SCHOOL', chosenSchool); // SAVES SCHOOL ID-NUMBER
localStorage.setItem('CLASS', chosenClass); // SAVES CLASS ID-NUMBER
location.reload(true) // RELOAD WITH SAVED VALUES
}
// HTML:
SCHOOL DROPDOWN:
<select name="school" id="school">
<option value="val0">firstSchool</option>
<option value="val1">secondSchool</option>
</select>
CLASS DROPDOWN 1:
<select name="classlist-1" id="classlist-1">
<option value="val0">Class 1</option>
<option value="val1">Class 2</option>
<option value="val2">Class 3</option>
<option value="val3">Class 4</option>
<option value="val4">Class 5</option>
<option value="val5">Class 6</option>
</select>
CLASS DROPDOWN 2:
<select name="classlist-2" id="classlist-2">
<option value="val0">Class 1</option>
<option value="val1">Class 2</option>
<option value="val2">Class 3</option>
<option value="val3">Class 4</option>
<option value="val4">Class 5</option>
<option value="val5">Class 6</option>
</select>
So my "chosenClass" is always the ID marked red. Why? Appreciate and help I can get.. Thanks for reading. Please keep in mind that I have more than two schools and class-lists, and any misspellings might be because I changed some values to keep it simple. Regards, Andrew. Hi everyone. I am trying to have 2 sets of populated dropdowns (state,city). One for the billing address and the other one for shipping address. I read this article http://www.digimantra.com/technology...ered-dropdown/ and did it step by step. It worked when I had only a set of populated dropdowns but when I duplicated and edited the script, only the new script works. Can somebody tell me where I went wrong? Here's the code for the script: Code: <script type="text/javascript">
//define the absolute path to your php script here
var site_root='';
//function to create ajax object
function pullAjax(){
var a;
try{
a=new XMLHttpRequest()
}
catch(b)
{
try
{
a=new ActiveXObject("Msxml2.XMLHTTP")
}catch(b)
{
try
{
a=new ActiveXObject("Microsoft.XMLHTTP")
}
catch(b)
{
alert("Your browser broke!");return false
}
}
}
return a;
}
//this function does the ajax call, and appends cities into the second dropdown
function populate_cities(x)
{
obj=pullAjax();
var cities_list=document.getElementById('city');
obj.onreadystatechange=function()
{
if(obj.readyState==4)
{
//returns comma separated list of cities after successful ajax request
var tmp=obj.responseText;
//split function returns array of city
cities=tmp.split(',');
//if second dropdown already has some data, CLEAR it
if(cities_list.length>1)
clean_cities(cities_list);
//for loop to append the cities
var i=0;
for(i=0;i<cities.length;i++)
append_city(cities[i]);
}
};
obj.open("GET",site_root+"cities_data.php?state="+ x.value,true);
obj.send(null);
}
//this gets call in the for loop and creates the options for the dropdown
function append_city(city_value)
{
var cities_list=document.getElementById('city');
cities_list.options[cities_list.options.length]=new Option(city_value,city_value,false,false);
}
//CLEARs the dropdown
function clean_cities()
{
var cities_list=document.getElementById('city');
cities_list.options.length=1;
}
//autoloads the city list, when the page first loads
function autoload()
{
populate_cities(document.getElementById('state_pro vince'));
}
</script>
<script type="text/javascript">
//define the absolute path to your php script here
var site_root='';
//function to create ajax object
function pullAjax(){
var a;
try{
a=new XMLHttpRequest()
}
catch(b)
{
try
{
a=new ActiveXObject("Msxml2.XMLHTTP")
}catch(b)
{
try
{
a=new ActiveXObject("Microsoft.XMLHTTP")
}
catch(b)
{
alert("Your browser broke!");return false
}
}
}
return a;
}
//this function does the ajax call, and appends cities into the second dropdown
function populate_cities(x)
{
obj=pullAjax();
var cities_list=document.getElementById('shipping_city ');
obj.onreadystatechange=function()
{
if(obj.readyState==4)
{
//returns comma separated list of cities after successful ajax request
var tmp=obj.responseText;
//split function returns array of city
cities=tmp.split(',');
//if second dropdown already has some data, CLEAR it
if(cities_list.length>1)
clean_cities(cities_list);
//for loop to append the cities
var i=0;
for(i=0;i<cities.length;i++)
append_city(cities[i]);
}
};
obj.open("GET",site_root+"shipping_cities_data.php ?state="+x.value,true);
obj.send(null);
}
//this gets call in the for loop and creates the options for the dropdown
function append_city(city_value)
{
var cities_list=document.getElementById('shipping_city ');
cities_list.options[cities_list.options.length]=new Option(city_value,city_value,false,false);
}
//CLEARs the dropdown
function clean_cities()
{
var cities_list=document.getElementById('shipping_city ');
cities_list.options.length=1;
}
//autoloads the city list, when the page first loads
function autoload()
{
populate_cities(document.getElementById('shipping_ state_province'));
}
</script>
Thanks! D Hi, I've currently got a group of dropdowns that update a price total on my site. I want to add an 'add to cart' button too but this requires each drop down having 2 values (one to update total and one to go towards the 'add to cart button'). I've researched this but still have no idea how to go about getting 2 values from one dropdown though. What I've done is create an explanation page where I have one form for the running total, and then a completely seperate form for the add to cart. Both work independanly, but I want to effectively combine them. Here's the page: tigerfrog.co.uk/merge_codes.html code for running total is: Head Code: <script language="JavaScript" type="text/javascript">
function calc2(){
var totalStr = ''; // for testing only
var totalValue=0;
var DDL;
var cnt = 0; // for testing only
for (var j=1; j<=2; j++) {
DDL = document.getElementById('dropDownList'+j);
temp = DDL.options[DDL.selectedIndex].value;
totalValue += Number(temp);
if (DDL.selectedIndex != 0) { totalStr += '|'+temp; cnt++; } // cnt++ is for testing only
}
document.forms[0].total.value=totalValue;
}
</script>
Body Code: <form id="dropDownForm2" name="dropDownForm2"> <td class="style14"> <select id="dropDownList1" class="style10" name="D10" onchange="calc2();"> <option selected="" value="10">item1</option> <option value="20">item2</option> <option value="30">item3</option> </select> <br /> </td> <td class="style14"> <select id="dropDownList2" class="style10" name="D11" onchange="calc2();"> <option href="alloy.htm" selected="" value="11">item4</option> <option value="12">item5</option> <option value="13">item6</option> </select><br /> total </td> <input class="style10" name="total" onfocus="blur()" readonly="" size="4" style="width: 46px; height: 22px;" type="text" value="958" /></form> The code for the add to cart is: Code: <form action="http://www.romancart.com/cart.asp" method="post"> <input name="storeid" type="hidden" value="43579" /> <input name="itemcode" type="hidden" value="TF Series" />Frameset <select name="itemname2"> <option value="TF100" value="TF100">item1</option> <option value="TF300C" value="TF300">item2</option> <option value="TF400C" value="TF400">item3</option> </select><br /> Groupset <select name="itemname5"> <option value="SL T1" value1="SL T1">item4</option> <option value="SLR T1" value1="SLR T1">item5</option> </select><br /> <input type="submit" value="Add to basket" /> </form> If I had 2 values from each drop down in the first group of dropdowns then I could get it working, but I'm not sure how to do this. Any help will be great, Phil I've been trying to create a page with two forms that have drop downs in them. These drop downs are set to store information from the previous drop down and I can get one to work easliy but having two forms has got me stopped in my tracks. I'm new to this and new to the forums so any help is apeciated. Just go easy on me. heh! Under the function where it says function setOptions(chosen,theform) { var selbox = document.theform.opttwo; I tried changing 'theform' to 'myform1' and so forth but neither worked. Thanks again for your time and effort in helping me! Here's my code: Code: <html>
<head>
<SCRIPT TYPE="text/javascript">
<!--
function setOptions(chosen,theform) {
var selbox = document.theform.opttwo;
selbox.options.length = 0;
if (chosen == " ") {
selbox.options[selbox.options.length] = new Option('Please select one of the options above first',' ');
}
if (chosen == "1") {
selbox.options[selbox.options.length] = new Option('first choice - option one','oneone');
selbox.options[selbox.options.length] = new Option('first choice - option two','onetwo');
}
if (chosen == "2") {
selbox.options[selbox.options.length] = new Option('second choice - option one','twoone');
selbox.options[selbox.options.length] = new Option('second choice - option two','twotwo');
}
if (chosen == "3") {
selbox.options[selbox.options.length] = new Option('third choice - option one','threeone');
selbox.options[selbox.options.length] = new Option('third choice - option two','threetwo');
}
}
//-->
</SCRIPT>
</head>
<body link="#000066" vlink="#999999" alink="#FFFF00">
<table width="40%" height="447" border="0">
<tr>
<td><div align="left"><img src="images/topbar.jpg" width="740" height="29" border="0" usemap="#Map"></div></td>
</tr>
<tr>
<td height="332"> <p align="left"> </p>
<div align="left">
<table width="740" height="187" border="0" align="left">
<tr>
<td height="97" colspan="2"> <div align="center"></td>
</tr>
<tr>
<td width="49%" height="21"> <div align="center"><strong>Form One</strong></div></td>
<td width="51%"> <div align="center"><strong>Form Two</strong></div></td>
</tr>
<tr>
<td height="47"><form name="myform1">
<div align="center">
<p>
<select name="optone" size="1"
onchange="setOptions(document.myform1.optone.options[document.myform1.optone.selectedIndex].value,"myform1");">
<option value=" " selected="selected"> </option>
<option value="1">First Choice</option>
<option value="2">Second Choice</option>
<option value="3">Third Choice</option>
</select>
<br>
<br />
<select name="opttwo" size="1">
<option value=" " selected="selected">Please select one
of the options above first</option>
</select>
<br>
<br />
<input type="submit" name="go" value="Submit"
onclick="alert(document.myform1.opttwo.options[document.myform1.opttwo.selectedIndex].value);">
</p>
</div>
</form></td>
<td><form name="myform2">
<div align="center">
<p>
<select name="optone" size="1"
onchange="setOptions(document.myform2.optone.options[document.myform2.optone.selectedIndex].value,"myform2");">
<option value=" " selected="selected"> </option>
<option value="1">First Choice</option>
<option value="2">Second Choice</option>
<option value="3">Third Choice</option>
</select>
<br>
<br />
<select name="opttwo" size="1">
<option value=" " selected="selected">Please select one
of the options above first</option>
</select>
<br>
<br />
<input type="submit" name="go" value="Submit"
onclick="alert(document.myform2.opttwo.options[document.myform2.opttwo.selectedIndex].value);">
</p>
</div>
</form></td>
</tr>
</table>
</div>
<p align="left"> </p>
<p align="left"> </p></td>
</tr>
<tr>
<td bgcolor="#FFFFFF"><div align="left"><img src="images/bottombar.jpg" width="740" height="16"></div></td>
</tr>
<tr>
<td height="56"> <div align="center"></td>
</tr>
</table>
</body>
</html>
I'm looking for four level connected drop down boxes. Unlike all the scripts I have seen on the internet I need all the options to be available if nothing is selected in the previous drop down. So I want something like combination of connected drop downs and ordinary drop down. If the selection is made, display appropriate options in other drop downs... Hope I'm clear... Ex: If I had three properties in Spain, ----------------------------------------------------------------------------------------------------------- | -------- Country: Spain --------- | -------- Country: Spain --------- | -------- Country: Spain ---------- | | -------- State: Andalusia ------- | -------- State: Andalusia -------- | -------- State: Catalonia --------- | | -------- District: Malaga -------- | -------- District: Granada ------- | -------- District: Barcelona ------- | | -------- Town: Marbella --------- | -------- Town: Motril ----------- | --------- Town: Badalona -------- | ----------------------------------------------------------------------------------------------------------- it should show me all the list of available locations, but when I choose Andalusia, it would only show two rest locations – Malaga and Granada, and the same rule when choosing district – Malaga->Marbella Can anyone please help? I need it very much... Thanks in advance! Hi, I have mutiple dropdowns in my HTML table in one of the columns.The dropdowns have three values 'Blank','Approve' and 'Reject'.What I want is when user changes the values in any of the dropdown,It will ask for the confirmation from user.If user click OK ,it will change the value in dropdown and calls another function else it will be reset to previous value.e.g, Suppose previous value is 'Reject' and user tries to change it to 'Approve'.When confirm window comes up and user clicks cancel it will reset to Reject.On OK it will change to 'Approve'. How can I handle this in Javascript? Please help. Thanks, Anil I have a page with 6 dependant drop down boxes. I also have a text field with a copy to clipboard button. What I need it to do is send the drop down selections to the text field to be copied along with some static text. The resulting text field would look something like this after the selections are made. "Per Wizard: Choice 0: Selection 2, Choice 1: Selection 2, Choice 2: Selection 4 ..." Can this be done on each line as a second onChange event? Code: <html>
<head>
<HEAD>
<script type="text/javascript">
<!--
var arrItems1 = new Array();
var arrItemsGrp1 = new Array();
arrItems1[1] = "Selection 1";
arrItemsGrp1[1] = 1;
arrItems1[2] = "Selection 2";
arrItemsGrp1[2] = 1;
arrItems1[3] = "Selection 3";
arrItemsGrp1[3] = 1;
var arrItems2 = new Array();
var arrItemsGrp2 = new Array();
arrItems2[12] = "Selection 1";
arrItemsGrp2[12] = 1
arrItems2[13] = "Selection 2";
arrItemsGrp2[13] = 1
arrItems2[14] = "Selection 3";
arrItemsGrp2[14] = 1
arrItems2[15] = "Selection 4";
arrItemsGrp2[15] = 1
arrItems2[16] = "Selection 5";
arrItemsGrp2[16] = 1
arrItems2[17] = "Selection 6";
arrItemsGrp2[17] = 1
var arrItems3 = new Array();
var arrItemsGrp3 = new Array();
arrItems3[42] = "Selection 1";
arrItemsGrp3[42] = 12
arrItems3[43] = "Selection 2";
arrItemsGrp3[43] = 12
arrItems3[44] = "Selection 3";
arrItemsGrp3[44] = 12
var arrItems4 = new Array();
var arrItemsGrp4 = new Array();
arrItems4[133] = "Selection 1";
arrItemsGrp4[133] = 42
var arrItems5 = new Array();
var arrItemsGrp5 = new Array();
arrItems5[244] = "Selection 1";
arrItemsGrp5[244] = 133
arrItems5[245] = "Selection 2";
arrItemsGrp5[245] = 133
function selectChange(control,nu){
var frm=control.form;
var sel=frm['Choice'+nu];
var iary=window['arrItems'+nu];
var gary=window['arrItemsGrp'+nu];
var cnt=1;
while (frm['Choice'+cnt]){
if (cnt>=nu){
while (frm['Choice'+cnt].firstChild){
frm['Choice'+cnt].removeChild(frm['Choice'+cnt].firstChild);
}
}
cnt++;
}
var myEle=document.createElement("option");
myEle.appendChild(document.createTextNode("[SELECT ONE]"));
myEle.setAttribute("value","0");
sel.appendChild(myEle);
for (var x = 0 ; x < iary.length ; x++ ) {
if ( gary[x]==control.value ) {
myEle = document.createElement("option");
myEle.setAttribute("value",x);
myEle.appendChild(document.createTextNode(iary[x]));
sel.appendChild(myEle);
}
}
}
// -->
</script>
<script language='Javascript'>
function doact(d)
{
var doc = eval("document.form."+d);
cp = doc.createTextRange();
doc.focus();
doc.select();
cp.execCommand("Copy");
}
function FP_popUpMsg(msg) {//v1.0
alert(msg);
}
</script>
</HEAD>
<BODY>
<form name=form>
<div align="center">
<table border="2" width="790" id="table1" bordercolor="#64367C">
<tr>
<td width="778" align="left" colspan="2">
</td>
<tr>
<td width="305" align="left">
<font size="2" face="MS Sans Serif"> Choice 1:<font size="2" face="MS Sans Serif">
<select id="Choice0" name="Choice0" onchange="selectChange(this, 1);">
<option value="0" selected>[SELECT]</option>
<option value="1">Selection 1</option>
<option value="2">Selection 2</option>
<option value="3">Selection 3</option>
</select></font></font></td>
<td width="225" align="center" onclick="FP_popUpMsg('More Info')">
<font face="MS Sans Serif" size="2" color="#FF0000">*</font><font face="MS Sans Serif" size="2" color="#0000FF">
<u>
Tell me more</u></font></td>
<tr>
<td width="547" align="left">
<font size="2" face="MS Sans Serif"> Code 2:
<select id="secondChoice" name="Choice1" onchange="selectChange(this, 2); "></select></font></td>
<td width="225" align="center" rowspan="4">
<TEXTAREA name="text1" cols="25" rows="5">
Selections will populate here.
</TEXTAREA><input onclick="doact('text1')" type="button" value="Copy">
</td>
</tr>
<tr>
<td width="547" align="left">
<font size="2" face="MS Sans Serif"> Code 3:
<select id="thirdChoice" name="Choice2" onchange="selectChange(this, 3);"></select></font></td>
</tr>
<tr>
<td width="547" align="left">
<font size="2" face="MS Sans Serif"> Code 4:
<select id="fourthChoice" name="Choice3" onchange="selectChange(this, 4);"></select></font></td>
</tr>
<tr>
<td width="547" align="left">
<font face="MS Sans Serif" size="2"> Code 5: </font> <font size="3" face="Courier">
<select id="fifthChoice" name="Choice4" onchange="selectChange(this, 5);" size="1"></select></font></td>
</tr>
<tr>
<td width="547" align="left">
<p><font face="MS Sans Serif" size="2"> Answer: </font>
<font size="3" face="Courier">
<select id="sixthChoice" name="Choice5" onChange="alert('Reminder')" size="1"></select>
</font></p></td>
<td width="225" align="center">
<font size="2" face="MS Sans Serif">
<a target="_blank" href="reference.htm">Show the Full Spreadsheet</a></a></font></td>
</tr>
<tr>
<td width="778" align="left" colspan="2">
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
Hi, Ive been days searching posting, trying to find a solution to my pure css hover menu that works perfect, except in toucscreens. Ive been today to apples shop to test, and yes sometimes it opens on click other it wont open, something strange. So the best is to serve another menu to toucsreens such as smartphones and tablets, or make the menu work on both. I have tried my menu (Peterneds whateverhover) but cant manage, also have no touchscreen to do tests on. Searching I found Suckerfish Dropdowns and the dropdown have a script for ie6 as ie6 does not support hover. This is the script: Code: <script type="text/javascript"><!--//--><![CDATA[//><!--
sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//--><!]]></script>
I wonder, isnt it posible to change the onmouseover and onmouseout to touchstart and touchend? I imagine that sounds just to easy, suppose if that were the case it would already been done, however I read that touchstart is for iphone etc... Any help please, I do understand javascript when I read it, but am not able to do my own functions. Thanks Helen I'd like to create two dropdown (select) lists with a search button next to it so if the user chooses A in the first list and C in the second list and clicks 'search', the results return items that relate to both A and C. Practical Example: User chooses "London" in the first dropdown and "Middle Schools" in the second. Result returns the middle schools I've listed for London. How can this be done or if it can't, is there another way to achieve what I want? -edit- I found what I wanted he http://www.alistapart.com/d/complexd...ts&de=Pancakes However, now my question is what would I put in for the form "action" to populate the results? I was wondering if there's a quick and simple way to notify a user if an ajax connection is broken, for example you're calling a file, but due to your internet connection, the file cannot be relayed back to you, so the existed javascript code on the initial page you're on, notifys you of the problem. Any ideas? HI, Is it possible to connect to a sqlite database via javascript. And I do not mean the HTML 5 Web SQL Database, that is no problem. What I mean is a file-based SQLite database, which is in the same folder as the HTML page.Also, I can not use something like Google's API, only the javascript libraries I can then put in this folder. THX Helge Hi, I'm a newbie to javascript programming and I'm seeking on a solution on how to connect to a tcp port using javascript. Basically, we have phone server that is constantly streaming XML data on port 1024 (serverIP:1024). I've ran a packet sniffer and was able to gather the elements and attributes for the XML data that the server is streaming. Now, I have a test XML parser which works with the XML document using the elements and attributes i've gathered from the packet sniffer. Is there a way for me to connect to the TCP port i've mentioned using javascript and incorporate it with the XML parser that I have. Here is the code for my XML Parser. Quote: <html> <body> <script type="text/javascript"> var xmlDoc; if (window.XMLHttpRequest) { xmlDoc=new window.XMLHttpRequest(); xmlDoc.open("GET","acddataentry.xml",false); xmlDoc.send(""); xmlDoc=xmlDoc.responseXML; } // IE 5 and IE 6 else if (ActiveXObject("Microsoft.XMLDOM")) { xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async=false; xmlDoc.load("acddataentry.xml"); } document.write("<table border='1'>"); var x=xmlDoc.getElementsByTagName("ACD"); for (i=0;i<x.length;i++) { document.write("<tr><td>"); document.write(x[i].getElementsByTagName("Calls_Waiting")[0].childNodes[0].nodeValue); document.write("</td><td>"); document.write(x[i].getElementsByTagName("Crt_Wait_Time")[0].childNodes[0].nodeValue); document.write("</td></tr>"); } document.write("</table>"); </script> </body> </html> Any help on this is highly appreciated. Thank in advance. I wrote a script that registers scrolling action as a number, and is stored in the variable delta. Now, I only want to use that variable when scrolling over the div section1 on the page. What would that look like ... this? Code: function something()
{
if(section1.delta < 0)
do something here;
}
Hello Everyone, I am using Javascript in ASP page to connect to the database. I am not able to figure out where is the problem. Gettting this error-> Quote: Error Type: Microsoft OLE DB Provider for SQL Server (0x80004005) [DBNETLIB][ConnectionOpen (Connect()).]SQL Server does not exist or access denied. /MyWeb/test.asp, line 9 My code is-> Code: <%@ Language = JavaScript %>
<%
var myconnection
var myrecordset
var connectionString
myconnection = Server.CreateObject("adodb.connection")
connectionString = "Provider=SQLOLEDB.1;Password=myPwd;Persist Security Info=True;User ID=myId;Initial Catalog=MyTable;Data Source=MyCompName\MyDBINSTANCE"
myconnection.Open(connectionString, myconnection);
%>
If someone could please guide me in the right direction I would greatly apprieciate it. Thanking You. Hello there everyone, I've been stuck on this for about a day and a half. My code is for a connect four game in Javascript. The problem resides in the minimax recursion AI function. Code: function bestMove(color,depth,maxDepth)
{//Finsd the best move for the side. Returns column and score pair
//depth specifies current level of depth (should be passed as 0)
//maxDepth specifies the maximum depth to search
//holds the best score
var best = new Worth(-100000,0);
if(depth%2==1)best.Score*=-1;
var mv = new Worth(0,0);
for (i=0;i<7;i++)
{ //try putting a piece at each of 7 columns.
mv.Column=i;
if(height[i]==-1){
}else{
//find the row to put this piece.
gameB[height[i]][i]=color;
height[i]--;
alert(""+i+"");
//find if it is a game over, don't search further if it is
//a score of 100 or -100 means a game over
var cur = new Worth(0,0);
cur.Score=checkWin(height[i],i,color);
if(cur.Score==gold){
cur.Score=-100;
}
if(cur.Score==silver){
cur.Score=100;
}
if(cur.Score==100||cur.Score==-100||depth==maxDepth){
mv.Score=cur.Score;
}else{ //search further (this one is the recursive call
if(color==gold) {
color = silver;
}else{
color = gold;
}
mv.Score=bestMove(color,depth+1,maxDepth).Score;
}
//if this move is better, use it instead
if(mv.Score>best.Score&&depth%2==0)
best=mv;
else if(mv.Score<best.Score&&depth%2==1)
best=mv;
//undo the move. Remove the piece you just put
if(getIt(height[i],i)==outside)
{ alert("OH JEEZ");
}
}
}
return best;
}
I cannot figure out what is wrong exactly. There maybe a serious error of logic within the function. I posted the .html file on my website www.softdrawing.com/connect4.html with the whole code. If someone could help me fix that function please that would be amazing. I'm new to the minimax algorithm and I tried writing it for myself. I have this script added to a facebook icon (#id) on my front page: (function() { var e = document.createElement('script'); e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js'; e.async = true; document.getElementById('fb-root').appendChild(e); })(); window.fbAsyncInit = function() { var fbClicked = false; FB.init({appId: 'Myappid', status: true, cookie: true, xfbml: true}); FB.Event.subscribe('auth.login', function(response) { if(response.session && fbClicked){ window.location = 'http://www.mysite.com/facebookauth/?ref=/'; } }); } function thFBShortCut() { FB.login(function(response) { fbClicked = true; if (response.session && response.perms && fbClicked) { window.location = 'http://www.mysite.com/facebookauth/?ref=/'; } }, {perms:'email,publish_stream'}); } function thFBLogin() { fbClicked = true; $('.popbox').fadeOut(); FB.getLoginStatus(function(response) { if(response.session && response.status == 'connected' && fbClicked) { window.location = 'http://www.mysite.com/facebookauth/?ref=/'; } }); } I want when whenever user press on facebook icon, the script should trigger facebook connect app. I added `<div id="fb-root"></div>` right after `<body <?php body_class(); ?>>`, but when I load my site I keep getting these error messages: document.getElementById("fb-root") is null and FB is not defined [Break On This Error] FB.login(function(response) { My html: <a id="facebookicon" onclick="thFBShortCut()">Login</a> What I am trying to do is make a little box that when you hover over it, it will move to a random position. What I am having trouble with is the JavaScript. I have made the code for everything, EXCEPT to move it to a random position. Here is my code so far: Code: <style type='text/css'>
#circle1 {
background:#007fff;
height:20px;
margin:0px;
position:absolute;
width:20px;
left:5px;
top:5px;
-webkit-transition:left 2s linear, top 2s linear;
}
#circle1:hover {
left:25px;
top:25px;
-webkit-transition:left 0s linear, top 0s linear;
}
</style>
<div id='circle1'></div>
I would like the left: and top: in the #circle1:hover to be a random number, to make it go to a random position. I have no clue how to do that though... |
|||||||