JavaScript - Help Needed To Change Both Set Of Images In Programe When Up/down Button Is Pressed.
Hi guys, would appreciate some help here.
The below is part of the codes of my image matching programme. The programme loads 2 different series of images in the area and the up/down button is supposed to change each set of the series of images. Currently, the codes only allow one set of the images to be changed. Any idea what can be done so that both set get changes when the up/down key is pressed? Thanks! Codes: public void keyReleased(KeyEvent e) { zoom = false; repaint(); } public void keyPressed(KeyEvent e) { System.out.println("" + e.getKeyCode()); switch (e.getKeyCode()) { case 16: zoom = true; zoomPt = getMousePosition(); repaint(); break; case 39: loadImage(true, true); break; case 40: loadImage(false, true); break; case 38: loadImage(false, false); break; case 37: loadImage(true, false); break; } } public void changeDir(File dir) { this.dir = dir; } public void loadImage(boolean isFileA, boolean increase) { File[] fileList = dir.listFiles(new FilenameFilter() { public boolean accept(File dir, String name) { if (name.toLowerCase().endsWith(".dcm") || name.toLowerCase().endsWith(".dc3") || name.toLowerCase().endsWith(".dic")) { return true; } else { return false; } } }); if (fileList.length < 2) { return; } try { if (isFileA) { a_os = increase? (a_os + 1) % fileList.length : (a_os - 1 + fileList.length) % fileList.length; } else { b_os = increase? (b_os + 1) % fileList.length: (b_os - 1 + fileList.length) % fileList.length; } String ext = fileList[a_os].getName().substring(fileList[a_os].getName().lastIndexOf(".") + 1); Iterator readers = ImageIO.getImageReadersByFormatName(ext); ImageReader reader = (ImageReader) readers.next(); reader.setInput(new FileImageInputStream(fileList[a_os]), true); imgA = ((DICOMImageReader) reader).read(0, null); ext = fileList[b_os].getName().substring(fileList[b_os].getName().lastIndexOf(".") + 1); readers = ImageIO.getImageReadersByFormatName(ext); reader = (ImageReader) readers.next(); reader.setInput(new FileImageInputStream(fileList[b_os]), true); imgB = ((DICOMImageReader) reader).read(0, null); w = Math.max(imgA.getWidth(), imgB.getWidth()); h = Math.max(imgA.getHeight(), imgB.getHeight()); } catch (Exception e) { String fileName; fileName = isFileA ? fileList[a_os].getPath() : fileList[b_os].getPath(); promptError(fileName + " could not be read"); e.printStackTrace(); System.exit(1); } dx = w / 2; dy = h / 2; } public void promptError(String msg) { JOptionPane.showMessageDialog(null, msg, "Error", JOptionPane.ERROR_MESSAGE); } public void keyTyped(KeyEvent e) { } Similar Tutorialshow do i make a html button stay down when pressed, until another button within a specified group of buttons is pressed, at which point it is released and the other button stays pressed?
Hello all I created a form which has a lot of textboxes, checkboxes and select-lists which are getting filled up by the records from a database table. I am basically creating an edit screen for a record. No I want to check all these input elements using javascript validation. I want this to performed when a button "Archive" is pressed. My problem is this "Archive button" needs to be a submit button. This does run the javascript validation but after completing the validation it submits the form. I want that submission should be stopped when the validation is violated. how can I do this? What I want is a button which acts as a default button (triggers the onclick event when I press enter) but submits only if the form is valid. hi guys. im new to javascript and i require some help on a task so hoping someone on here could help me and possibly push me in the right direction. so i have a website with content on specific pages i need some sort of JS soloution which will fetch an ID/Keyword out of the page content so when a button is clicked it finds the ID/keyword and directs the user to a specific form/page. is this possible and can any1 help? Cheers, Ant. i'm still a relative noob and this has me stuck - i have a save button with a "save as copy" in the save dropdown list. add new item directs to a premade/formatted project that is used as a template, so on that item i only want/need the "save as copy" but on all other items that use the form i need to only have the "save" function. is there any way to either change the function of the button depending on item that is being viewed in the edit screen OR hide the "save" button and only show the button associated with "save as copy - and vis versa for the rest of the items?? current button code is - protected function getToolbar() { $options = array(); $user = JFactory::getUser(); $create_ms = $user->authorise('core.create', 'com_pfmilestones'); $create_task = $user->authorise('core.create', 'com_pftasks'); $options[] = array( 'text' => 'JSAVE', 'task' => $this->getName() . '.save'); $options[] = array( 'text' => 'Save as new project', 'task' => $this->getName() . '.save2copy', 'options' => array('access' => ($this->item->id > 0))); PFToolbar::dropdownButton($options, array('icon' => 'icon-white icon-ok')); item used as template is id=8 any help or suggestions would be greatly appreciated.. I have created most of the code however I would like to expand my options. Basically the code changes an image when a user makes a selection from a drop down menu. <head> Code: <script language="javascript"> function linkrotate(which){ var mylinks=new Array() mylinks[0]="http://www.#.com" mylinks[1]="http://www.#.com" mylinks[2]="http://www.#.com" window.location=mylinks[which] } function showimage() { if (!document.images) return document.images.pictures.src= document.mygallery.picture.options[document.mygallery.picture.selectedIndex].value } //--> </script> <body> Code: <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="100%"><form name="mygallery"><p><select name="picture" size="1" onChange="showimage()"> <option selected value="image1.jpg">Option 1</option> <option value="image2.jpg">Option 2</option> <option value="image3.jpg">Option 3</option> </select></p> </form> What I would like to do it have two drop down menus that work together instead of one - providing a more accurate image for the user. Right now the user has one option to select from the drop down menu in which the image is changed. I'd like to be able to have the user choose from two drop down menus. For example: Drop down menu number 1 Shoe Color: Black or Red Drop down menu number 2 Shoelace Color: White or Brown Where a user chooses 'Black' from the first option then the images will only show a black shoe with white laces or brown laces (based on their choice from the next drop-down menu. Furthermore, where a user chooses 'Red' from the first option then image from the next choice will only show a red shoe with white or brown laces. Currently my chess game, which is lacking rules, is operating for the most part. However, the button which allows the players to make moves is only operating once. As far as i can tell it is probably a problem with the recreation of the button in the move() method. Any advice on this code at all is appreciated! Code: <html> <head> <title>Project</title> <script type ="text/javascript"> //1 means the background is black //0 means the background is white //- signifies that a piece is black //+ signifies that a piece is white //X means there is no piece //P means pawn //R means rook //N means knight //B means bishop //Q means queen //K means king //X means no piece again function print(array){ for(var i = 0; i< array.length;i = i+1){ for(var z = 0; z< array[i].length;z= z+1){ if(array[i][z] == "0XX"){ document.write('<img src = "white.jpg">'); }else if(array[i][z] == "1XX") { document.write('<img src = "black.jpg">'); }else if(array[i][z] == "0-P") { document.write('<img src = "images/bwPawn.jpg">'); }else if(array[i][z] == "1-P") { document.write('<img src = "images/bbPawn.jpg">'); }else if(array[i][z] == "0+P") { document.write('<img src = "images/wwPawn.jpg">'); }else if(array[i][z] == "1+P") { document.write('<img src = "images/wbPawn.jpg">'); }else if(array[i][z] == "0-R") { document.write('<img src = "images/bwRook.jpg">'); }else if(array[i][z] == "1-R") { document.write('<img src = "images/bbRook.jpg">'); }else if(array[i][z] == "0+R") { document.write('<img src = "images/wwRook.jpg">'); }else if(array[i][z] == "1+R") { document.write('<img src = "images/wbRook.jpg">'); }else if(array[i][z] == "0-N") { document.write('<img src = "images/bwKnight.jpg">'); }else if(array[i][z] == "1-N") { document.write('<img src = "images/bbKnight.jpg">'); }else if(array[i][z] == "0+N") { document.write('<img src = "images/wwKnight.jpg">'); }else if(array[i][z] == "1+N") { document.write('<img src = "images/wbKnight.jpg">'); }else if(array[i][z] == "0-B") { document.write('<img src = "images/bwBishop.jpg">'); }else if(array[i][z] == "1-B") { document.write('<img src = "images/bbBishop.jpg">'); }else if(array[i][z] == "0+B") { document.write('<img src = "images/wwBishop.jpg">'); }else if(array[i][z] == "1+B") { document.write('<img src = "images/wbBishop.jpg">'); }else if(array[i][z] == "0-Q") { document.write('<img src = "images/bwQueen.jpg">'); }else if(array[i][z] == "1-Q") { document.write('<img src = "images/bbQueen.jpg">'); }else if(array[i][z] == "0+Q") { document.write('<img src = "images/wwQueen.jpg">'); }else if(array[i][z] == "1+Q") { document.write('<img src = "images/wbQueen.jpg">'); }else if(array[i][z] == "0-K") { document.write('<img src = "images/bwKing.jpg">'); }else if(array[i][z] == "1-K") { document.write('<img src = "images/bbKing.jpg">'); }else if(array[i][z] == "0+K") { document.write('<img src = "images/wwKing.jpg">'); }else if(array[i][z] == "1+K") { document.write('<img src = "images/wbKing.jpg">'); } } document.write("<br>"); } } function move(boardz){ //for moving pieces. variables declare the 2 positions of the array that move. var rowS = prompt("Please enter the desired row you wish to move [1 to 8]","1"); var colS = prompt("Please enter the desired column you wish to move [1 to 8]","1"); var rowF = prompt("Please enter the targetted row [1 to 8]","1"); var colF = prompt("Please enter the targetted column [1 to 8]","1"); rowS = parseInt(rowS)-1; colS = parseInt(colS)-1; rowF = parseInt(rowF)-1; colF = parseInt(colF)-1; temp = boardz[rowS][colS].charAt(1) + boardz[rowS][colS].charAt(2); // this and the next 2 lines move the piece boardz[rowS][colS] = boardz[rowS][colS].charAt(0) + "XX"; boardz[rowF][colF] = boardz[rowF][colF].charAt(0) + temp; document.clear(); print(boardz); document.write('<button type="button" onclick="move(boardz);">'+ "Move."+ '</button>'); } var board = new Array( ["0-R","1-N","0-B","1-Q","0-K","1-B","0-N","1-R"], ["1-P","0-P","1-P","0-P","1-P","0-P","1-P","0-P"], ["0XX","1XX","0XX","1XX","0XX","1XX","0XX","1XX"], ["1XX","0XX","1XX","0XX","1XX","0XX","1XX","0XX"], ["0XX","1XX","0XX","1XX","0XX","1XX","0XX","1XX"], ["1XX","0XX","1XX","0XX","1XX","0XX","1XX","0XX"], ["0+P","1+P","0+P","1+P","0+P","1+P","0+P","1+P"], ["1+R","0+N","1+B","0+Q","1+K","0+B","1+N","0+R"]); print(board); </script> </head> <body> <button type="button" onclick="move(board);">Move.</button> </body> </html> Dear All, I am trying to design a from with radio buttons and text boxes which will accept text values upon clicking the radio buttons. So basically the textbox only appears when the radio button is clicked. The problem I am facing is the textbox does not hide upon selecting different radio button. Below I am posting the javascript and the associated html form for the same. I would like to request some suggestions and directions for the same. Regards Code: Javascript: <script type="text/javascript"> function show() { var i = 0; var el; while(el = document.getElementsByName('radio')[i++] ) { (document.getElementById('radio'+i).checked) ? document.getElementById('text'+i).style.display="block" : document.getElementById('text'+i).style.display="none" } } </script> Code: <div id="SeqInput"> <form method="post" action="the url to process this form" > <div> <label><input type="radio" name="seqinput" value="accession" id="radio1" onclick="show()"></label> NCBI accession number: <label for="accession"><input type="text" id="text1"></label><br> <label><input type="radio" name="seqinput" value="gene" id="radio2" onclick="show()"></label> NCBI Gene Name: <label for="gene"> <input type="text" id="text2"></label><br> <label><input type="radio" name="seqinput" value="file" id="radio3"></label> Upload fasta sequence from file: <label for="file"><input type="file" id="file"></label><br> <label><input type="radio" name="seqinput" value="fasta" id="radio4" onclick="show()"></label> Click to type in or copy/paste the fasta sequence:<br> <label><textarea rows="10" cols="100" id="text3" style="display: none"> </textarea></label> </div> </form> </div> can anyone give me a sample code for this situation ? - button A = labeled as Unlocked - when I on mouse over button A the label should turn into "Lock me ?" - and then when I click the button, the label will change to "Locked" here is the html code that i have PHP Code: <td valign="middle" valign="middle"> <input type="radio" name="gender" id="genderM" value="Male" /> Male <input type="radio" name="gender" id="genderFM" value="Female" /> Female </td> and here is the js funtion PHP Code: var $j = jQuery.noConflict(); function isValidEmail(str) { return (str.indexOf(".") > 2) && (str.indexOf("@") > 0); } function validateForm(){ var firstName; var lastName; var email; var mobile; var comment; var error; firstName = $j('#firstName').val(); lastName = $j('#lastName').val(); email = $j('#email').val(); mobile = $j('#mobile').val(); comment = $j('#comment').val(); if(firstName=='' || firstName.length < 3){ error = 'Please Enter Your First Name'; $j('#errormsg').html('<p class="errors">'+ error +'</p>'); return false; } if(lastName=='' || lastName.length < 3){ error = 'Please Enter Your Second Name'; $j('#errormsg').html('<p class="errors">'+ error +'</p>'); return false; } //mob //$jmob_pattern = '^\d{10}$j'; if(mobile.length != 10 || isNaN(mobile)){ error = 'Please Enter Your Mobile Number'; $j('#errormsg').html('<p class="errors">'+ error +'</p>'); return false; } if(email=='' || !isValidEmail(email)){ error = 'Please Enter Your Email Address'; $j('#errormsg').html('<p class="errors">'+ error +'</p>'); return false; } if(comment.length < 5){ error = 'Please Enter A Comment'; $j('#errormsg').html('<p class="errors">'+ error +'</p>'); return false; } return true; } Does anybody know how i check to see if the radio button is select and also can anybody tell me how i can check for an email in the correct format the function isValidEmail in the above alows emails to pass through if they are in this format aaa@aaa. i only want them to go through if they are aaa@aaa.com Thanks for your help if you give it Hi I'm trying to get button to change word + triangle. This ▼ or ▲ is Hex for triangle. I hard code this <input name="b" value="More▼" page loads, the value shown on button is "More and a triangle" (as I would like) but when I then do document.getElementById("moreBtn").value="Less▲" the button displays "Less▲"; (ie no triangle) why? Is this possible? very grateful If any body can explain. Low Tech How do I change the Button's value onClick? I want it to initially be "Read More" and then change to "Show Less" Code: <script type="text/javascript"> function toggleMe(a){ var e=document.getElementById(a); if(!e)return true; if(e.style.display=="none"){ e.style.display="block" } else{ e.style.display="none" } return true; } </script> <div>Why are we going to stop making investments in companies like this?</div> <span id="obamaenergyapril212011" style="display:none;"> END 12:50 P.M. PDT</span> <input type="button" name="obama" onclick="return toggleMe('obamaenergyapril212011')" value="Read/Hide More" > I have the one javascripts button code and the functions is on "text area" .. but how do I change the function of this button to go to google.com website ..? how to make it.. the javascripts button code : Code: <input type="image" src="tesdt-copy-1.gif" onmouseover="this.src='file:///C:/Documents%20and%20Settings/Administrator/Desktop/test/main%20test%20scripts/test2-copy-2.gif';" onmouseout="this.src='file:///C:/Documents%20and%20Settings/Administrator/Desktop/test/main%20test%20scripts/test2-copy-1.gif';" onclick="CB(document.getElementById('output').value); return false;" </form name="I5" width="38" height="38"> Hey guys, I Should have the textbox value as my radio button value. For example, if I type "5" in the textbox, then the radio button value would change to "5". by the way I have three radio buttons and one textbox and if I select one of those and type something in the text box the value would replace to radio button which is selected and all this have to happen before the page submitted or in the process of submitting. I hope I could find answers here (It's so important for me to solve this problem, For see the form please go to this page, Its above the news frame where you can see three radio buttons and one textbox named shipment tracking ...). thanks so much!!!
I'm trying to make a page where you can change a page's layout through 2 separate CSS's via a button. i want to button to change text when it toggles the layouts as well. i have no clue how to do this with an entire CSS file, but here is something i made to change the background. could i use this logic to change the CSS of a page? HTML <in Code: <input type="button" value="change layout" onclick="toggle()" /> JavaScript Code: var flag = 0; function toggle(){ if(flag==0){ document.getElementById("container").style.backgroundImage="blah.jpg"; flag=1; } else if(flag==1){ document.getElementById("container").style.backgroundImage="blah2.jpg"; flag=0; } } I want to change radio button values dependent on the selected item in a drop down list. The radio buttons have default values but I need them to be changed when the selection has been made in the drop down list and before the submit button has been pressed so the changed values will be written to the database. Example : Drop down item : National Radio 1 value : Director Radio 2 value : National PA Drop down item : Regional Radio 1 value : Regional Manager Radio 2 value : Regional PA Drop down item : Local Radio 1 value : Store Manager Radio 2 value : Assistant Store Manager Any help will be appreciated. HI, I have a questions here. Can I change firefox/IE's min/max/X button lay out to lower right corner? I have a web app (let us say i have 2 pages input.php and output.php) when user enters data into input.php and click search output.php renders from server. But the user from anywhere on web should be able to close output.php by using lower right X button. (by default FF/IE has top right X button, may top left in case of MAC), in otherwords I need to change the output.php page NOT on a user machine but on server, so that each user get same lay out when access the page. Is it possible?? pls help me.. Thanks in advance... I'm trying to use an onclick function in a radio button to change the value of a hidden input in another form. What I want to happen is, when the user changes the value of the radio button (0 or 1), the value of the input named 'repeat' is set to 0 or 1 accordingly. The goal being that when I submit the form with input name='repeat' it will send the number indicated by the radio button. (Due to the structure of my page the radio button and the hidden input need to be two separate forms, but I don't think that should be a problem.) The code below isn't working -- the alert("changerepeat called") never even appears. It seems like the problem is that the onclick isn't even activating at all. Any ideas? Code: <script type="text/javascript"> function changerepeat(theval) { alert("changerepeat called"); document.forms[0].elements[0].value = theval; } function tellme() { alert("repeat = "+document.forms[0].elements[0].value); } </script> <form> <input type='hidden' name='repeat' value=''> <input type='button' value='tellme' onclick='tellme()'> </form> <form> <input type='radio' name='changerepeat' onclick='changerepeat(\'0\')'> 0 <input type='radio' name='changerepeat' onclick='changerepeat(\'1\')'> 1 </form> Thanks very much for reading! Pleas how can i change div bg color with active chcecked radio button <div style="background-color:#fff;"><input type="radio" name="radio" id="radio" value="1" /> Active performer</div> <div style="background-color:#fff;"><input type="radio" name="radio" id="radio" value="2" /> Poster</div> <div style="background-color:#fff;"><input type="radio" name="radio" id="radio" value="3" /> Only attender</div> - if checked, change color from #fff to #ccc For checkboxes i find this <span id="cDate1" style="background-color:#FFF"><input type="checkbox" name="check" id="date1" onclick="document.getElementById('cDate1').style.backgroundColor=this.checked?'#ccc':'#FFF';" /> 13.10.2010</span> Thnx for help in advance Hi Complete novice with Java so need some help please! I want to put a button on a website that when clicked changes the background. The button needs to be an image. For example, click on the image and it makes the background image1 and then click again to switch to background image2. The image/button that is being clicked will be 2 images (one says "turn lights on" then when clicked shows other image "turn lights off") I have managed to pick up bits of code from the net that change the background and got another code that makes 2 images a toggle button. The button changes the background on the first click but no back again on the second click. I guess it needs an if/else statement but not sure. Thanks for any help!!!! |