Search Results

Search found 29575 results on 1183 pages for 'dynamic javascript'.

Page 154/1183 | < Previous Page | 150 151 152 153 154 155 156 157 158 159 160 161  | Next Page >

  • Delete one row in html table marqued by a check box with javascript

    - by kawtousse
    Hi everyone, I build dynamically my HTML table from database like that: for(i=0;i< nomCols.length;i++) { retour.append(("<td bgcolor=#0066CC>")+ nomCols[i] + "</td>"); } retour.append("</tr>"); retour.append("<tr>"); try { s= HibernateUtil.currentSession(); tx=s.beginTransaction(); Query query = s.createQuery(HQL_QUERY); // inner join projecttasks.ProjectTypeCode as projects");// inner join projecttasks.taskCode as task inner join projects.projectCode as wa;"); for(Iterator it=query.iterate();it.hasNext();) { if(it.hasNext()){ Dailytimesheet object=(Dailytimesheet)it.next(); retour.append("<td><input type=checkbox name=cb id=cb /> </td>"); retour.append("<td>" +object.getTrackingDate() + "</td>"); retour.append("<td>" +object.getActivity() + "</td>"); retour.append("<td>" +object.getProjectCode() + "</td>"); retour.append("<td>" +object.getWAName() + "</td>"); retour.append("<td>" +object.getTaskCode() +"</td>"); retour.append("<td>" +object.getTimeSpent() + "</td>"); retour.append("<td>" +object.getPercentTaskComplete() + "</td>"); } retour.append("</tr>"); } //terminer la table. retour.append (""); tx.commit(); } catch (HibernateException e) { retour.append ("</table><H1>ERREUR:</H1>" +e.getMessage()); e.printStackTrace(); } return retour; } so I want that all check boxes having the same id. When trying to delete one row in my table witch have the check box checked i found a problem with that. Iam using simple javascript like this: function DeleteARow() { //var Rows = document.getElementById('sheet').getElementsByTagName('tr'); //var RowsCount = Rows.length; //alert('Your table has ' + RowsCount + ' rows.'); if (document.getElementById('cb').checked==true) { document.getElementById('cb').parentNode('td').parentNode('tr').remove(); }} It doesn't work approperly and only the first row have the id 'cb'. Many thanks for your help.

    Read the article

  • javascript won't execute nested for loop

    - by mcdwight6
    thanks in advance for all your help! i'm fairly new to javascript, but i have a fairly strong background in java, so i thought i would try it out on this project i'm working on. essentially, what i'm trying to do is read data from an xml file and create the html code for the page i'm making. i used the script from w3schools found here. I've altered it and gotten it to pull the data from my own xml and even to do the more basic generation of the html code i need. Here's the html i'm using inside <script> tags: var s = swDoc.getElementsByTagName("planet"); var plShowsArr = s[i].getElementsByTagName("show"); var plGamesArr = s[i].getElementsByTagName("videoGame"); for (i=0;i<s.length;i++) { // test section all works document.write("<div><table border = \"1\">"); document.write("<tr><td>"+ s[i].getElementsByTagName("showText")[0].childNodes[0].nodeValue + "</td><td>" + s[i].getElementsByTagName("showUrl")[0].childNodes[0].nodeValue + "</td></tr>"); document.write("<tr><td>" + s[i].getElementsByTagName("gameText")[0].childNodes[0].nodeValue + "</td><td>" + s[i].getElementsByTagName("gameUrl")[0].childNodes[0].nodeValue + "</td></tr>"); document.write("</tr></table></div>"); // end test section document.write("<div class=\"appearances-row\"><ol class=\"shows\">shows list"); for(j=0;j<plShows.length;j++){ document.write("nested for"); var showUrl = s[i].getElementsByTagName("showUrl")[j].childNodes[0].nodeValue; var showText = s[i].getElementByTagName("showText")[j].childNodes[0].nodeValue; document.write("<li><a href=\""+showUrl+"\">"+showText+"</a></li>"); } the code breaks at the nested for loop at the end, where it finished the document.write and prints "shows list" to the page, but then never gets to the document.write inside. if it helps, the xml contains a list of planets from the star wars universe organized like this: <planets> <planet> <planetName>planet</planetName> <description>some text</description> <appearances> <show> <showUrl>url</showUrl> <showText>hyperlink text</showText> </show> <videoGame> <gameUrl>url</gameUrl> <gameText>hyperlink text</gameText> </videoGame> </appearances> <locationsOfInterest> <location>location name</location> </locationsOfInterest> <famousCharactersRelatedTo> <character>a character</character> </famousCharactersRelatedTo> <externalLinks> <link> <linkUrl>url</linkUrl> <linkText>hyperlink text</linkText> </link> </externalLinks> </planet>

    Read the article

  • Replace html element with data in javascript

    - by Ultimate
    I trying to auto increment the serial number when row increases and automatically readjust the numbering order when a row gets deleted in javascript. For that I am using the following clone method for doing my task. Rest of the thing is working correct except its not increasing the srno because its creating the clone of it. Following is my code for this: function addCloneRow(obj) { if(obj) { var tBody = obj.parentNode.parentNode.parentNode; var trTable = tBody.getElementsByTagName("tr")[1]; var trClone = trTable.cloneNode(true); if(trClone) { var txt = trClone.getElementsByTagName("input"); var srno = trClone.getElementsByTagName("span"); var dd = trClone.getElementsByTagName("select"); text = tBody.getElementsByTagName("tr").length; alert(text) //here i am getting the srno in increasing order //I tried something like following but not working //var ele = srno.replace(document.createElement("h1"), srno); //alert(ele); for(var i=0; i<dd.length; i++) { dd[i].options[0].selected=true; var nm = dd[i].name; var nNm = nm.substring((nm.indexOf("_")+1),nm.indexOf("[")); dd[i].name = nNm+"[]"; } for(var j=0; j<txt.length; j++) { var nm = txt[j].name; var nNm = nm.substring((nm.indexOf("_")+1),nm.indexOf("[")); txt[j].name = nNm+"[]"; if(txt[j].type == "hidden"){ txt[j].value = "0"; }else if(txt[j].type == "text") { txt[j].value = ""; }else if(txt[j].type == "checkbox") { txt[j].checked = false; } } for(var j=0; j<txt.length; j++) { var nm = txt[j].name; var nNm = nm.substring((nm.indexOf("_")+1),nm.indexOf("[")); txt[j].name = nNm+"[]"; if(txt[j].type == "hidden"){ txt[j].value = "0"; }else if(txt[j].type == "text") { txt[j].value = ""; }else if(txt[j].type == "checkbox") { txt[j].checked = false; } } tBody.insertBefore(trClone,tBody.childNodes[1]); } } } Following is my html : <table id="step_details" style="display:none;"> <tr> <th width="5">#</th> <th width="45%">Step details</th> <th>Expected Results</th> <th width="25">Execution</th> <th><img src="gui/themes/default/images/ico_add.gif" onclick="addCloneRow(this);"/></th> </tr> <tr> <td><span>1</span></td> <td><textArea name="step_details[]"></textArea></td> <td><textArea name="expected_results[]"></textArea></td> <td><select onchange="content_modified = true" name="exec_type[]"> <option selected="selected" value="1" label="Manual">Manual</option> <option value="2" label="Automated">Automated</option> </select> </td> <td><img src="gui/themes/default/images/ico_del.gif" onclick="removeCloneRow(this);"/></td> </tr> </table> I want to change the srno. of span element dynamically after increment and decrement on it. Need help thanks

    Read the article

  • JavaScript Optimisation

    - by Jayie
    I am using JavaScript to work out all the combinations of badminton doubles matches from a given list of players. Each player teams up with everyone else. EG. If I have the following players a, b, c & d. Their combinations can be: a & b V c & d a & c V b & d a & d V b & c I am using the code below, which I wrote to do the job, but it's a little inefficient. It loops through the PLAYERS array 4 times finding every single combination (including impossible ones). It then sorts the game out into alphabetical order and stores it in the GAMES array if it doesn't already exist. I can then use the first half of the GAMES array to list all game combinations. The trouble is if I have any more than 8 players it runs really slowly because the combination growth is exponential. Does anyone know a better way or algorithm I could use? The more I think about it the more my brain hurts! var PLAYERS = ["a", "b", "c", "d", "e", "f", "g"]; var GAMES = []; var p1, p2, p3, p4, i1, i2, i3, i4, entry, found, i; var pos = 0; var TEAM1 = []; var TEAM2 = []; // loop through players 4 times to get all combinations for (i1 = 0; i1 < PLAYERS.length; i1++) { p1 = PLAYERS[i1]; for (i2 = 0; i2 < PLAYERS.length; i2++) { p2 = PLAYERS[i2]; for (i3 = 0; i3 < PLAYERS.length; i3++) { p3 = PLAYERS[i3]; for (i4 = 0; i4 < PLAYERS.length; i4++) { p4 = PLAYERS[i4]; if ((p1 != p2 && p1 != p3 && p1 != p4) && (p2 != p1 && p2 != p3 && p2 != p4) && (p3 != p1 && p3 != p2 && p3 != p4) && (p4 != p1 && p4 != p2 && p4 != p3)) { // sort teams into alphabetical order (so we can compare them easily later) TEAM1[0] = p1; TEAM1[1] = p2; TEAM2[0] = p3; TEAM2[1] = p4; TEAM1.sort(); TEAM2.sort(); // work out the game and search the array to see if it already exists entry = TEAM1[0] + " & " + TEAM1[1] + " v " + TEAM2[0] + " & " + TEAM2[1]; found = false; for (i=0; i < GAMES.length; i++) { if (entry == GAMES[i]) found = true; } // if the game is unique then store it if (!found) { GAMES[pos] = entry; document.write((pos+1) + ": " + GAMES[pos] + "<br>"); pos++; } } } } } } Thanks in advance. Jason.

    Read the article

  • Technology Selection for a dynamic product

    - by Kuntal Shah
    We are building a product for Procurement Domain in JAVA. Following are the main technical requirements. Platform Independent Database Independent Browser Independent In functional requirements the product is very dynamic in nature. The main reason being the procurement process around the world is different from client to client. Briefly we need to have a dynamic workflow engine and a dynamic template engine. The workflow engine by which we can define any kind of workflows and the template engine allows us to define any kind of data structures and based on definition it can get the user input through workflow. We have been developing this product for almost 2 years. It has been a long time till we can get down with the dynamics of requirements. Till now we have developed a basic workflow and template engine and which is in use at one of the client. We have been using following technologies. GWT-Ext (Front End Framework) Hibernate (Database Layer) In between we have faced some issues with GWT-Ext (mainly browser compatibility) and database optimization due to sub classing in hibernate. For resolving GWT-Ext issue, which a dying community so we decided to move to SmartGWT. In SmartGWT we faced issues related to loading and now we are able to finalize that GWT 2.3 will be the way to go as the library is rich and performance is upto the mark. We are able to almost finalize GWT-Spring based front and middle layer. In hibernate, we found main issues with sub-classing due to that it was throwing astronomical queries and sometimes it would stop firing any queries for 5-10 seconds or may be around 30 seconds and then resume again. Few days back I came to one article related to ORM. I am a traditional .Net SQL developer and I have always worked with relational database. Reading through this article, I also found it relating to the issues I face. I am still not completely convinced of using hibernate and this article just supported my opinion. Following are the questions for which I am looking for an answer. Should we be going with Hibernate in case of dynamic database requirements and the load of the data will be heavy in future? How can we partition the data, how we can efficiently join the data, how we can optimize the queries? If the answer is no then how do we achieve database independence? Is our choice related to GWT and Spring proper or do we need to change that too? Should we use any other key value pair database if the data is dynamic in nature and it is very difficult to make it relational?

    Read the article

  • OS X "service" for running JavaScript bookmarklets from anywhere?

    - by Spiff
    I have some JavaScript bookmarklets that work on the selected text in a web page, but I'd like to be able to use them on the selected text in any Mac OS X app, not just browsers or things that provide browser-like views. Mac OS X has the "Services" (sub)menu where any app can publish services that it can provide to other apps, but I don't know how to make my bookmarklets show up as services there. Is there a way to make JavaScript bookmarklets show up as Mac OS X "Services", or otherwise execute JavaScript against the selected text in any Mac OS X app?

    Read the article

  • How can I add autocomplete in notepad++ for javascript in an .html file?

    - by Nikhil
    Notepad++ does auto-complete for html and also for JavaScript. but the auto-completion depends on file extension.html file supports completion for html only. Is there a way to enable auto-completion for javascript in the script tag of an html file? I mean, other than copying the auto-completion keyword list from "javascript.xml" to "html.xml" files... As suggested on stackoverflow, asking on superuser, as I could not find a satisfactory answer there. If anyone has any idea, please let me know! (I hope I am not the only one having this kind of an requirement! :))

    Read the article

  • OS X "service" for running JavaScript bookmarklets in any app?

    - by Spiff
    I have some JavaScript bookmarklets that work on the selected text in a web page, but I'd like to be able to use them on the selected text in any Mac OS X app, not just browsers or things that provide browser-like views. Mac OS X has the "Services" (sub)menu where any app can publish services that it can provide to other apps, but I don't know how to make my bookmarklets show up as services there. Is there a way to make JavaScript bookmarklets show up as Mac OS X "Services", or otherwise execute JavaScript against the selected text in any Mac OS X app?

    Read the article

  • How is Javascript parsed/executed in a web browser exactly?

    - by ededed
    For example when I access web server likely Javascript will execute. From there on, how will the browser parse the Javascript, or "execute" the functions, the memory used, etc. How will the browser "handle" all of that? Does it act like a compilation lexer in that it passes line by line and generates object code, or does it use the DOM, and other specifications to handle memory, etc. Also, in terms of updating the page, and alterior concurrent executions as well, such as Flash, HTML, Java, etc. Point be simplified, how does the browser handle the scripts, the memory, and the logic on page from a javascript file?

    Read the article

  • Google Chrome: JavaScript associative arrays, evaluated out of sequence

    - by Jerry
    Ok, so on a web page, I've got a JavaScript object which I'm using as an associative array. This exists statically in a script block when the page loads: var salesWeeks = { "200911" : ["11 / 2009", "Fiscal 2009"], "200910" : ["10 / 2009", "Fiscal 2009"], "200909" : ["09 / 2009", "Fiscal 2009"], "200908" : ["08 / 2009", "Fiscal 2009"], "200907" : ["07 / 2009", "Fiscal 2009"], "200906" : ["06 / 2009", "Fiscal 2009"], "200905" : ["05 / 2009", "Fiscal 2009"], "200904" : ["04 / 2009", "Fiscal 2009"], "200903" : ["03 / 2009", "Fiscal 2009"], "200902" : ["02 / 2009", "Fiscal 2009"], "200901" : ["01 / 2009", "Fiscal 2009"], "200852" : ["52 / 2008", "Fiscal 2009"], "200851" : ["51 / 2008", "Fiscal 2009"] }; The order of the key/value pairs is intentional, as I'm turning the object into an HTML select box such as this: <select id="ddl_sw" name="ddl_sw"> <option value="">== SELECT WEEK ==</option> <option value="200911">11 / 2009 (Fiscal 2009)</option> <option value="200910">10 / 2009 (Fiscal 2009)</option> <option value="200909">09 / 2009 (Fiscal 2009)</option> <option value="200908">08 / 2009 (Fiscal 2009)</option> <option value="200907">07 / 2009 (Fiscal 2009)</option> <option value="200906">06 / 2009 (Fiscal 2009)</option> <option value="200905">05 / 2009 (Fiscal 2009)</option> <option value="200904">04 / 2009 (Fiscal 2009)</option> <option value="200903">03 / 2009 (Fiscal 2009)</option> <option value="200902">02 / 2009 (Fiscal 2009)</option> <option value="200901">01 / 2009 (Fiscal 2009)</option> <option value="200852">52 / 2008 (Fiscal 2009)</option> <option value="200851">51 / 2008 (Fiscal 2009)</option> </select> ...with code that looks like this (snipped from a function): var arr = []; arr.push( "<select id=\"ddl_sw\" name=\"ddl_sw\">" + "<option value=\"\">== SELECT WEEK ==</option>" ); for(var key in salesWeeks) { arr.push( "<option value=\"" + key + "\">" + salesWeeks[key][0] + " (" + salesWeeks[key][1] + ")" + "<\/option>" ); } arr.push("<\/select>"); return arr.join(""); This all works fine in IE, FireFox and Opera. However in Chrome, the order comes out all weird: <select id="ddl_sw" name="ddl_sw"> <option value="">== SELECT WEEK ==</option> <option value="200852">52 / 2008 (Fiscal 2009)</option> <option value="200908">08 / 2009 (Fiscal 2009)</option> <option value="200906">06 / 2009 (Fiscal 2009)</option> <option value="200902">02 / 2009 (Fiscal 2009)</option> <option value="200907">07 / 2009 (Fiscal 2009)</option> <option value="200904">04 / 2009 (Fiscal 2009)</option> <option value="200909">09 / 2009 (Fiscal 2009)</option> <option value="200903">03 / 2009 (Fiscal 2009)</option> <option value="200905">05 / 2009 (Fiscal 2009)</option> <option value="200901">01 / 2009 (Fiscal 2009)</option> <option value="200910">10 / 2009 (Fiscal 2009)</option> <option value="200911">11 / 2009 (Fiscal 2009)</option> <option value="200851">51 / 2008 (Fiscal 2009)</option> </select> NOTE: This order, though weird, does not change on subsequent refreshes. It's always in this order. So, what is Chrome doing? Some optimization in how it processes the loop? In the first place, am I wrong to rely on the order that the key/value pairs are declared in any associative array? I never questioned it before, I just assumed the order would hold because this technique has always worked for me in the other browsers. But I suppose I've never seen it stated anywhere that the order is guaranteed. Maybe it's not? Any insight would be awesome. Thanks.

    Read the article

  • Optimizing a 3D World Javascript Animation

    - by johnny
    Hi! I've recently come up with the idea to create a tag cloud like animation shaped like the earth. I've extracted the coastline coordinates from ngdc.noaa.gov and wrote a little script that displayed it in my browser. Now as you can imagine, the whole coastline consists of about 48919 points, which my script would individually render (each coordinate being represented by one span). Obviously no browser is capable of rendering this fluently - but it would be nice if I could render as much as let's say 200 spans (twice as much as now) on my old p4 2.8 Ghz (as a representative benchmark). Are there any javascript optimizations I could use in order to speed up the display of those spans? One 'coordinate': <div id="world_pixels"> <span id="wp_0" style="position:fixed; top:0px; left:0px; z-index:1; font-size:20px; cursor:pointer;cursor:hand;" onmouseover="magnify_world_pixel('wp_0');" onmouseout="shrink_world_pixel('wp_0');" onClick="set_askcue_bar('', 'new york')">new york</span> </div> The script: $(document).ready(function(){ world_pixels = $("#world_pixels span"); world_pixels.spin(); setInterval("world_pixels.spin()",1500); }); z = new Array(); $.fn.spin = function () { for(i=0; i<this.length; i++) { /*actual screen coordinates: x/y/z --> left/font-size/top 300/13/0 300/6/300 | / |/ 0/13/300 ----|---- 600/13/300 /| / | 300/20/300 300/13/600 */ /*scale font size*/ var resize_x = 1; /*scale width*/ var resize_y = 2.5; /*scale height*/ var resize_z = 2.5; var from_left = 300; var from_top = 20; /*actual math coordinates: 1 -1 | / |/ 1 ----|---- -1 /| / | 1 -1 */ //var get_element = document.getElementById(); //var font_size = parseInt(this.style.fontSize); var font_size = parseInt($(this[i]).css("font-size")); var left = parseInt($(this[i]).css("left")); if (coast_line_array[i][1]) { } else { var top = parseInt($(this[i]).css("top")); z[i] = from_top + (top - (300 * resize_z)) / (300 * resize_z); //global beacause it's used in other functions later on var top_new = from_top + Math.round(Math.cos(coast_line_array[i][2]/90*Math.PI) * (300 * resize_z) + (300 * resize_z)); $(this[i]).css("top", top_new); coast_line_array[i][3] = 1; } var x = resize_x * (font_size - 13) / 7; var y = from_left + (left- (300 * resize_y)) / (300 * resize_y); if (y >= 0) { this[i].phi = Math.acos(x/(Math.sqrt(x^2 + y^2))); } else { this[i].phi = 2*Math.PI - Math.acos(x/(Math.sqrt(x^2 + y^2))); i } this[i].theta = Math.acos(z[i]/Math.sqrt(x^2 + y^2 + z[i]^2)); var font_size_new = resize_x * Math.round(Math.sin(coast_line_array[i][4]/90*Math.PI) * Math.cos(coast_line_array[i][0]/180*Math.PI) * 7 + 13); var left_new = from_left + Math.round(Math.sin(coast_line_array[i][5]/90*Math.PI) * Math.sin(coast_line_array[i][0]/180*Math.PI) * (300 * resize_y) + (300 * resize_y)); //coast_line_array[i][6] = coast_line_array[i][7]+1; if ((coast_line_array[i][0] + 1) > 180) { coast_line_array[i][0] = -180; } else { coast_line_array[i][0] = coast_line_array[i][0] + 0.25; } $(this[i]).css("font-size", font_size_new); $(this[i]).css("left", left_new); } } resize_x = 1; function magnify_world_pixel(element) { $("#"+element).animate({ fontSize: resize_x*30+"px" }, { duration: 1000 }); } function shrink_world_pixel(element) { $("#"+element).animate({ fontSize: resize_x*6+"px" }, { duration: 1000 }); } I'd appreciate any suggestions to optimize my script, maybe there is even a totally different approach on how to go about this. The whole .js file which stores the array for all the coordinates is available on my page, the file is about 2.9 mb, so you might consider pulling the .zip for local testing: metaroulette.com/files/31218.zip metaroulette.com/files/31218.js P.S. the php I use to create the spans: <?php //$arbitrary_characters = array('a','b','c','ddsfsdfsdf','e','f','g','h','isdfsdffd','j','k','l','mfdgcvbcvbs','n','o','p','q','r','s','t','uasdfsdf','v','w','x','y','z','0','1','2','3','4','5','6','7','8','9',); $arbitrary_characters = array('cat','table','cool','deloitte','askcue','what','more','less','adjective','nice','clinton','mars','jupiter','testversion','beta','hilarious','lolcatz','funny','obama','president','nice','what','misplaced','category','people','religion','global','skyscraper','new york','dubai','helsinki','volcano','iceland','peter','telephone','internet', 'dialer', 'cord', 'movie', 'party', 'chris', 'guitar', 'bentley', 'ford', 'ferrari', 'etc', 'de facto'); for ($i=0; $i<96; $i++) { $arb_digits = rand (0,45); $arbitrary_character = $arbitrary_characters[$arb_digits]; //$arbitrary_character = "."; echo "<span id=\"wp_$i\" style=\"position:fixed; top:0px; left:0px; z-index:1; font-size:20px; cursor:pointer;cursor:hand;\" onmouseover=\"magnify_world_pixel('wp_$i');\" onmouseout=\"shrink_world_pixel('wp_$i');\" onClick=\"set_askcue_bar('', '$arbitrary_character')\">$arbitrary_character</span>\n"; } ?>

    Read the article

  • Help needed with Javascript Variable Scope / OOP and Call Back Functions

    - by gargantaun
    I think this issue goes beyond typical variable scope and closure stuff, or maybe I'm an idiot. Here goes anyway... I'm creating a bunch of objects on the fly in a jQuery plugin. The object look something like this function WedgePath(canvas){ this.targetCanvas = canvas; this.label; this.logLabel = function(){ console.log(this.label) } } the jQuery plugin looks something like this (function($) { $.fn.myPlugin = function() { return $(this).each(function() { // Create Wedge Objects for(var i = 1; i <= 30; i++){ var newWedge = new WedgePath(canvas); newWedge.label = "my_wedge_"+i; globalFunction(i, newWedge]); } }); } })(jQuery); So... the plugin creates a bunch of wedgeObjects, then calls 'globalFunction' for each one, passing in the latest WedgePath instance. Global function looks like this. function globalFunction(indicator_id, pWedge){ var targetWedge = pWedge; targetWedge.logLabel(); } What happens next is that the console logs each wedges label correctly. However, I need a bit more complexity inside globalFunction. So it actually looks like this... function globalFunction(indicator_id, pWedge){ var targetWedge = pWedge; someSql = "SELECT * FROM myTable WHERE id = ?"; dbInterface.executeSql(someSql, [indicator_id], function(transaction, result){ targetWedge.logLabel(); }) } There's a lot going on here so i'll explain. I'm using client side database storage (WebSQL i call it). 'dbInterface' an instance of a simple javascript object I created which handles the basics of interacting with a client side database [shown at the end of this question]. the executeSql method takes up to 4 arguments The SQL String an optional arguments array an optional onSuccess handler an optional onError handler (not used in this example) What I need to happen is: When the WebSQL query has completed, it takes some of that data and manipulates some attribute of a particular wedge. But, when I call 'logLabel' on an instance of WedgePath inside the onSuccess handler, I get the label of the very last instance of WedgePath that was created way back in the plugin code. Now I suspect that the problem lies in the var newWedge = new WedgePath(canvas); line. So I tried pushing each newWedge into an array, which I thought would prevent that line from replacing or overwriting the WedgePath instance at every iteration... wedgeArray = []; // Inside the plugin... for(var i = 1; i <= 30; i++){ var newWedge = new WedgePath(canvas); newWedge.label = "my_wedge_"+i; wedgeArray.push(newWedge); } for(var i = 0; i < wedgeArray.length; i++){ wedgeArray[i].logLabel() } But again, I get the last instance of WedgePath to be created. This is driving me nuts. I apologise for the length of the question but I wanted to be as clear as possible. END ============================================================== Also, here's the code for dbInterface object should it be relevant. function DatabaseInterface(db){ var DB = db; this.sql = function(sql, arr, pSuccessHandler, pErrorHandler){ successHandler = (pSuccessHandler) ? pSuccessHandler : this.defaultSuccessHandler; errorHandler = (pErrorHandler) ? pErrorHandler : this.defaultErrorHandler; DB.transaction(function(tx){ if(!arr || arr.length == 0){ tx.executeSql(sql, [], successHandler, errorHandler); }else{ tx.executeSql(sql,arr, successHandler, errorHandler) } }); } // ---------------------------------------------------------------- // A Default Error Handler // ---------------------------------------------------------------- this.defaultErrorHandler = function(transaction, error){ // error.message is a human-readable string. // error.code is a numeric error code console.log('WebSQL Error: '+error.message+' (Code '+error.code+')'); // Handle errors here var we_think_this_error_is_fatal = true; if (we_think_this_error_is_fatal) return true; return false; } // ---------------------------------------------------------------- // A Default Success Handler // This doesn't do anything except log a success message // ---------------------------------------------------------------- this.defaultSuccessHandler = function(transaction, results) { console.log("WebSQL Success. Default success handler. No action taken."); } }

    Read the article

  • How to replace a div container with javascript

    - by Kovu
    Hi, I must have a little design in javascript. I have a menu with 5 entrys and only 1 HTML-page. So I will have a content-div and enabled and disabled different static content in it, each menu-entry is another content. I tried with 5 divs and disable 4 of them and enable 1, but the element under each other means every div is like a - enabled or not, so the "content" is moving then. Hope its understandable. Here is the code so far: <html><head><title>Des Einsame-Katerchen's kleine Homepage</title> <style type="text/css"> a:link { font-weight:bold; color:blue; text-decoration:none; } a:visited { font-weight:bold; color:blue; text-decoration:none; } a:focus { font-weight:bold; color:blue; text-decoration:none; } a:hover { font-weight:bold; color:blue; text-decoration:line-through; } a:active { font-weight:bold; color:blue; text-decoration:none; } h1:focus { background-color:red; } h1:hover { background-color:silver; } h1:active { background-color:green; } </style> <script> function an(id) { document.getElementById('start').style.visibility = 'hidden'; document.getElementById('start').style.height = '0px'; document.getElementById('me').style.visibility = 'hidden'; document.getElementById('me').style.height = '0px'; document.getElementById('rpg').style.visibility = 'hidden'; document.getElementById('rpg').style.height = '0px'; document.getElementById('musik').style.visibility = 'hidden'; document.getElementById('musik').style.height = '0px'; document.getElementById('screens').style.visibility = 'hidden'; document.getElementById('screens').style.height = '0px'; document.getElementById(id).style.visibility = 'visible'; document.getElementById(id).style.height = '500px'; } </script> </head> <body style=" " > <div style="width=100%; text-align:center; border: 1px red solid; height:40px;"> <div style="float:left; width:100px;"><a href="#" OnClick="an('start')" >Startseite</a></div> <div style="float:left; width:100px;"><a href="#" OnClick="an('me')" >Über mich</a></div> <div style="float:left; width:100px;"><a href="#" OnClick="an('rpg')" >RPG-Chars</a></div> <div style="float:left; width:100px;"><a href="#" OnClick="an('musik')" >Musik</a></div> <div style="float:left; width:150px;"><a href="#" OnClick="an('screens')" >Knuddels-Screens</a></div> </div> <br> <div id="start" style="border:1px red solid; width:500px; height:500px; overflow: visible; " > a </div> <div id="me" style="border:1px red solid; width:500px; height:0px; overflow: visible; visibility: hidden; " > b </div> <div id="rpg" style="border:1px red solid; width:500px; height:0px; overflow: visible; visibility: hidden; " > c </div> <div id="musik" style="border:1px red solid; width:500px; height:0px; overflow: visible; visibility: hidden; " > d </div> <div id="screens" style="border:1px red solid; width:500px; height:0px; overflow: visible; visibility: hidden; " > e </div> </body>

    Read the article

  • JavaScript snippet that populates the table

    - by kayn
    I would like to write a JavaScript snippet that populates the table based on the selection, and not create several details panes and toggle their visibility. I tried implement this using the following code but its not working as desired,firstly,it only works with internet explorer under certain conditions and it just toggles visibility of detail panes;Below is my code; <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> </HEAD> <BODY onLoad="tblTB_0.style.display='';tblTB_1.style.display='none'; tblTB_2.style.display='none'; tblTB_3.style.display='none'"> <center> <table> <tr> <td> <H1> <align="left"> Candi Colledge of Computing <br/>Course Page </H1> </td> </tr> </table> </center> <hr> </br> <H2><P STYLE="color: blue">Honours Courses.</H2> <left> <p><a href="" onclick="tblTB_1.style.display=''; tblTB_2.style.display='none'; tblTB_3.style.display='none'"> Concurrent Programming</a> <br/> <a href="" onclick="tblTB_1.style.display='none';tblTB_2.style.display=''; tblTB_3.style.display='none'">Simulation of Networks</a><br/> <a href="" onclick="tblTB_1.style.display='none';tblTB_2.style.display='none'; tblTB_3.style.display=''">Advanced Computer Science Topics</a></p> <br> <table style="table-layout: fixed"; border=1> <colgroup> <col width="100px"><col width="150px"><col width="150px"> </colgroup> <tbody id="tblTB_0"> <tr> <td>Course Code</td> <td>Lecturer</td> <td>Hours/Week</td> <td>Credits</td> </tr> </tbody> <tbody id="tblTB_1"> <tr> <td>RW 714</td> <td>Dr. kate</td> <td>2 hrs</td> <td>15</td </tr> </tbody> <tbody id="tblTB_2"> <tr> <td>RW 742</td> <td>Prof. Broz</td> <td>4 hrs</td> <td>10</td> </tr> </tbody> <tbody id="tblTB_3"> <tr> <td>RW 716</td> <td>Consultant</td> <td>3 hrs</td> <td>12</td> </tr> </tbody> </table> </left> <br> </BODY> </HTML>

    Read the article

  • Help with shopping cart in javascript

    - by user228390
    Hey guys, I'm having problems with my shopping cart. What I am trying to do is make a function that will add an item the cart and then and function that will view the cart and show the details. But what I have got so far does not do that, it just simply adds and goes straight to view cart. Also I wanted to store the name of each items in different global arrays (name, price and sum) but I can't get it work that way. Can any help me overcome this problem? Edit: I've tried to get it to work by adding some more items and attaching it to another html page, but now the code does not seem to work at all , before it showed the price and total and now I get nothing . javascript code function round_total (c) { var pennies = c * 100; pennies = Math.round(pennies); var strPennies = "" + pennies; var len = strPennies.length; return parseFloat(strPennies.substring(0, len - 2) + "." + strPennies.substring(len - 2, len)); } // End of round_total function. /* Start of generate_page function. */ function generate_page (form) { tax = 0.08; delivery_p = 2.99; var odate = new Date(); var qty = form.quantity.value; var product_v = new String(form.product.value); var total_price = product_v.substr(product_v.indexOf("$") + 1, product_v.length - product_v.indexOf("$")); var price_without_tax = round_total(qty * total_price); var ttax = round_total(price_without_tax * tax); var delivery = round_total(qty * delivery_p); var total_p = round_total(price_without_tax + ttax + delivery); document.writeln("Quantity: " + qty + "<br>"); document.writeln("Price: $" + total_price + "<br>"); document.writeln("Delivery: $" + delivery + "<br>"); document.writeln("Total: $" + total_p + "<br>"); document.writeln("Order placed on: " + odate.toGMTString()); } function calculate() { round_total (c)(); generate_page (form)(); } HTML code: Shopping cart Welcome, Guest Login Sign Up Stay Updated: Subscribe via RSS Email Updates <div id="header"> <div id="branding" class="container"> <h1>The Finest Toy<br /> Store Online</h1> <p class="desc">If you're looking for a toy shop then look no further.<br/> Go on, treat the kids with our huge selection of<br/>online toy shops selling toys for all ages.</p> </div><!-- end branding --> <div id="navigation"> <ul id="menu" class="container"> <li><a href="#">HOME</a></li> <li><a href="#">ABOUT</a></li> <li><a href="#">Online Store</a></li> <li><a href="#">CONTACT</a></li> </ul> </div><!-- end navigation --> </div><!-- end header --> Shopping Cart Nintendo DS Xbox Product: Console £149.99 Console + Games £169.99 Quantity: Product: Console £149.99 Console + Games £169.99 Quantity:     Playstation 3 Wii Product: Console £149.99 Console + Games £169.99 Quantity:   Product: Console £149.99 Console + Games £169.99 Quantity:        <input type="submit" value="Add to cart" name="submit" onClick="cart()";/><input , type="reset" value="Reset" name="reset" Copyright © 2010 shopping cart. Content and Header © |Back to top Do I need to show my CSS as well? (Sorry about the coding its not working properly for me, its not showing up the way it should be)

    Read the article

  • Pass a variable from javascript to php in the same session OnClickFunction

    - by MickyScion
    I was seeing through stackoverflow the solutions for this kind of problems but any of them are executing the code of javascript in the same session...please i want some help with this...i have this in my session <script> function show_alert() { var ProdAntes = document.getElementById("productoseleccionado").value; var CantAntes = document.getElementById("cantidadantes").value; var PrecAntes = document.getElementById("precioantes").value; var FecAntes = document.getElementById("fechaantes").value; var ProdAhora = document.getElementById("SoyaProductorProduccionProducto").value; var CantAhora = document.getElementById("SoyaProductorProduccionCantidadtm").value; var PrecAhora = document.getElementById("SoyaProductorProduccionPreciodolar").value; var FecAhora = document.getElementById("select_date").value; } </script> and in my html stuff i have this <?php echo $this->Form->create('SoyaProductorProduccion');?> <fieldset> <?php echo $this->Form->hidden('id', array('value' => $this->data['SoyaProductorProduccion']['id'])); echo $this->Form->input('operacion', array('type' => 'hidden', 'value'=>'Produccion')); //-------------------------------------------------------------- $productoseleccionado = $this->data['SoyaProductorProduccion']['producto']; echo $this->Form->input('productoseleccionado', array('type' => 'hidden','style'=>'width:500px; height:30px;','id' => 'productoseleccionado' , 'value' => $productoseleccionado)); echo $this->Form->input('producto', array( 'options' => array( $productoseleccionado => $productoseleccionado, 'Torta solvente de soya' => 'Torta solvente de soya', 'Torta solvente de girasol' => 'Torta solvente de girasol', 'Harina integral de soya' => 'Harina integral de soya', 'Harina de girasol' => 'Harina de girasol', 'Cascarilla de soya' => 'Cascarilla de soya', 'Cascarilla de girasol' => 'Cascarilla de girasol', 'Aceite de soya refinado' => 'Aceite de soya refinado', 'Aceite de soya crudo' => 'Aceite de soya crudo', 'Aceite de girasol refinado' => 'Aceite de girasol refinado', 'Aceite de girasol crudo' => 'Aceite de girasol crudo', ),'label'=>'Tipo de Producto' )); foreach ($soyacambiodolares as $soyacambiodolar): $dolar=$soyacambiodolar['SoyaCambioDolar']['cambio']; endforeach; echo $this->Form->input('cambio', array('type' => 'hidden','value' => $dolar)); //----------------------------------------------------------------------------- $cantidadantes = $this->data['SoyaProductorProduccion']['cantidadtm']; echo $this->Form->input('cantidadantes', array('type' => 'hidden','style'=>'width:500px; height:30px;', 'value' => $cantidadantes,'id' => 'cantidadantes')); echo $this->Form->input('cantidadtm', array('label' => 'Cantidad en tonelada(s) métrica(s) del producto (TM)','style'=>'width:500px; height:30px;')); //----------------------------------------------------------------------------- $precioantes = $this->data['SoyaProductorProduccion']['preciodolar']; echo $this->Form->input('precioantes', array('type' => 'hidden','style'=>'width:500px; height:30px;', 'value' => $precioantes,'id' => 'precioantes')); echo $this->Form->input('preciodolar', array('label' => 'Precio en Dolares Americanos por tonelada métrica (TM / $us)','style'=>'width:500px; height:30px;')); //----------------------------------------------------------------------------- ?> <table style="width: 600px"> <tr> <td > <?php //---------------------------------------------------------------- $fechaantes = $this->data['SoyaProductorProduccion']['fecharegistro']; echo $this->Form->input('fechaantes', array('type' => 'hidden','style'=>'width:500px; height:30px;', 'value' => $fechaantes, 'id' => 'fechaantes')); //---------------------------------------------------------------- echo $this->Form->input("fecharegistro", array( 'label' => '<strong>Periodo al que corresponde la declaración</strong>', 'type' => 'text', 'style' => 'width: 110px', 'class' => 'fl tal vat w300p', 'error' => false , 'id' => 'select_date')); ?> <?php echo $this->Html->div('datepicker_img w100p fl pl460p pa', $this->Html->image('datepicker_calendar_icon.gif'),array('id' => 'datepicker_img')); ?> <?php echo $this->Html->div('datepicker fl pl460p pa', ' ' ,array('id' => 'datepicker')); ?> </td> </tr> </table> <?php echo $this->Form->submit('Modificar Existencia', array('class' => 'form-submit', 'title' => 'Presione aqui para agregar datos', 'onclick' => 'return show_alert();')); ?> </fieldset> <?php echo $this->Form->end(); ?> my function is ok but i want these: when i click the submit button i want to compare wich field had been changed, and i want to create a chain of detailed changes like "change in the field 1, change in the fiel 2.--" and so on...and this has to be saved in my database so i have to pass to a variable in my php before saving...thanks!

    Read the article

  • Building my first Javascript Application (jQuery), struggling on something

    - by Jason Wells
    I'd really appreciate recommendations on the most efficient way to approach this. I'm building a simple javascript application which displays a list of records and allows the user to edit a record by clicking an "Edit" link in the records row. The user also can click the "Add" link to pop open a dialog allowing them to add a new record. Here's a working prototype of this: http://jsfiddle.net/FfRcG/ You'll note if you click "Edit" a dialog pops up with some canned values. And, if you click "Add", a dialog pops up with empty values. I need help on how to approach two problems I believe we need to pass our index to our edit dialog and reference the values within the JSON, but I am unsure how to pass the index when the user clicks edit. It bothers me that the Edit and Add div contents are so similiar (Edit just pre populates the values). I feel like there is a more efficient way of doing this but am at a loss. Here is my code for reference $(document).ready( function(){ // Our JSON (This would actually be coming from an AJAX database call) people = { "COLUMNS":["DATEMODIFIED", "NAME","AGE"], "DATA":[ ["9/6/2012", "Person 1","32"], ["9/5/2012","Person 2","23"] ] } // Here we loop over our JSON and build our HTML (Will refactor to use templating eventually) members = people.DATA; var newcontent = '<table width=50%><tr><td>date</td><td>name</td><td>age</td><td></td></tr>'; for(var i=0;i<members.length;i++) { newcontent+= '<tr id="member'+i+'"><td>' + members[i][0] + '</td>'; newcontent+= '<td>' + members[i][1] + '</td>'; newcontent+= '<td>' + members[i][2] + '</td>'; newcontent+= '<td><a href="#" class="edit" id=edit'+i+'>Edit</a></td><td>'; } newcontent += "</table>"; $("#result").html(newcontent); // Bind a dialog to the edit link $(".edit").click( function(){ // Trigger our dialog to open $("#edit").dialog("open"); // Not sure the most efficient way to change our dialog field values $("#name").val() // ??? alert($()); return false; }); // Bind a dialog to the add link $(".edit").click( function(){ // Trigger our dialog to open $("#add").dialog("open"); return false; }); // Bind a dialog to our edit DIV $("#edit").dialog(); // Bind a dialog to our add DIV $("#add").dialog(); }); And here's the HTML <h1>People</h1> <a href="#" class="add">Add a new person</a> <!-- Where results show up --> <div id="result"></div> <!-- Here's our edit DIV - I am not clear as to the best way to pass the index in our JSON so that we can reference positions in our array to pre populate the input values. --> <div id="edit"> <form> <p>Name:<br/><input type="text" id="name" value="foo"></p> <p>Age:<br/><input type="text" id="age" value="33"></p> <input type="submit" value="Save" id="submitEdit"> </form> </div> <!-- Here's our add DIV - This layout is so similiar to our edit dialog. What is the most efficient way to handle a situation like this? --> <div id="add"> <form> <p>Name:<br/><input type="text" id="name"></p> <p>Age:<br/><input type="text" id="age"></p> <input type="submit" value="Save" id="submitEdit"> </form> </div>

    Read the article

  • jqGrid dynamic select option

    - by Jo
    I'm creating a jqgrid with drop down columns and I'm using cell editing. I need the options of the drop down columns to change dynamically and I've tried implementing this by setting the column to be: { name: "AccountLookup", index: "AccountLookup", width: 90, editable: true, resizable: true, edittype: "select", formatter: "select" }, and then in the beforeCellEdit event I have: beforeEditCell: function(id, name, val, iRow, iCol) { if(name=='AccountLookup') { var listdata = GetLookupValues(id, name); if (listdata == null) listdata = "1:1"; jQuery("#grid").setColProp(name, { editoptions: { value: listdata.toString()} }) } }, GetLookupValues just returns a string in the format "1:One;2:Two" etc. That works fine however the options are populated one click behind - ie i click on AccountID in row 1, and the dropdown is empty, however when I then click on AccountID in row 3 the options I set in the row 1 click are shown in the row 3 click. And so on. So always one click behind. Is there another way of achieving what I need? Bacially the dropdown options displayed are always changing and I need to load them as user enters the cell for editing. Perhaps I can somehow get at the select control in the beforeEditCell event and manually enter its values instead of using the setColProp call? If so could I get an example of doing that please? Another thing - if the dropdown is empty and a user doesn't cancel the cell edit, the grid script throws an error. I'm using clientarray editing if that makes a difference. Greatly appreciate any help. Regards, Jo

    Read the article

  • ASP.NET 3.5 GridView - row editing - dynamic binding to a DropDownList

    - by marc_s
    This is driving me crazy :-) I'm trying to get a ASP.NET 3.5 GridView to show a selected value as string when being displayed, and to show a DropDownList to allow me to pick a value from a given list of options when being edited. Seems simple enough? My gridview looks like this (simplified): <asp:GridView ID="grvSecondaryLocations" runat="server" DataKeyNames="ID" OnInit="grvSecondaryLocations_Init" OnRowCommand="grvSecondaryLocations_RowCommand" OnRowCancelingEdit="grvSecondaryLocations_RowCancelingEdit" OnRowDeleting="grvSecondaryLocations_RowDeleting" OnRowEditing="grvSecondaryLocations_RowEditing" OnRowUpdating="grvSecondaryLocations_RowUpdating" > <Columns> <asp:TemplateField> <ItemTemplate> <asp:Label ID="lblPbxTypeCaption" runat="server" Text='<%# Eval("PBXTypeCaptionValue") %>' /> </ItemTemplate> <EditItemTemplate> <asp:DropDownList ID="ddlPBXTypeNS" runat="server" Width="200px" DataTextField="CaptionValue" DataValueField="OID" /> </EditItemTemplate> </asp:TemplateField> </asp:GridView> The grid gets displayed OK when not in editing mode - the selected PBX type shows its value in the asp:Label control. No surprise there. I load the list of values for the DropDownList into a local member called _pbxTypes in the OnLoad event of the form. I verified this - it works, the values are there. Now my challenge is: when the grid goes into editing mode for a particular row, I need to bind the list of PBX's stored in _pbxTypes. Simple enough, I thought - just grab the drop down list object in the RowEditing event and attach the list: protected void grvSecondaryLocations_RowEditing(object sender, GridViewEditEventArgs e) { grvSecondaryLocations.EditIndex = e.NewEditIndex; GridViewRow editingRow = grvSecondaryLocations.Rows[e.NewEditIndex]; DropDownList ddlPbx = (editingRow.FindControl("ddlPBXTypeNS") as DropDownList); if (ddlPbx != null) { ddlPbx.DataSource = _pbxTypes; ddlPbx.DataBind(); } .... (more stuff) } Trouble is - I never get anything back from the FindControl call - seems like the ddlPBXTypeNS doesn't exist (or can't be found). What am I missing?? Must be something really stupid.... but so far, all my Googling, reading up on GridView controls, and asking buddies hasn't helped. Who can spot the missing link? ;-) Marc

    Read the article

  • Javascript or CSS hover not working in Safari and Chrome

    - by PAZtech
    I have a problem with a script for a image gallery. The problem seems to only occur on Safari and Chrome, but if I refresh the page I get it to work correctly - weird! Correct function: The gallery has a top bar, which if you hover over it, it will display a caption. Below sits the main image. At the bottom there is another bar that is a reversal of the top bar. When you hover over it, it will display thumbnails of the gallery. The problem: In Safari and Chrome, the thumbnail holder will not display. In fact, it doesn't even show it as an active item (or a rollover). But oddly enough, if you manually refresh the page it begins to work correctly for the rest of the time you view the page. Once you have left the page and return the same error occurs again and you have to go through the same process. Here's one of the pages to look at: link text Here's the CSS: #ThumbsGutter { background: url(../Images/1x1.gif); background: url(/Images/1x1.gif); height: 105px; left: 0px; position: absolute; top: 0px; width: 754px; z-index: 2; } #ThumbsHolder { display: none; } #ThumbsTable { left: 1px; } #Thumbs { background-color: #000; width: 703px; } #Thumbs ul { list-style: none; margin: 0; padding: 0; } #Thumbs ul li { display: inline; } .Thumbs ul li a { border-right: 1px solid #fff; border-top: 1px solid #fff; float: left; left: 1px; } .Thumbs ul li a img { filter: alpha(opacity=50); height: 104px; opacity: .5; width: 140px; } .Thumbs ul li a img.Hot { filter: alpha(opacity=100); opacity: 1; } Here is the javascript: //Variables var globalPath = ""; var imgMain; var gutter; var holder; var thumbs; var loadingImage; var holderState; var imgCount; var imgLoaded; var captionHolder; var captionState = 0; var captionHideTimer; var captionHideTime = 500; var thumbsHideTimer; var thumbsHideTime = 500; $(document).ready(function() { //Load Variables imgMain = $("#MainImage"); captionHolder = $("#CaptionHolder"); gutter = $("#ThumbsGutter"); holder = $("#ThumbsHolder"); thumbs = $("#Thumbs"); loadingImage = $("#LoadingImageHolder"); //Position Loading Image loadingImage.centerOnObject(imgMain); //Caption Tab Event Handlers $("#CaptionTab").mouseover(function() { clearCaptionHideTimer(); showCaption(); }).mouseout(function() { setCaptionHideTimer(); }); //Caption Holder Event Handlers captionHolder.mouseenter(function() { clearCaptionHideTimer(); }).mouseleave(function() { setCaptionHideTimer(); }); //Position Gutter if (jQuery.browser.safari) { gutter.css("left", imgMain.position().left + "px").css("top", ((imgMain.offset().top + imgMain.height()) - 89) + "px"); } else { gutter.css("left", imgMain.position().left + "px").css("top", ((imgMain.offset().top + imgMain.height()) - 105) + "px"); } //gutter.css("left", imgMain.position().left + "px").css("top", ((imgMain.offset().top + imgMain.height()) - 105) + "px"); //gutter.css("left", imgMain.offset().left + "px").css("top", ((imgMain.offset().top + imgMain.height()) - gutter.height()) + "px"); //Thumb Tab Event Handlers $("#ThumbTab").mouseover(function() { clearThumbsHideTimer(); showThumbs(); }).mouseout(function() { setThumbsHideTimer(); }); //Gutter Event Handlers gutter.mouseenter(function() { //showThumbs(); clearThumbsHideTimer(); }).mouseleave(function() { //hideThumbs(); setThumbsHideTimer(); }); //Next/Prev Button Event Handlers $("#btnPrev").mouseover(function() { $(this).attr("src", globalPath + "/Images/GalleryLeftButtonHot.jpg"); }).mouseout(function() { $(this).attr("src", globalPath + "/Images/GalleryLeftButton.jpg"); }); $("#btnNext").mouseover(function() { $(this).attr("src", globalPath + "/Images/GalleryRightButtonHot.jpg"); }).mouseout(function() { $(this).attr("src", globalPath + "/Images/GalleryRightButton.jpg"); }); //Load Gallery //loadGallery(1); }); function loadGallery(galleryID) { //Hide Holder holderState = 0; holder.css("display", "none"); //Hide Empty Gallery Text $("#EmptyGalleryText").css("display", "none"); //Show Loading Message $("#LoadingGalleryOverlay").css("display", "inline").centerOnObject(imgMain); $("#LoadingGalleryText").css("display", "inline").centerOnObject(imgMain); //Load Thumbs thumbs.load(globalPath + "/GetGallery.aspx", { GID: galleryID }, function() { $("#TitleHolder").html($("#TitleContainer").html()); $("#DescriptionHolder").html($("#DescriptionContainer").html()); imgCount = $("#Thumbs img").length; imgLoaded = 0; if (imgCount == 0) { $("#LoadingGalleryText").css("display", "none"); $("#EmptyGalleryText").css("display", "inline").centerOnObject(imgMain); } else { $("#Thumbs img").load(function() { imgLoaded++; if (imgLoaded == imgCount) { holder.css("display", "inline"); //Carousel Thumbs thumbs.jCarouselLite({ btnNext: "#btnNext", btnPrev: "#btnPrev", mouseWheel: true, scroll: 1, visible: 5 }); //Small Image Event Handlers $("#Thumbs img").each(function(i) { $(this).mouseover(function() { $(this).addClass("Hot"); }).mouseout(function() { $(this).removeClass("Hot"); }).click(function() { //Load Big Image setImage($(this)); }); }); holder.css("display", "none"); //Load First Image var img = new Image(); img.onload = function() { imgMain.attr("src", img.src); setCaption($("#Image1").attr("alt")); //Hide Loading Message $("#LoadingGalleryText").css("display", "none"); $("#LoadingGalleryOverlay").css("display", "none"); } img.src = $("#Image1").attr("bigimg"); } }); } }); } function showCaption() { if (captionState == 0) { $("#CaptionTab").attr("src", globalPath + "/Images/CaptionTabHot.jpg"); captionHolder.css("display", "inline").css("left", imgMain.position().left + "px").css("top", imgMain.position().top + "px").css("width", imgMain.width() + "px").effect("slide", { "direction": "up" }, 500, function() { captionState = 1; }); } } function hideCaption() { if (captionState == 1) { captionHolder.toggle("slide", { "direction": "up" }, 500, function() { $("#CaptionTab").attr("src", globalPath + "/Images/CaptionTab.jpg"); captionState = 0; }); } } function setCaptionHideTimer() { captionHideTimer = window.setTimeout(hideCaption,captionHideTime); } function clearCaptionHideTimer() { if(captionHideTimer) { window.clearTimeout(captionHideTimer); captionHideTimer = null; } } function showThumbs() { if (holderState == 0) { $("#ThumbTab").attr("src", globalPath + "/Images/ThumbTabHot.jpg"); holder.effect("slide", { "direction": "down" }, 500, function() { holderState = 1; }); } } function hideThumbs() { if (holderState == 1) { if (jQuery.browser.safari) { holder.css("display", "none"); $("#ThumbTab").attr("src", globalPath + "/Images/ThumbTab.jpg"); holderState = 0; } else { holder.toggle("slide", { "direction": "down" }, 500, function() { $("#ThumbTab").attr("src", globalPath + "/Images/ThumbTab.jpg"); holderState = 0; }); } } } function setThumbsHideTimer() { thumbsHideTimer = window.setTimeout(hideThumbs,thumbsHideTime); } function clearThumbsHideTimer() { if(thumbsHideTimer) { window.clearTimeout(thumbsHideTimer); thumbsHideTimer = null; } } function setImage(image) { //Show Loading Image loadingImage.css("display", "inline"); var img = new Image(); img.onload = function() { //imgMain.css("background","url(" + img.src + ")").css("display","none").fadeIn(250); imgMain.attr("src", img.src).css("display", "none").fadeIn(250); setCaption(image.attr("alt")); //Hide Loading Image loadingImage.css("display", "none"); }; img.src = image.attr("bigimg"); } function setCaption(caption) { $("#CaptionText").html(caption); //alert($("#CaptionText").html()); /* if (caption.length 0) { $("#CaptionText") .css("display", "inline") .css("left", imgMain.position().left + "px") .css("top", imgMain.position().top + "px") .css("width", imgMain.width() + "px") .html(caption); $("#CaptionOverlay").css("display", "inline") .css("height", $("#CaptionText").height() + 36 + "px") .css("left", imgMain.position().left + "px") .css("top", imgMain.position().top + "px") .css("width", imgMain.width() + "px"); } else { $("#CaptionText").css("display", "none"); $("#CaptionOverlay").css("display", "none"); } */ } Please if anyone could help, it would be greatly appreciated! Thanks in advance. Justin

    Read the article

  • Dynamic localization with Data Annotations possible?

    - by devries48
    Hi, I'm trying to dynamicly update the language of a Silverlight application. I tried the example provided by Tim Heuer and that was exactly wat I needed. Silverlight and localizing string data Now I'm experimenting with Data Annotations and would like to have the same behaviour.But with no luck... Can someone point me in the right direction. DataAnnotation of a property: [Display(Name = "UserNameLabel", ResourceType = typeof(Resources.Strings.StringResources))] [Required] public string Username ... My Xaml: <dataInput:Label Target="{Binding ElementName=tbUserName}" PropertyPath="UserName"/> Thanks, Ron

    Read the article

  • Silverlight 3 Dynamic DataGrid RowStyle Ignored

    - by antoinne85
    I subclassed the standard DataGrid into SpecialDataGrid so I could override the KeyDown/KeyUp events. Other than that SpecialDataGrid is exactly the same as DataGrid. At run-time I dynamically create a bunch of these SpecialDataGrids. When a user clicks a row in the grid it hightlights, which is fine, but when that grid loses focus, it leaves a residual gray highlight on the last-selected row, which is not fine. I've heavily edited the RowStyle and CellStyle I'm applying to these Grids to more-or-less remove all formatting. I even added a static SpecialDataGrid to the app with test data so I could see if the RowStyle was somehow incorrect, applying the same RowStyle and CellStyle that I'm applying to the dynamically generated one (you'll see it in the code below). What I saw was that the "test grid" showed up exactly as I wanted, and the real grid is ignoring part of the RowStyle! Has anyone run into this issue or have any ideas of how to correct it? Some source and images follow. Creating the SpecialDataGrid: //Set up a datagrid. SpecialDataGrid radio_datagrid = new SpecialDataGrid(); radio_datagrid.ItemsSource = radios; radio_datagrid.AutoGenerateColumns = false; radio_datagrid.HeadersVisibility = DataGridHeadersVisibility.None; radio_datagrid.BorderThickness = new Thickness(0); radio_datagrid.HorizontalAlignment = HorizontalAlignment.Stretch; radio_datagrid.IsReadOnly = true; radio_datagrid.MouseLeftButtonUp += new MouseButtonEventHandler(option_datagrid_MouseLeftButtonUp); radio_datagrid.KeyDown += new KeyEventHandler(radio_datagrid_KeyDown); radio_datagrid.KeyUp += new KeyEventHandler(radio_datagrid_KeyUp); //Radio column. DataGridTemplateColumn temp_col = new DataGridTemplateColumn(); temp_col.CellTemplate = (DataTemplate)this.Resources["RadioColumnTemplate"]; temp_col.Width = new DataGridLength(20); radio_datagrid.Columns.Add(temp_col); //Description column. DataGridTextColumn txt_col = new DataGridTextColumn(); txt_col.Binding = new Binding("optionlabel"); txt_col.Width = new DataGridLength(350); radio_datagrid.Columns.Add(txt_col); //Product code column. txt_col = new DataGridTextColumn(); txt_col.Binding = new Binding("optioncode"); txt_col.Width = new DataGridLength(80); radio_datagrid.Columns.Add(txt_col); //Price column. txt_col = new DataGridTextColumn(); txt_col.Binding = new Binding("optionprice"); txt_col.Width = new DataGridLength(80); radio_datagrid.Columns.Add(txt_col); //View column. temp_col = new DataGridTemplateColumn(); temp_col.CellTemplate = (DataTemplate)this.Resources["HyperlinkButtonColumnTemplate"]; temp_col.Width = new DataGridLength(30); radio_datagrid.Columns.Add(temp_col); radio_datagrid.RowStyle = (Style)this.Resources["StyleDataGridRowNoAlternating"]; radio_datagrid.CellStyle = (Style)this.Resources["Style_DataGridCell_NoHighlight"]; Example Image: The lower DataGrid appears that way regardless of what you do to it. No highlighting of any sort and certainly no residual highlights. Any idea what's keeping this from being applied to the first?

    Read the article

  • ASP.NET Wizard control with Dynamic UserControls

    - by wjat777
    Hello everyone I'm trying to use the Wizard control as follows: 1 - In the first step (first screen) has a cheklistbox with several options 2 - For each option selected, will be created an extra step 3 - In some steps may be set up intermediate stages Me problem is that each step is a usercontrol. So if the first step I select option1 and option3, I should create two more steps with usercontrol1 and UserControl3 .... Someone already did something similar? I will try explain better the problem. I'll paste here, but I put a copy of the project in skydrive: http://cid-3d949f1661d00819.skydrive.live.com/self.aspx/C%5E3/WizardControl2.7z It is a very basic example of what I'm trying to do. The project has page.ASPX 1 and 3 usercontrol.ASCX (UC1, UC2 and UC3) Default.ASPX: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication2._Default" % Option1 Option2 Option3 Code Behind: using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace WebApplication2 { public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } protected void Page_PreInit(object sender, EventArgs e) { LoadSteps(); } private void LoadSteps() { int count = Wizard1.WizardSteps.Count; for (int i = count - 1; i > 0; i--) { WizardStepBase step = Wizard1.WizardSteps[i]; if (step.StepType != WizardStepType.Start) Wizard1.WizardSteps.Remove(step); } string Activities=""; foreach (ListItem item in CheckBoxList1.Items) { if (item.Selected) { WizardStep step = new WizardStep {ID = "step_" + item.Value, Title = "step_" + item.Value}; UserControl uc=null; switch (item.Value) { case "1": uc=(UserControl)LoadControl("~/UC1.ascx"); break; case "2": uc=(UserControl)LoadControl("~/UC2.ascx"); break; case "3": uc=(UserControl)LoadControl("~/UC3.ascx"); break; } step.Controls.Add(uc); Wizard1.WizardSteps.Add(step); } } } protected void CheckBoxList1_SelectedIndexChanged(object sender, EventArgs e) { LoadSteps(); } } } Control UC1.ASCX to UC3.ASCX has the same code (as an example) usercontrol.ascx: <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="UC1.ascx.cs" Inherits="WebApplication2.UC1" % AutoPostBack="True" AutoPostBack="True" Code Behind: using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace WebApplication2 { public partial class UC1 : System.Web.UI.UserControl { protected void Page_Init(object sender, EventArgs e) { List list1 = new List { "Alice", "Bob", "Chris" }; List list2 = new List { "UN", "DEUX", "TROIS" }; DropDownList1.DataSource = list1; DropDownList2.DataSource = list2; DropDownList1.DataBind(); DropDownList2.DataBind(); } protected void Page_Load(object sender, EventArgs e) { if (IsPostBack) return; } protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) { Label1.Text = DropDownList1.SelectedValue; } protected void DropDownList2_SelectedIndexChanged(object sender, EventArgs e) { Label2.Text = DropDownList2.SelectedValue; } } } You can see that the controls UserControls trigger events (they cause postbacks) The behavior of this project is a little different than I described in the first thread, but the problem is the same. After the second time "next" button, you will get an error. Thanks in advance William

    Read the article

  • Are you as productive in Javascript as you are in .Net or Java?

    - by bglenn
    I code primarily in javascript and in vb.net. I've found that if I can achieve the same thing in both javascript and vb.net that I feel far more productive and expressive using javascript for the task. I often find myself researching server-side javascript implementations to see if anything has gone mainstream so that I can code my back-end business logic and data access in javascript. Given all the advanced tooling and language features in .Net this preference seems somewhat paradoxical to me. I'm not suggesting one is better than the other (I've been a vb programmer since I started programming), I'm just wondering if my preference is entirely subjective or if anyone else shares it. So, does anyone else enjoy coding in javascript to the point where you prefer it to the .Net and Java environment, and if, so why?

    Read the article

  • WPF ToolTip Style with dynamic LayoutTransform

    - by NoOne
    I have an app that scales it's UI and I want to scale the ToolTips with it. I have tried doing this: <Style TargetType="{x:Type ToolTip}"> <Setter Property="LayoutTransform" Value="{DynamicResource scaleTransf}"/> ... </Style> ...where scaleTransf is a resource that I change via code: Application.Current.Resources["scaleTransf"] = new ScaleTransform(...); Most of the ToolTips do get scaled in size but some of them that are created by C# code don't get scaled. I've checked and it seems that I don't set their Style or LayoutTransform by code, so I don't really understand what is going wrong... Moreover, I have the impression that the above XAML code worked fine a few days ago. :( Is there sth I can do to make it work all the time without setting the LayoutTransform in code-behind? EDIT : The ToolTips that don't change scale are the ones that have become visible before. EDIT2 : Extra code: <ScaleTransform x:Key="scaleTransf" ScaleX="1" ScaleY="1"/> I have also tried this: Application.Current.Resources.Remove("scaleTransf"); Application.Current.Resources.Add("scaleTransf", new ScaleTransform(val, val)); EDIT3 : My attempt to solve this using a DependencyProperty: In MainWindow.xaml.cs : public static readonly DependencyProperty TransformToApplyProperty = DependencyProperty.Register("TransformToApply", typeof(Transform), typeof(MainWindow)); public Transform TransformToApply { get { return (Transform)this.GetValue(TransformToApplyProperty); } } Somewhere in MainWindow, in response to a user input: this.SetValue(TransformToApplyProperty, new ScaleTransform(val, val)); XAML Style: <Style TargetType="{x:Type ToolTip}"> <Setter Property="LayoutTransform" Value="{Binding TransformToApply, ElementName=MainWindow}"/> ... Using this code, not a single one of the ToolTips seem to scale accordingly.

    Read the article

< Previous Page | 150 151 152 153 154 155 156 157 158 159 160 161  | Next Page >