|
JavaScript - Filling User Preferences From Map
Hi all,
I have been working on a map, which now works and highlights and shows the location name on mouseover. I am having problems with how to go about getting users to be able to click on a region of the map, and depending on which region is clicked, to populate a drop down list which will appear on the same page. Then, the option which is chosen from the drop down list, would populate a blank field for the user- eg. preferences 1 - 4. The next location, would populate another drop down list, and the chosen option would populate the next blank field, if the previous one is already filled. This is what I have for the drop down lists, where the drop down is only populated from "location" array and need to somehow incorporate other array lists "locationsSouth" , "LocationsEast" and others if they were chosen. Code: <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<html>
<head>
<title>Drop down box</title>
<script language="javascript">
function addOption(selectbox,text,value )
{
var optn = document.createElement("OPTION");
optn.text = text;
optn.value = value;
selectbox.options.add(optn);
}
function addOption_list(selectbox){
var location = new Array("location1","location2","location3");
var locationsSouth = new Array("location1.1","location2.1","location3.1")
var locationsEast = new Array ("location1.2","location2.2","location3.2")
for (var i=0; i < location.length;++i){ //
addOption(document.drop_list.Location_list, location[i], location[i]); //
}
}
</script>
</head>
<body onLoad="addOption_list()";>
Preferences
<br><br>
<FORM name="drop_list" action="yourpage.php" method="POST" >
<SELECT NAME="Location_list">
<Option value="" >Far North</option>
</SELECT>
</form>
</td></tr></table><div>
</body>
</html>
This is the format of the areas of the map Code: <AREA onmouseover=changeImage(pic12); onmouseout=changeImage(pic13); shape=POLY target=_self alt="Mid North" COORDS="276,203, 284,214, 289,217, 285,267, 274,267, 257,265, 254,263, 241,291, 222,293, 229,284, 238,280, 245,249, 250,236, 253,230, 253,210, 266,201" href="section.asp?regionID=12"> I hope this made sense; I'm still trying to think about how to tackle the problem myself. Similar TutorialsI was wondering how to go about populating empty fields from a drop down list of different options. Eg. A user selects from a HUGE choice from the drop down list, and this fills their preferences 1-4. If 1 is full, then it populates 2 if another choice is clicked, and so on. Cheers in advance. Hello, I'm a javascript beginner and need some help with a form that has 1 dropdown and two text boxes. when an item is selected in the dropdown it will autofill a number into the first text box that will be the highest number allowed. i.e. it may put a 30 so the range would be 1-30. and when a number is filled there it will do a simillar function for the second text box. also I need the script to make sure the number input is within the range when it leaves focus so it doesn't cause problems if the user types in a number larger than the range allows. I can't even seem to get the auto fill part to work so any help on it and/or the check part of the script would be awesome
Hi I'm trying to fill out a form on this site using JavaScript: http://pacesalsa.promotionexpert.com...2/register.jsp However, the fields do not have input IDs; they only have span IDs. I've tried using the span IDs, but it doesnsn't work. Here is the code I'm trying to use: Code: document.getElementById('fn'). value='" FName "';
Where FName is the value I want filled into the field. Could someone please tell me how to use JavaScript to fill in the fields of this form (and check those pesky check boxes)? Thanks. Hello, I'm trying to fill an array with the values of a listbox from a SQL query but somehow I can only get the first word of each registry Code:
var arrayX=[];
function getValue(){
var x=document.getElementById("combo_color");
for (var i = 0; i < x.options.length; i++) {
if(x[i].value!=''){
arrayX.push(x[i].value);
}
}
}
for example, with the color Green Karanka I only get Green inside the array, the same happens with any color with more than one word, any ideas? Thanks. Hi all! Im trying to work out a way of entering the contents of a div (which changes regularly) into a form field when it is focused on. The issue is that the div containing the text value is in an iframe of a php file (gallery.php). The div (#lbBottom) text contents that I need to use is the caption of the current photo open with a light-box style jquery plugin (slimbox). The gallery is formed using the php and needs to be in an iframe to align the lightbox correctly. #lbBottom is generated by title=\"Code: $alttag1\" and give a result of Code: +the current photo number. Ideally it is just the photo number (last 2 characters) that I need but the contents of the div will do! Would appreciate any help or advice anyone can give loads! As you will see with the mywrite function, im getting a bit tangled! GAME HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
<script>
function mywrite() {
$.get("gallery.php", function(data){
//alert("Data Loaded: " + data);
document.getElementById('#lbBottom').text = myVar;
var addanswer = data;
});
document.quiz.q1.value.focus();
document.quiz.q1.value = addanswer
alert("done");
}
</script>
</head>
<body>
<div id="leftcol">
<form id="quiz" name="quiz">
<p><label for="q1"><img src="images/q1.jpg" alt="Question1"/><span class="photoquestion">1.</span></label><input id="q1" type="text" value="" onfocus="mywrite()" name="q1" /></p>
<p><label for="q2"><span>2.</span>We’ll go that extra mile!</label><input id="q2" type="text" onfocus="mywrite()" value="" name="q2" /></p>
<p><label for="q3"><span>3.</span>Question 3</label><input id="q3" onfocus="mywrite()" type="text" value="" name="q3"/></p>
<p><label for="q4"><img src="images/q4.jpg" alt="Question4"/><span class="photoquestion">4.</span></label><input id="q4" onfocus="mywrite()" type="text" value="" name="q4"/></p>
<input class="submit" type="submit" name="submit" value="Check Answers" />
</form>
</div>
<iframe id="gallery_cont" src="gallery.php" name="iframe" scrolling="no">
</iframe>
</body>
</html>
GALLERY PHP PHP Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script src="js/jquery.js" type="text/javascript" charset="utf-8"></script> <script src="js/lightbox.js" type="text/javascript" charset="utf-8"></script> </head> <body> <div id="gallery"> <?php $cleanup = array(".jpg", ".","_"); $dir1 = "./adverts/"; $imageset1 = opendir($dir1); while(false != ($file1 = readdir($imageset1))) { if(($file1 != ".") and ($file1 != "..") and ($file1 != ".DS_Store") and ($file1 != "thumbs")) { $alttag1 = str_replace($cleanup," ",$file1); echo("<a href=\"./adverts/$file1\" title=\"Code: $alttag1\" rel=\"lightbox-group\" ><img src=\"./adverts/thumbs/$file1\" alt=\"$alttag1\" /></a>\n"); } } ?> </div> </body> </html> hey guyz. i have a string lets say Code: mywifidata = 'a1|a2|a3|a4|b1|b2|b3|b4|c1|c2|c3|c4|'; in the string there will always be an even amount of a,b,c data i would need to fill a table 'mytable' like this a1 b1 c1 a2 b2 c2 a3 b3 c3 a4 b4 c4 i am using the pipe symbol for the delimiter the actual data is wifi data like mywifiname1 on 70 mywifiname2 on 51 mywifiname3 off 57 mywifiname4 on 22 and to customise it i would like to replace the on and off with an image so if its on then <img src="padlock.png"> if off <img src="nolock.png"> and for the numeric values i would like a progressbar or something that would show the signal strength out of 70 also each wifiname td would need an id that increments like wifi1 wifi2 wifi3 wifi4 and each of those td will need an onclick="highlight(this.id)" i know i am being cheaky for asking all of this but i am willing to pay a few quid if someone could help me out Hi to everyone, I'm kind of new to html/php/javascript but still I manage to create a nice looking form in wich the users have to fill some text fields and select items from drop list. But I now have a small problem. I need one of those text fields to be automaticly filled by the informations selected in 2 drop lists. This is how it would looks like : Machine-Name : __________ (empty text field) Drop-List1 : abc (the user selected the string "abc" from the list.) Machine-Name : abc- Drop-List 2 : zxy(the user selected the string "zxy" from the list.) Machine-Name : abc-zxy- I hope you understand what I mean. If needed, I can past those fields and list code, but I don't think that would be very useful since it is kind of trivial. So, in words, how would you guys proceed to achieve this goal? Hello. Is it possible to use java script to direct users to different page depending on their username login and password? And if so, what is the script? The website i am creating is for a conference my school is hosting. What I want to do is give the username and password for each delegation to use; once they log in, they will be directed to a page which contains information pertaining only to their delegation. Right now, this is the script I have, but it only directs to one page, which is "user1.php". I want to be able to direct user2 to user2.php, user3 to user3.php and so on. <?php $usernames = array("user1", "user2", "user3", "superman"); $passwords = array("pass1", "pass2", "password3", "supermans password"); $page = "user1.php" for($i=0;$i<count($usernames);$i++){ $logindata[$usernames[$i]]=$passwords[$i]; } if($logindata[$_POST["username"]]==$_POST["password"]){ session_start(); $_SESSION["username"]=$_POST["username"]; header('Location: '.$page); exit; }else{ header('Location: login.php?wrong=1'); exit; } ?> Any help would be greatly appreciated. Thanks! Hello all, I would like to implement a cookie feature on my site that when a user logs in a cookie is stored for him and the next time he comes back, he doesn't have to sign in. I have researched hotscripts and javascripts but the ones I have found have to do with the "remember me" and thats not quite what I want. I tried to manipulate it but with no luck. Any help with either posting code or an article would be greatly appreciated! Thanks a bunch-Dan Hey everybody, what regular expression do i have to use to get the 2 last elements of a user agent? eg in firefox how can i get : Mozilla/5.0 (X11; Linux i686; rv:7.0.1) Gecko/20100101 Firefox/7.0.1 Firefox & 7.01 ? thanks! So I have been working on this exercise for about a month. In the book I am reading it say's this:"For each number that the user enters, the text boxes on the web page should display: the last score that was entered, the number of scores that have been entered, the total of these scores, the average score, the best score, and the worst score. When you write the code for this function, you should enclose the prompt method within a loop, but you decide which type of loop is best for this application. Now, write and test the code." The first peice of code is my HTML, and the second piece of code is the function that I have to start from in a .js file. I just seem to be confused at how my structuring needs to be. The 999 in the function is what the prompt says to enter to escape. Code: <body>
<div id="content">
<h1>Using Loops</h1>
<label for="lastScore">Last Sco </label>
<input type="text" id="lastScore" /><br />
<p></p>
<label for="scoreCount">Score Count:</label>
<input type="text" id="scoreCount" /><br />
<label for="scoreTotal">Score Total:</label>
<input type="text" id="scoreTotal" /><br />
<p></p>
<label for="scoreAverage">Average Sco </label>
<input type="text" id="scoreAverage" /><br />
<label for="bestScore">Best Sco </label>
<input type="text" id="bestScore" /><br />
<label for="worstScore">Worst Sco </label>
<input type="text" id="worstScore" /><br />
<p></p>
</div>
Code: var process_test_scores = function () {
var testScore;
testScore = parseInt(prompt(
"Enter a valid test score between 0 and 100.\n" +
"To end test score entry, enter 999.", 999));
}
In a normal chatroom, when the user "says" something, the text will be displayed normally on a line with the date/time attached like the example below. 2011/11/09 Capypara: Blah balh blah I would like to make it so that the text typed in by the user will appear inside a graphic (square, or those chat bubbles) like the example below. The graphic will only appear when a user says something, so essentially both the graphic and the text will appear together. ~~~~~~~~~~~~~~~~~~~~~~~~ | | | 2011/11/09 Capypara: Blah balh blah | | | ~~~~~~~~~~~~~~~~~~~~~~~~ Is it possible to go about doing this? Thanks for reading this. Hey, so i've been learning basics and I can get the following code to work as a prompt and I thought hey, I wounder if I can get it to work of a UI system, so I edited the code and got this Read Below Post Can you please help me to find where I am going wrong. Thanks MancunianMacca In my onbeforeunload event, it asked the user whether they want to leave the page or stay on it. When they click "stay on page", I want it to then redirect them to another webpage in the same window. Is there a way to do this, without just showing/hiding divs? Can I override the function? I'm currently trying to do it this way(as seen below) but now the dialog box is not showing up at all. It was working before Any ideas as to what I'm doing wrong, or how to accomplish this task? Code: <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>The Shocking Truth - Cabot Market Letter</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#vid").show();
$("#div2").hide();
});
var test = 1;
function manipulatetest()
{
test = 2;
}
window.onbeforeunload = onbeforeunload_Handler;
function onbeforeunload_Handler()
{ if (test == 1){
$("#vid").hide();
$("#div2").show();
var confirm = confirm("Would you like to stay on this page?");
if (confirm == true) {
window.location = "http://www.google.com";
}
}
}
</script>
</head>
<style type="text/css">
body {
background-color: #e0e6e5;
}
#vid {
margin: 20px auto;
width: 920px;
}
</style>
<body>
<div id="vid">
<video width="920" height="540" autoplay preload controls>
<source src="shockingtruth.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
<source src="shockingtruth.webm" type='video/webm; codecs="vp8, vorbis"'>
<source src="shockingtruth.ogv" type='video/ogg; codecs="theora, vorbis"'>
<object width="920" height="540" type="application/x-shockwave-flash"
data="flowplayer-3.2.1.swf">
<param name="movie" value="flowplayer-3.2.7.swf" />
<param name="allowfullscreen" value="true" />
<param name="flashvars" value='config={"clip": {"url": "http://www.cabot.net/videos/shocking-truth/shockingtruth.mp4", "autoPlay":true, "autoBuffering":true}}' />
<p>Download video as <a href="pr6.mp4">MP4</a>, <a href="pr6.webm">WebM</a>, or <a href="pr6.ogv">Ogg</a>.</p>
</object>
</video>
</div>
<div id="div2">
<video width="920" height="540" autoplay preload controls>
<source src="shockingtruth.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
<source src="shockingtruth.webm" type='video/webm; codecs="vp8, vorbis"'>
<source src="shockingtruth.ogv" type='video/ogg; codecs="theora, vorbis"'>
<object width="920" height="540" type="application/x-shockwave-flash"
data="flowplayer-3.2.1.swf">
<param name="movie" value="flowplayer-3.2.7.swf" />
<param name="allowfullscreen" value="true" />
<param name="flashvars" value='config={"clip": {"url": "http://www.cabot.net/videos/shocking-truth/shockingtruth.mp4", "autoPlay":true, "autoBuffering":true}}' />
<p>Download video as <a href="pr6.mp4">MP4</a>, <a href="pr6.webm">WebM</a>, or <a href="pr6.ogv">Ogg</a>.</p>
</object>
</video>
</div>
<p style="text-align: center;"><a href="http://www.cabot.net/info/cml/cmlld03.aspx?source=ed01" onclick="manipulatetest();">Click Here To Order</a></p>
</body>
</html>
Code: <?php
if($_SESSION['id'])
echo '<h1>Hello, '.$_SESSION['usr'].'! You are registered and logged in!</h1>';
else echo '<h1>Please, <a href="demo.php">login</a> and come back later!</h1>';
echo 'Should i find a new login'
?>
im trying to use this as a check to see if someone is logged in, is this the right idea, any tips to improve this or anymore info just ask please Thanks So with the below form if the value of any of the select list changes the user is alerted something like "You are about to make 2 changes". How can I do this? Code: <script>
function validate(){
}
</script>
<form method="POST" onsubmit="return validate()" action="--WEBBOT-SELF--">
<select size="1" name="fruits[]">
<option value="apple">apple</option>
<option value="pear">pear</option>
<option value="orange">orange</option>
</select>
<select size="1" name="cars[]">
<option value="ford">ford</option>
<option value="gm">gm</option>
<option value="toyota">toyota</option>
</select>
<input type="submit" value="Submit" name="B1"></p>
</form>
Hello all, First off I would like to say a big hello and thank you to the forum for helping me with code over the years... I am trying to create an iframe with a user input, however, I dont simply want the iframe to display the URL the user has entered in the iframe. I want it to be used within a URL string. For example: The iframe should display http://www.google.co.uk/search?q=UserKeyword I havent got a clue where to start from.... Any help would be highly appreciated! Thanks! Is there any possible way for JS to save changes that a user has made? my situation is that I'm a photographer who offers photobooks. My customers often have hundreds or thousands of photos and want captions on lots of them. I want to post a photo gallery with a user input form. I've created a simple form, but I want the user to be able to save comments straight to the gallery so I can look at them... it's only a very simple form and isn't quite finished yet, oh by the way, I'm not sure how to use the check box... but, i'll work on that. Code: <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style type="text/css">
<!--
#divWrapper {
text-align: center;
width: 430px;
margin-right: auto;
margin-left: auto;
}
-->
</style>
</head>
<body>
<script type="text/javascript">
function picForm()
{
if(document.frmInput.addPic.value="yes")
{
document.frmOutput.outChoice.value="will"
}
else
{
document.frmOutput.outChoice.value="will NOT"
}
document.frmOutput.outCap.value=document.frmInput.addCap.value;
document.frmOutput.outComm.value=document.frmInput.addComm.value;
}
</script>
<div id="divWrapper">
<p>Uncheck the box if you do NOT want this photo to appear in your photobook. Please write your caption in the box provided. Any further comments you wish to make can be entered in the second box.</p>
<div id="divInput">
<form name="frmInput">
<table id="tblForm" cellpadding="3px">
<tr>
<td><input name="addPic" type="checkbox" value="yes">
Add to Photobook</td>
<td> </td>
</tr>
<tr>
<td>Caption<br>
<textarea name="addCap" cols="24" rows="3" value="...Add Caption Here..."></textarea></td>
<td>Comments<br>
<textarea name="addComm" cols="24" rows="3" value="...Add Comments Here..."></textarea></td>
</tr>
<tr>
<td></td>
<td><div align="right">
<input name="btnSubmit" type="button" value="Submit" onClick="picForm()" />
</div></td>
</tr>
</table>
</form>
</div>
<div id="divOutput">
<form name="frmOutput">
<p>This photo
<input name="outChoice" type="text" value="" size="7" style="border:0px" />
appear in your photo book.</p>
<p>You would like the caption to read:
<input name="outCap" type="text" value="" size="50" style="border:0px" />
</p>
<p>Your comments to us a
<input name="outComm" type="text" value="" size="50" style="border:0px" />
</p>
</form>
</div>
</div>
</body>
</html>
Please help! _________
|
|||||||