Search Results

Search found 3639 results on 146 pages for 'dom manipulation'.

Page 132/146 | < Previous Page | 128 129 130 131 132 133 134 135 136 137 138 139  | Next Page >

  • Possible defect with jQuery ':checked' selector (finding checked checkbox when there are none)

    - by Mphammad Ashour
    Found a strange thing. The following code is supposed to set a default value for a UI element based on whether one of a group of checkboxes (all having attribute name="privacy") is checked (in say, a form postback). If there is no value in the HTML sent by the server (the form is not a postback), the default value should be firstMenuItemKey. Otherwise, it should be the one checked in the underlying HTML. However, while this works on the first call to the URL that includes the form, a refresh of the page will set the value of defaultPrivacyValue to one of the privacy checkboxes'. I've checked that the server isn't checking the checkbox before the script runs (it's not). I've also checked whether somewhere else in the script is checking the checkbox (it's not). var defaultPrivacyValue = firstMenuItemKey; $('input[name=privacy]:checked').each(function() { defaultPrivacyValue = $(this).next().find('.name').text(); }); selectMenuItem(defaultPrivacyValue); When I chaged the selector to 'input[name=privacy][checked=checked]' it worked as expected. Is this a defect in the jQuery implementation of DOM retrieval based on the ':checked' selector???? I'm using jQuery 1.4.2. Thanks for any help you can give.

    Read the article

  • MalformedURLException with file URI

    - by Paul Reiners
    While executing the following code: doc = builder.parse(file); where doc is an instance of org.w3c.dom.Document and builder is an instance of javax.xml.parsers.DocumentBuilder, I'm getting the following exception: Exception in thread "main" java.net.MalformedURLException: unknown protocol: c at java.net.URL.<init>(Unknown Source) at java.net.URL.<init>(Unknown Source) at java.net.URL.<init>(Unknown Source) at com.sun.org.apache.xerces.internal.impl.XMLEntityManager.setupCurrentEntity(Unknown Source) at com.sun.org.apache.xerces.internal.impl.XMLEntityManager.startEntity(Unknown Source) at com.sun.org.apache.xerces.internal.impl.XMLEntityManager.startDTDEntity(Unknown Source) at com.sun.org.apache.xerces.internal.impl.XMLDTDScannerImpl.setInputSource(Unknown Source) at com.sun.org.apache.xerces.internal.impl.XMLDocumentScannerImpl$DTDDriver.dispatch(Unknown Source) at com.sun.org.apache.xerces.internal.impl.XMLDocumentScannerImpl$DTDDriver.next(Unknown Source) at com.sun.org.apache.xerces.internal.impl.XMLDocumentScannerImpl$PrologDriver.next(Unknown Source) at com.sun.org.apache.xerces.internal.impl.XMLDocumentScannerImpl.next(Unknown Source) at com.sun.org.apache.xerces.internal.impl.XMLDocumentFragmentScannerImpl.scanDocument(Unknown Source) at com.sun.org.apache.xerces.internal.parsers.XML11Configuration.parse(Unknown Source) at com.sun.org.apache.xerces.internal.parsers.XML11Configuration.parse(Unknown Source) at com.sun.org.apache.xerces.internal.parsers.XMLParser.parse(Unknown Source) at com.sun.org.apache.xerces.internal.parsers.DOMParser.parse(Unknown Source) at com.sun.org.apache.xerces.internal.jaxp.DocumentBuilderImpl.parse(Unknown Source) at javax.xml.parsers.DocumentBuilder.parse(Unknown Source) at com.acme.ItemToThetaValues.createFiles(ItemToThetaValues.java:47) It's choking on this line of the file: <!DOCTYPE questestinterop SYSTEM "C:\Program Files\Acme\parsers\acme_full.dtd"> I am not getting this error on my machine, while a user is getting it on his machine. We are both using version 6 of the Sun JRE. This error also occurs when he's uses double backslashes in the path instead of single backslashes and when he uses forward slashes instead of backslashes. First of all, is the XML correct? Is the path expressed correctly? Second of all, why is this error occurring on one computer but not on another?

    Read the article

  • Extract title tags from normal text

    - by pravin
    I am working on one task, to extract title tag from given normal text ( it's not a HTML DOM ). I have below cases where need to extract title tag(s) : Case 1 : <html> <head> <title>Title of the document</title> </head> <body> The content of the document...... </body> </html> Expected : Title of the document Case 2 : <html> <head> <title>Title of the document</title> <title>Continuing title</title> </head> <body> The content of the document...... </body> </html> Expected : Title of the document Continuing title Case 3 (Nested title tags) <html> <head> <title>Title of the document <title>Continuing title</title></title> </head> <body> The content of the document...... </body> </html> Expected : Title of the document Continuing title I wanted to extract title tags using regular expression in javascript. Reg-ex should work for above case. Is anyone knows about this..please let me know... Thanks in Advance

    Read the article

  • Fullcalendar doesn't render color when using eventRender

    - by jaffa
    When I set-up fullCalendar and set eventRender function callback, I want to set the color of the event depending if LeadId is null or not. But this doesn't seem to work even though the documentation says so: http://arshaw.com/fullcalendar/docs/event_data/Event_Object/#color-options Is there any way to set the event color to change based on the data? calendar = $('#dayview').fullCalendar({ .... timeFormat: 'HH:mm', columnFormat: { agendaDay: 'dddd dd/MM/yyyy' }, eventClick: function (calEvent, jsEvent, view) { var leadUrl = "/Leads/" + calEvent.LeadId; window.location = leadUrl; }, eventRender: function (event, element) { if (event.LeadId != null) { event.eventColor = "#B22222"; event.eventBackColor = "#B22222"; } }, UPDATE: This is really strange. The event has all my properties returned for the event off the server. element is just the DOM element for the event. When I drag/move the event to somewhere else in the calendar, the event turns red, and if I inspect the event object it now has color set to Red. So the question is why isn't it applying on the 1st render, but on subsequent renders (i.e. after move) the colour gets applied?

    Read the article

  • generating and unmarshalling java classes while unmarshalling input contains a DTD

    - by Hans Westerbeek
    Hi, For a Spring-based project, I have the following situation to solve: I have XML files coming in whose contents I will have to parse at runtime. Those XML files come with a DTD reference. I need to generate the classes that the unmarshaller churns out using the right at build time, using the Maven2 plugin for the unmarshalling library of choice. This is also not very hard to do, once I have generated an XSD from the DTD. I want to use spring-oxm's UnMarshaller interface to do the unmarshalling at runtime. This I understand how to do. The xml files come in with a DTD reference, and all unmarshalling libraries out there want to do unmarshalling based on an XSD. Now, as described in the castor documentation, I can convert the DTD to an XSD and keep it on the classpath. However, when an actual XML file comes into the system it will still have that DTD reference at the top, and there's nothing I can really do about that (except for string replacing which feels hacky in this case). Will this cause the unmarshaller, like Castor to fail? Am I right in suspecting that this DTD reference will cause the unmarshalling to fail? Could I do pure DTD-based unmarshalling? Or can this somehow be prevented by providing detailed configuration to the unmarshaller? Until now, I have tried castor, xmlbeans and xstream. Which would fit my purposes best? Has anyone else been in this situation? Did you also end up just doing manual DOM or SAX parsing?

    Read the article

  • Using max-width = 100% and max-height = 100% on an image, calculate the display width/height

    - by NatalieMac
    I am creating a slideshow for images of various sizes to display centered vertically and horizontally within a canvas area. In my CSS, I set the width and height of the image to 100% so that each image would proportionally fill the canvas. I want the canvas to auto-size itself to fit within the viewer's screensize as the original size of the images is quite large (up to 800 pixels tall). I am using jQuery 1.4, and using the height of the image to calculate the top value for absolute positioning it to the middle of the canvas. I have tried using jQuery to get the .height(), innerHeight(), and outerHeight(), but it always gets the full size of the image. I extracted the DOM element from the jQuery object and tried using .width, .offsetWidth, and .clientWidth, but that too always seems to return the full size of the image. Firebug displays the correct dimensions, so I know there's some way of calculating the actual display height of the image, I just can't figure out what it is. How do you get the actual display height of an image if you've set max-height = 100%? I didn't want to have to calculate and set the height of each image in the js, but if I have to, I will. It just seems like I should be able to set the canvas size and have the images auto-adjust.

    Read the article

  • Poco library for c++, declare namespace for custom element

    - by Mikhail
    I want to create an XML document by building a DOM document from scratch, with syntax like: AutoPtr<Document> doc = new Document; AutoPtr<Element> root = doc->createElement("root"); doc->appendChild(root); AutoPtr<Element> element1 = doc->createElementNS("http://ns1", "ns1:element1"); root->appendChild(element1); AutoPtr<Element> element2 = doc->createElementNS("http://ns1", "ns1:element2"); root->appendChild(element2); DOMWriter writer; writer.setNewLine("\n"); writer.setOptions(XMLWriter::PRETTY_PRINT); writer.writeNode(std::cout, doc); But, when I write it, I get next result: <root> <ns1:element1 xmlns:ns1="http://ns1"/> <ns1:element2 xmlns:ns1="http://ns1"/> </root> So namespace ns1 declared two times, and I want to declare it inside "root" element. Is there way to get next representation: <root xmlns:ns1="http://ns1"/> <ns1:element1/> <ns1:element2/> </root>

    Read the article

  • document.write Not working when loading external Javascript source

    - by jadent
    I'm trying to load an external JavaScript file dynamically into an HTML element to preview an ad tag. The script loads and executes but the script contains "document.write" which has an issue executing properly but there are no errors. <html> <head> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> <script type="text/javascript"> $(function() { source = 'http://ib.adnxs.com/ttj?id=555281'; // DOM Insert Approach // ----------------------------------- var script = document.createElement('script'); script.setAttribute('type', 'text/javascript'); script.setAttribute('src', source); document.body.appendChild(script); }); </script> </head> <body> </body> </html> I can get it to work if If i move the the source to the same domain for testing If the script was modified to use document.createElement and appendChild instead of document.write like the code above. I don't have the ability to modify the script since it being generated and hosted by a 3rd party. Does anyone know why the document.write will not work correctly? And is there a way to get around this? Thanks for the help!

    Read the article

  • Using KnockoutJs templates with jQuery

    - by balteo
    I would like to end up with the following HTML in the DOM using jQuery and KnockoutJs templates: <div class="messageToAndFromOtherMember" id="13"> <span>the message</span> <span>2012-12-02 14:05:45.0</span> </div> I have started writing my KO template as follows: <div class="messageToAndFromOtherMember" data-bind="attr:{ id: messageId}"> <span data-bind="text: message"></span> <span data-bind="text: sendDateFmted"></span> </div> Upon a successful ajax request, the following js is executed: var messageViewModel = { message: response.message, sendDateFmted: response.sendDateFmted, messageId: response.messageId }; ko.applyBindings(messageViewModel); Now I am not sure how and where to actually do the binding: since my message does not exist before the ajax request is complete and I can have as several messages... Can anyone please suggest a solution? EDIT: I have added this to the html page: <div data-bind="template: { name: 'message-template', data: messageViewModel }"></div> I now get the following js error: Uncaught Error: Unable to parse bindings. Message: ReferenceError: $messageViewModel is not defined; Bindings value: template: { name: 'message-template', data: messageViewModel }

    Read the article

  • Best method to select an object from another unknown jQuery object

    - by Yosi
    Lets say I have a jQuery object/collection stored in a variable named obj, which should contain a DOM element with an id named target. I don't know in advance if target will be a child in obj, i.e.: obj = $('<div id="parent"><div id="target"></div></div>'); or if obj equals target, i.e.: obj = $('<div id="target"></div>'); or if target is a top-level element inside obj, i.e.: obj = $('<div id="target"/><span id="other"/>'); I need a way to select target from obj, but I don't know in advance when to use .find and when to use .filter. What would be the fastest and/or most concise method of extracting target from obj? What I've come up with is: var $target = obj.find("#target").add(obj.filter("#target")); UPDATE I'm adding solutions to a JSPERF test page to see which one is the best. Currently my solution is still the fastest. Here is the link, please run the tests so that we'll have more data: http://jsperf.com/jquery-selecting-objects

    Read the article

  • Ajax heavy JS apps using excessive amounts of memory over time.

    - by Shane Reustle
    I seem to have some pretty large memory leaks in an app that I am working on. The app itself is not very complex. Every 15 seconds, the page requests approx 40kb of JSON from the server, and draws a table on the page using it. It is cheaper to draw the table over because the data is usually always new. I am attaching a few events to the table, approx 5 per line, 30 lines in the table. I used jQuery's .html() method to put the new html into the container and overwrite the existing. I do this specifically so that jQuery's special cleanup functions go in and attempt to detach all events on the elements in the element that it is overwriting. I then also delete the large variables of html once they are sent to the DOM using delete my_var. I have checked for circular references and attached events that are never cleared a few times, but never REALLY dug into it. I was wondering if someone could give me a few pointers on how to optimize a very heavy app like this. I just picked up "High Performance Javascript" by Nicholas Zakas, but didn't have much time to get into it yet. To give an idea on how much memory this is using, after 4~ hours, it is using about 420,000k on chrome, and much more on Firefox or IE. Thanks!

    Read the article

  • How can I move TinyMCE's toolbar into a modal popup?

    - by Nate Wagar
    I'm using TinyMCE & jQuery and am having a problem moving TinyMCE's external toolbar to another location in the DOM. To further complicate things, there are multiple TinyMCE instances on the page. I only want the toolbar for the one that's currently being edited. Here's some sample code: $(textarea).tinymce({ setup: function(ed) {setupMCEToolbar(ed, componentID, displaySettingsPane)} ,script_url: '/clubs/data/shared/scripts/tiny_mce/tiny_mce.js' ,theme : "advanced" ,plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template" ,theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect" ,theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor" ,theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen" ,theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak" ,theme_advanced_toolbar_location : "external" ,theme_advanced_toolbar_align : "left" ,theme_advanced_statusbar_location : "bottom" ,theme_advanced_resizing : true }); var setupMCEToolbar = function (mce, componentID, displaySettingsPane) { mce.onClick.add(function(ed,e){ displaySettingsPane($('#' + componentID)); $('#' + componentID).fetch('.mceExternalToolbar').eq(0).appendTo('#settingsPaneContent'); }); } Basically, it seems as though the setupMCEToolbar function cannot track down the mceExternalToolbar to move it. Has anyone ever had success trying to do something like this? EDIT It's a Monday alright... it couldn't find the external toolbar because I was using children() instead of fetch(). There's still an issue in that: 1) Moving it is incredibly slow and 2) Once it moves, TinyMCE breaks. EDIT 2 A bit more clarification: The modal is draggable, thus making any purely-CSS workarounds a bit awkward...

    Read the article

  • What does the JS function 'postMessage()' do when called on an html object tag?

    - by Stephano
    I was recently searching for a way to call the print function on a PDF I was displaying in adobe air. I solved this problem with a little help from this fellow, and by calling postMessage on my PDF like so: //this is the HTML I use to view my PDF <object id="PDFObj" data="test.pdf" type="application/pdf"/> ... //this actionscript lives in my air app var pdfObj:Object = htmlLoader.window.document.getElementById("PDFObj"); pdfObj.postMessage([message]); I've tried this in JavaScript as well, just to be sure it wasn't adobe sneaking in and helping me out... var obj = document.getElementById("PDFObj"); obj.postMessage([message]); Works well in JavaScript and in ActionScript. I looked up what the MDC had to say about postMessage, but all I found was window.postMessage. Now, the code works like a charm, and postMessage magically sends my message to my PDF's embedded JavaScript. However, I'm still not sure how I'm doing this. I found adobe talking about this method, but not really explaining it: HTML-PDF communication basics JavaScript in an HTML page can send a message to JavaScript in PDF content by calling the postMessage() method of the DOM object representing the PDF content. Any ideas how this is accomplished?

    Read the article

  • Prevent default on a click within a JQuery tabs in Google Chrome.

    - by Sydney
    I would like to prevent the default behaviour of a click on a link. I tried the return false; also javascript:void(0); in the href attribute but it doesn’t seem to work. It works fine in Firefox, but not in Chrome and IE. I have a single tab that loads via AJAX the content which is a simple link. <script type="text/javascript"> $(function() { $("#tabs").tabs({ ajaxOptions: { error: function(xhr, status, index, anchor) { $(anchor.hash).html("Couldn't load this tab. We'll try to fix this as soon as possible. If this wouldn't be a demo."); }, success: function() { alert('hello'); $('#lk').click(function() { alert('Click Me'); return false; }); } }, load: function(event, ui) { $('a', ui.panel).click(function() { $(ui.panel).load(this.href); return false; }); } }); }); </script> <body> <div id="tabs"> <ul> <li><a href="linkChild.htm">Link</a></li> </ul> </div> </body> The content of linkChild.htm is <a href="javascript:void(0)" id="lk">Click Me</a> So basically when the tab content is loaded with success, a click event is attached to the link “lk”. When I click on the link, the alert is displayed but then link disappears. I check the HTML and the element is actually removed from the DOM.

    Read the article

  • jQuery: change content of <option> elements

    - by piquadrat
    I have a select widget with a couple of AJAX enhancements. <select id="authors"> <option value="1">Foo Bar</option> <option value="2" selected="selected">Bar Baz</option> </select> Now, if the selected option changes, I want to change the "content" ("Foo Bar" and "Bar Baz" in the example). How can I do that with jQuery? I tried the following, but obviously, it doesn't work. $('#authors').change(function(){ $('#authors option[selected=selected]').html('new content'); }); /edit: to clarify, the selector '#authors option[selected=selected]' works fine, it selects the correct option DOM element. But .html('new content') does nothing. 2nd edit: OK, this is embarassing. I tried my code in Chrome's JavaScript console, where it didn't have any effect. After jAndy clearly demonstrated that it works in jsFiddle, I tried it in the FireBug console, and there it works. Lesson learned :-)

    Read the article

  • In IE8, jquery-ui's dialog set the height of its contents to zero. How can I fix this?

    - by brahn
    I am using jquery UI's dialog widget to render a modal dialog in my web application. I do this by passing the ID of the desired DOM element into the following function: var setupDialog = function (eltId) { $("#" + eltId).dialog({ autoOpen: false, width: 610, minWidth: 610, height: 450, minHeight: 200, modal: true, resizable: false, draggable: false, }); }; Everything works just fine in Firefox, Safari, and Chrome. However, in IE 8 when the dialog is opened only the div.ui-dialog-titlebar is visible -- the div.ui-dialog-contents are not. The problem seems to be that while in the modern browsers, the div.ui-dialog-contents has a specific height set in its style, i.e. after opening the dialog, the resulting HTML is: <div class="ui-dialog-content ui-widget-content" id="invite-friends-dialog" style="width: auto; min-height: 198px; height: 448px">...</div> while in IE8 the height style attribute is set to zero, and the resulting HTML is: <div class="ui-dialog-content ui-widget-content" id="invite-friends-dialog" style="min-height: 0px; width: auto; height: 0px">...</div> What do I need to do to get the height (and min-height) style attributes set correctly?

    Read the article

  • Attaching event on the fly with prototype

    - by andreas
    Hi, I've been scratching my head over this for an hour... I have a list of todo which has done button on each item. Every time a user clicks on that, it's supposed to do an Ajax call to the server, calling the marking function then updates the whole list. The problem I'm facing is that the new list has done buttons as well on each item. And it doesn't attach the click event anymore after first update. How do you attach an event handler on newly updated element with prototype? Note: I've passed evalScripts: true to the updater wrapper initial event handler attach <script type="text/javascript"> document.observe('dom:loaded', function() { $$('.todo-done a').each(function(a) { $(a).observe('click', function(e) { var todoId = $(this).readAttribute('href').substr(1); new Ajax.Updater('todo-list', $.utils.getPath('/todos/ajax_mark/done'), { onComplete: function() { $.utils.updateList({evalScripts: true}); } }); }); }) }); </script> updateList: <script type="text/javascript"> var Utils = Class.create({ updateList: function(options) { if(typeof options == 'undefined') { options = {}; } new Ajax.Updater('todo-list', $.utils.getPath('/todos/ajax_get'), $H(options).merge({ onComplete: function() { $first = $('todo-list').down(); $first.hide(); Effect.Appear($first, {duration: 0.7}); new Effect.Pulsate($('todo-list').down(), {pulses: 1, duration: 0.4, queue: 'end'}); } }) ); } }) $.utils = new Utils('globals'); </script> any help is very much appreciated, thank you :)

    Read the article

  • Creating ODT and PDF files as end result

    - by Bill Zimmerman
    Hello, I've been working on an app to create various document formats for a while now, and I've had limited success. Ideally, I'd like to dynamically create a fairly simple ODT/PDF/DOC file. I've been focusing my efforts on ODT, because it is editable, and open enough that there are several tools which will convert it to any of the other formats I need. The problem is that the ODT XML files are NOT simple, and there aren't any good-quality API's I could find (especially in python). So far, I've had the most success creating a template ODT file, and then manipulating the DOM in python as needed. This is ok generally, but is quickly becoming inadequate and requires too much tweaking every single time I need to alter one of the templates. The requirements are: 1) Produce a simple document that will have lists, paragraphs, and the ability to draw simple graphics on the page (boxes, circles, etc...) 2) The ability to specify page size, and the different formats should generally print the exact same output when sent to a printer My questions: 1) Are there any other ways I can produce ODT/PDF/DOC files? 2) Would LaTeX be acceptable? I've never really used it, does anyone have experience converting LaTeX files into other formats? 3) Would it be possible to use HTML? There are a lot of converters online. Technically you can specify dimensions in mm/cm, etc..., but I am worried that the printed output will differ between browsers/converters.... Any other ideas?

    Read the article

  • javascript innerHTML without childNodes?

    - by John Doe
    hi all im having a firefox issue where i dont see the wood for the trees using ajax i get html source from a php script this html code contains a tag and within the tbody some more tr/td's now i want to append this tbody plaincode to an existing table. but there is one more condition: the table is part of a form and thus contains checkboxe's and drop down's. if i would use table.innerHTML += content; firefox reloads the table and reset's all elements within it which isnt very userfriendly as id like to have what i have is this // content equals transport.responseText from ajax request function appendToTable(content){ var wrapper = document.createElement('table'); wrapper.innerHTML = content; wrapper.setAttribute('id', 'wrappid'); wrapper.style.display = 'none'; document.body.appendChild(wrapper); // get the parsed element - well it should be wrapper = document.getElementById('wrappid'); // the destination table table = document.getElementById('tableid'); // firebug prints a table element - seems right console.log(wrapper); // firebug prints the content ive inserted - seems right console.log(wrapper.innerHTML); var i = 0; // childNodes is iterated 2 times, both are textnode's // the second one seems to be a simple '\n' for(i=0;i<wrapper.childNodes.length;i++){ // firebug prints 'undefined' - wth!?? console.log(wrapper.childNodes[i].innerHTML); // firebug prints a textnode element - <TextNode textContent=" "> console.log(wrapper.childNodes[i]); table.appendChild(wrapper.childNodes[i]); } // WEIRD: firebug has no problems showing the 'wrappid' table and its contents in the html view - which seems there are the elements i want and not textelements } either this is so trivial that i dont see the problem OR its a corner case and i hope someone here has that much of expirience to give an advice on this - anyone can imagine why i get textnodes and not the finally parsed dom elements i expect? btw: btw i cant give a full example cause i cant write a smaller non working piece of code its one of those bugs that occure in the wild and not in my testset thx all

    Read the article

  • Attention JavaScript gurus: Need a hand with setInterval()

    - by alex
    I am trying to make a non interactive display for a real estate shop window. It's been a while since I've played with setInterval(). The first time my script steps through, it is fine. But when it tries to get the next property via getNextProperty(), it starts to go haywire. If you have Firebug, or an equivalent output of console.log(), you'll see it is calling things it shouldn't! Now there is a fair bit of JavaScript, so I'll feel better linking to it than posting it all. Store Display Offending JavaScript It is worth mentioning all my DOM/AJAX is done with jQuery. I've tried as best to make sure clearInterval() is working, and it seems to not run any code below it. The setInterval() is used to preload the next image, and then display it in the gallery. When the interval detects we are at the last image ((nextListItem.length === 0)), it is meant to clear that interval and start over with a new property. It has been driving me nuts for a while now, so anyone able to help me? It is probably something really obvious! Many thanks!

    Read the article

  • CSS Layout-- Make table cell contents appear in row below and set height of parent row/cell

    - by Laramie
    I am modifying a skin for the CKEdit component so that the toolbar is hidden unless clicked. To do so, I moved the toolbar collapser to the row below it using position: relative and top:18px. My goal is to have the parent tr of the anchor element a height of 2px, but keep the anchor at 11px. Is this possible? I cannot alter the DOM, just the styles. Here's my reduced code <style type="text/css"> table { width: 80px;} td { border: solid 1px #ccc; } .header { background-color: #99f; /* This is being ignored */ height:2px; } .below { float: right; position: relative; top: 18px; /*If I shrink, the BG image goes Away*/ height: 11px; width: 11px; background-image: url('http://ckeditor.com/apps/ckeditor/3.3/skins/kama/images/sprites.png'); background-position: 4px -1387px; border: 1px outset #D3D3D3; } .hidden { display:none; } </style> <table> <tr><td class="header"><a class="below"><span class="hidden">#</span></a></td></tr> <tr><td>next row</td></tr> </table>

    Read the article

  • Loading default value in a dropdown and calling onchange event

    - by J. Davidson
    Hi i have following dropdown <div class="fcolumn"> <label class="text" for="o_Id">Months:</label> <select class="textMonths" id="o_Id" name="periodName" > <option value="000">Select Period--</option> </select> </div> In the following jquery, first it loads fnLoadP() in a drop down list. Than as a default I am loading one of the values in drop down which is '10'. It loads too as default value. But it should be executing $("#o_Id").change.. which it doesn't. $(document).ready(function () { var sProfileUserId = null; $("#o_Id").change(function () { //---- }); fnLoadP(); $("select[name='pName']").val('10'); }); }); Basically my goal is. After dropdown values are loaded, to load '10' as default value and call onchange event in the dom. Please let me know how to fix it.

    Read the article

  • Use of 'this keyword' javascript in IE ?

    - by Ron
    Is there a workaround for Internet Explorer to implement the functionality offered by 'this' javascript keyword to get the dom element that triggered the event? My problem scenario is : I have a variable number of text fields in the html form, like input type="text" id="11" input type="text" id="12" .. I need to handle the "onchange" event for each text field, and the handling is dependent on the 'id' of the field that triggered the event. So far I understand that my options are: 1) attach a dedicated event handler for each text field. so if I have n fields, i have n different functions, something like: input type="text" id="11" onchange="function11();" input type="text" id="12" onchange="function12();" but the text fields are added and removed dynamically, so a better way would be to have one generic function instead. 2) use the 'this' keyword like: input type="text" id="11" onchange="functionGeneric(this);" input type="text" id="12" onchange="functionGeneric(this);" But this option does not work with Internet Explorer. Can anyone suggest a work around for getting it work in IE or some other solution that can be applied here? Thanks.

    Read the article

  • jquery: How to completely remove a dialog on close

    - by Svish
    When an ajax operation fails, I create a new div with the errors and then show it as a dialog. When the dialog is closed I would like to completely destroy and remove the div again. How can I do this? My code looks something like this at the moment: $('<div>We failed</div>') .dialog( { title: 'Error', close: function(event, ui) { $(this).destroy().remove(); } }); When I run this the dialog box shows up correctly, but when I close it the dialog is still visible in the html (using FireBug). What am I missing here? Something I have forgotten? Update: Just noticed my code gives me an error in the firebug console. $(this).destroy is not a function Anyone able to help me out? Update: If I do just $(this).remove() instead, the item is removed from the html. But is it completely removed from the DOM? Or do I somehow need to call that destroy function first as well?

    Read the article

  • Dynamic select menu Rails, Javascript HABTM

    - by Jack
    Hi, I am following a tutorial in one of Ryan Bates' Railscasts here. Basically I want a form where there are 2 drop down menus, the contents of one are dependent on the other. I have Years and Courses, where Years HABMT Courses and Courses HABTM Years. In the tutorial, the javascript is as follows: var states = new Array(); <% for state in @states -%> states.push(new Array(<%= state.country_id %>, '<%=h state.name %>', <%= state.id %>)); <% end -%> function countrySelected() { country_id = $('person_country_id').getValue(); options = $('person_state_id').options; options.length = 1; states.each(function(state) { if (state[0] == country_id) { options[options.length] = new Option(state[1], state[2]); } }); if (options.length == 1) { $('state_field').hide(); } else { $('state_field').show(); } } document.observe('dom:loaded', function() { countrySelected(); $('person_country_id').observe('change', countrySelected); }); Where I guess country has many states and state belongs to country. I think what I need to do is edit the first for statement to somehow loop through all of the courses for each year_id, but don't know how to do this. Any ideas? Thanks

    Read the article

< Previous Page | 128 129 130 131 132 133 134 135 136 137 138 139  | Next Page >