JavaScript - Dropdown Box Onclick, Get Certain Content From Different Page?
So I'm trying to get one particular number from a game's grand exchange database.
Say I wanted to know the 'Market price' of this item and the item results would change on click of a drop down box. I don't know how I'd go about getting that one section of the entire page though. Any help is appreciated. Code: <html> <head> <title></title> function doit() { var potion = calculate.potion.options[calculate.potion.selectedIndex].text; if (potion=="Sara brew") { var potion = "Saradomin_brew_(3)"; } if (potion=="Zammy brew") { var potion = "Zamorak_brew_(3)"; } calculate.results.value=potion; } </head> <body> Item: <select name="potion" onChange="doit()" /> <option selected>--Potion--</option> <option>Sara brew</option> <option>Zammy brew</option> <br /> <input type="text" name="results" /> </body> </html> Similar TutorialsThere are two pages, folder/india.html folder/usa.html and dropdown menu in each page to switch between india and usa pages. india.html page sells in INR and usa.html in USD with links to shopping carts for each currency. link1(INR) link2(USD) Except the link and the currency information(selling price), contents in both the pages are same. So here comes the problem. Google hates duplicate pages! I am looking for a solution where, a single page In That Page, a dropdown menu to select currency As the currency is selected, without page reload, the link to shopping cart and the pricing also should be changed according to the selected currency. So Single page should be able to handle both the currencies. Kindly suggest me with codes as I am new to javascript. Thanks a lot On my site, when you select something from the first drop down box, javascript creates the options to appear in a second drop down box. I have this code: Code: function addOption(selectbox, value, text) { var optn = document.createElement("OPTION"); optn.text = text; optn.value = value; selectbox.options.add(optn); } and then this: Code: if(document.drop_list.Category.value == 'Assembly'){ addOption(document.drop_list.SubCat,"Electronic", "Electronic"); addOption(document.drop_list.SubCat,"Marketing", "Marketing"); addOption(document.drop_list.SubCat,"Retailing", "Retailing"); addOption(document.drop_list.SubCat,"Construction", "Construction"); } Thats an example of how it works. What I want to now add, is an onclick to each subcategory. I want the onClick to execute the function changecolour1(). This function changes the class of a div, but ive got that sorted out so its probably irrelevent. I want to know if anyone call tell me how to make it create the OPTION with a text, value AND onclick attributes. And then I want to be able to specifiy the value of the Onclick. I'm pretty new at javascript, a lot of that code was written for me. Please shed some light for me. Thanks in advance Micomator. I'm trying to make a basic rss reader with a google reader-esque functionality of clicking on article names and being able to expand/collapse that article. I'm working on the expand part and am going crazy. I am having no trouble getting content and displaying it without the onclick function but when I try to integrate onclick I can just get the titles. here's the snippet. any help? Code: <!-- HTML --> <body> <div id="feeddiv"></div> <script type="text/javascript"> // feed stuff using Google Feed API function feedLoaded(result) { if (!result.error) { // Grab the container we will put the results into var container = document.getElementById('feeddiv'); container.innerHTML = ''; // Loop through the feeds, putting the titles onto the page. for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var content = entry.content; var title = entry.title; var url = entry.link; var div = document.createElement('div'); //parentDiv for articles var articleTitle = document.createElement('div'); articleTitle.setAttribute('name', i); //set articleTitle name to article's place in array articleTitle.setAttribute('style', 'font-weight:bold;font-size:15px;'); articleTitle.innerText = title; articleTitle.onclick = function() {populate(content, title, url, i);}; div.appendChild(articleTitle); //adds title to div container.appendChild(div); //adds div to the container } } } function populate(content,title, url, i) { var article = document.getElementByName(i); //gets articleTitle //clickable title var a = document.createElement('a'); //creating title link var href = document.createElement('href'); a.setAttribute('href', url); //putting actual url into html a.setAttribute('style', 'font-size:25px;'); a.innerText = title;//still puts into html //Text var snippet = document.createElement('p'); //creates <p> to throw articles in snippet.innerHTML = content; //renders the article article.appendChild(a); article.appendChild(snippet); } </script> </body> Hello Guys, Seems im moving on from the css forums to java (im scared). I am a keen learner but an absolute beginner to java. What i need to be able to do is.. When a student clicks on a link in the main menu e.g number I need a something that can load the following two divs. #contentwindow #three I already have jquery running on the page and all css is embeded for now if that is helpful. http://www.bushcottages.co.uk/new.htm Thanks your help is supremely appreciated Peter Hi! I'm no JavaScript expert so wonder if you could help? I have a page with four divs, and would like to change the content in each div by clicking on a link under each div. Can this be done with JavaScript? I've searched everywhere for the last three hours and cannot find any 'readymade' code. Can anyone help me or point me in the right direction? Any help will be really welcome! Thank you! I'd like to place an AJAX call to load another SELECT menu in my form, and I'm having trouble finding a tutorial. Can someone point me to a good tute, or provide some guidance/examples here? For your Copying/Pasting pleasure , here's an example button for which I'd include the onclick(): Code: <button type="button" >Add</button> And here's an example SELECT menu: Code: <select id="idNumber" name="weekday_1['workPeriod_new'][] > <option value="1" >one</option> <option value="2" >2</option> </select> Thanks-a-bunch, ~ Mo NOTE: Overall, I'm pretty green in JS. Hi, I am Aditya. I am explaining below the exact scenario where I need the help: I am developing a web application in which I need to integrate a javascript/html editor on some of the web pages and then provide 'Edit' buttons on those web pages so that users can edit the content on that partciular html/jsp page (like editing in wiki pages) and then, when they add some content and click on submit button, the new content should appear on the web page with all the formatting (i.e. bold, italics, color and so on) which was applied by user when he was entering the text. Now, I need help for the below issues: 1. Please suggest me a good javascript/html editor (freely downloadable) which I can use to integrate with my web pages. 2. Once the user has entered some content using the above javascript editor, how to make that content reach the server and update the corresponding web page. I am new to web development, so may be that these questions are too simple. But, I need some help from you. Waiting for your reply, Thanks, Aditya Hey, I've got a question regarding javascript. I'm a total novice at this and I would love to hear any advice which could help me resolve this problem. I've got a html document with something like this: <form> <input type="button" value="Sum up" name="A" onClick="calculate()"> </form> The thing is onClick="calculate()" transfers me to a new page and I need this function (calculate) shown below this button on the same page. I'm out of ideas of how should I do this. Thanks in advance this is my html page.. Code: <html> <head> <script type="text/javascript" language="JavaScript"> function general_formats() { window.open('http://www.test.com/general_formats.php'); } </script> </head> <body> <a href="general_formats.php"><onclick="general_formats(); return false">General Formats</a> </body> </html> When i click ' general Formats ' , a window is opened , i dont need that . What i need is , when i click the link , it should direct to general_fomats.php.. please help me to solve it . .any help will be appreciated . I am a javascript newbie. I have a radio website that runs a live stream 24/7. The live stream is loaded in to an iframe named "stream". I only ever have 2 files that show in that iframe. 1 for when the user has the stream on and another for when they turn it off. stream_on.php and stream_off.php I also have podcasts on the site and my goal is when the user clicks the .swf object to play the podcast, the live stream in the iframe changes to stream_off.php so that the 2 audios don't overlap each other. Here's the code I have so far for the .swf object. PHP Code: <object type='application/x-shockwave-flash' data='player_mp3_maxi.swf' width='50' height='20' class='blur' onclick="window.open('stream_off.php','stream')\"> <param name='movie' value='player_mp3_maxi.swf' /> <param name='bgcolor' value='#666666'>"; if ($row['location'] == "") { echo "<param name='FlashVars' value='mp3=". $site ."podcasts/". $filename ."&showslider=0&showstop=1&autoload=0&bgcolor1=330066&width=50' />"; } else { echo "<param name='FlashVars' value='mp3=http://". $row['location'] . $filename ."&showslider=0&showstop=1&autoload=0&bgcolor1=330066&width=50' />"; } </object> And the code for the iframe. It's default state is stream_on.php since on load I want the stream to start right away. I only need it to change upon clicking of any .swf object on the page. PHP Code: <iframe src='stream_on.php' id='stream' marginheight='0' width='195' height='110' frameborder='0' scrolling='no'></iframe> As you can see, I put the onclick in the object tag. Is this correct ? Is there a piece of javascript code I am missing ? Please Help. Alright, so I'm working on a script, and I'm simply using the following code: document.getElementById("element").onclick = alert("hello"); When I load the page, the alert fires instantaneously. I'm completely stumped. I've checked everything in my not too extensive Javascript file, and it looks fine. What common errors could cause this? Hello, So I have two pieces of Javascript attached to my open/close text boxes. One for the visibility function: Code: <script type="text/javascript"> function toggle_visibility(id) { var e = document.getElementById(id); if(e.style.display == 'block') e.style.display = 'none'; else e.style.display = 'block'; } </script> The other for changinging the image to reflect the text box's status (open of closed): Code: <script type="text/javascript"> var ImgPath='../images/portfolio/'; function changeImage (id) { var tab = document.getElementById(id); if (tab.src.match('open.png')) { tab.src = ImgPath + 'close.png'; } else { tab.src = ImgPath + 'open.png'; } } </script> The problem only shows further down the page, when I click to open a box it automatically goes back to the top of the page instead of staying at the user's current page position I would like it to stop changing the page position onclick. Any help would be much appreciated! Hello Basically I have found and adapted the code: Code: alreadyloading = false; nextpage = 2; $(window).scroll(function() { if ($('body').height() <= ($(window).height() + $(window).scrollTop())) { if (alreadyloading == false) { var url = "page"+nextpage+".html"; alreadyloading = true; $.post(url, function(data) { $('#projectscontainer').children().last().after(data); alreadyloading = false; nextpage++; }); } } }); I want when the user scrolls to the bottom of the page for content in a new page to load under the div "#projectscontainer". So in the new page 'Page2.html" I have put 5 divs going down with content in... I want the new content to appear below "#projectscontainer'" Why won't this work? Anyone know? Thanks Dear friends, I was looking for some help on getting all the ten digits mobile numbers in the current webpage and assign an onclick event to it just by a click of a button. Likewise, Suppose there are mobile numbers Code: <p>9876543210 Blah....Blah...Any other content.9654321000</p> <input type="button" value="Get 10 digit mobile numbers" onclick="getnumbers();" /> in the current webpage. and the user clicks on a button. Then all the ten digit mobile numbers(in this case two numbers 9876543210 and 9654321000) gets the html as Code: <p><span onclick="openpopup('9876543210')">9876543210</span> Blah....Blah...Any other content.<span onclick="openpopup('9654321000')">9654321000</span></p> I am a PHP guy and probably suck at JS. Tried experimenting with the following code but didn't got it to work. Code: var html = document.getElementsByTagName('body')[0].innerHTML; and match = new RegExp("/\d{10}/"); replaceWith = "<span style='text-decoration:underline;' onclick=\"openpopup('--NUMBER--')\" >--NUMBER--</span>", replaced = html.replace(pattern,replaceWith); Please get me out of this glitch as it is getting harder for me to do it. I have a html page with a lot of thumbnails. The idea is that when the user clicks on an image the onClick event is to display another detailed form and deliver to that form the name of the image in a variable. In the detailed php-form there is a query to MySQL to retrieve a record. The record will be retrieved by a Query based on the name of the picture. Apparently the PHP cannot do the job. I had an idea to make the thumbnail page as a form and to use use a hidden field with the thummnail name which should be carried on with the $_POST array through the submit button but i do not want to have a submit button. The more elegant way is just by clicking the picture the detailed page is opened and the variable is transferred where my php code can make use of the variable for the query. I have never used java before so you have to excuse for the lack of knowledge. Can anyone gie me an idea how i should implemnt this Best regards MSP I have a html page with a lot of thumbnails. The idea is that when the user clicks on an image the onClick event is to display another detailed form and deliver to that form the name of the image in a variable. In the detailed php-form there is a query to MySQL to retrieve a record. The record will be retrieved by a Query based on the name of the picture. Apparently the PHP cannot do the job. I had an idea to make the thumbnail page as a form and to use use a hidden field with the thummnail name which should be carried on with the $_POST array through the submit button but i do not want to have a submit button. The more elegant way is just by clicking the picture the detailed page is opened and the variable is transferred where my php code can make use of the variable for the query. I have never used java before so you have to excuse for the lack of knowledge. Can anyone gie me an idea how i should implemnt this Best regards MSP I have a minor problem with opening multiple pages with onclick. The code work perfectly (I run it with some PHP features). So far so good. Here are the problems: Left mouse button will open 4 new tabs, and the view will jump to 'http://www.domain1.com Middle mouse button will only open http://www.domain1.com What I want: Open all 4 pages in new tabs in the background and stay at the current page. PHP Code: <a href='http://www.domain1.com' onclick="window.open('http://www.domain2.com'); window.open('http://www.domain3.com'); window.open('http://www.domain4.com')\" rel="nofollow" target='new'>Open 4</a> Hi, I would like to adapt this script to make it so that when the user selects something in the dropdown, it changes the text within a div (for example, but so i can have formatting) this is because i want to have html in the text that appears (instead of it being in a textarea) ive been trying to get this to work but not with much luck thanks for any help! Hello, I would like to know how can I send the selection from a dropdown from a webpage to another. In the first page where I have the dropdown list, I have this: Code: <td valign="top" align="left" nowrap width="90%"> <input name="time" style="width:100%" /> </td> <td valign="top" align="left" nowrap width="50"> <select name="time2"> <option value="60">Minutes</option> <option value="3600">Hour</option> <option value="86400">Days</option> </select> </td> In the second page, where I want this selection to be dispalyed, I created this code: Code: <td width="188" valign="top" align="left" nowrap> <SCRIPT LANGUAGE="JavaScript">document.write(window.opener.document.form.elements["time"].value + " " + window.opener.document.form.elements["time2"].value);</SCRIPT> </td> The issue I have with this is that the value dispalyed for the "time2" element is the actual attribute value (for instance 60) and not the actual value (for instance "Minutes"). If anyone have a clue what I'm doing wrong, I appreciate your help. Regards, On my site's shopping cart, when clicking the "buy" button, it merely animates a little item that shows that something is now in the customer's cart. I'd like it to do this, and then redirect to "/cart", cutting down the work of what the user actually has to do (we only have one product). Here's what I'm working with: <!-- START ADD TO CART --> {% if featuredproduct.available %} <span class="featured-product price"><span>{{ featuredproduct.price | money }}</span>{% if featuredproduct.compare_at_price_max > featuredproduct.price %} <del>{{ featuredproduct.compare_at_price | money }}</del>{% endif %}</span> <input type="submit" value="{{ settings.text_addtocart }}" class=" add-to-cart addtocart button primary"> {% else %} <h3 class="featured-product price sold-out"><span>Sold Out</span></h3> <input type="submit" value="{{ settings.text_addtocart }}" class="featured-product add-to-cart button primary disabled" disabled="disabled "> {% endif %} <!-- END ADD TO CART --> Adding an "onclick="location.href='/cart';" after the input classes does not fire the actual act of adding the item to the cart, so it shows an empty cart on the redirect. JS newbie, sorry for the rough explanation. Any help greatly appreciated! |