Search Results

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

Page 139/146 | < Previous Page | 135 136 137 138 139 140 141 142 143 144 145 146  | Next Page >

• Anyone willing to help out a javascript n00b? :-)

  - by Splynx

  Since I am asking for a lot, and know it, the following is a wall of text for those who might show some interest and want to know a little before offering their help to me. First a little about my level of programming skills, and a little about what I ask for. Where I'm at: I am not totally new to Javascript, and have dabbled a little with PHP earlier - well have dabbled a lot with PHP in fact, but never got good at it because I program alone. And I have until now never used forums to get help etc. other that searching to see if anyone else had my problem before and what the solution was. So I am not a intuitive or talented programmer, I'm more of a very maticulate programmer and you would be surprised how far you can get with if else... (ok that's a joke hehe). My solutions are usually (I am guessing here) not the best ones - and slow I take it, and the code is usually too long and I have to look up most of the stuff I use (really a lot of it is not done in "freehand"). I have a LOT of experience with HTML and CSS, and have always done well formed markup, as well as I am really into x-browsing and always require that my work validates when it's done. I also worry about optimizing a lot, and work with sprites for images, minimize the number of http requests etc, using H1,H2 etc. where it is logically correct, as well as use the correct elements and not just div span or p it... So because I am a workhorse and very maticulate I can actually pull off some quite "advanced" features, but it's always the basics that bite me in the end. Not fully understanding the syntax and so on usually gives me problems. Have recently discovered jQuery - wich is a lot of fun.... But I want to use it for the DOM node manipulation/handling only. As I mentioned I worry about optimizing, and jQuery used for everything seems... well not optimal, it strikes me as doing it yourself when possible is faster than accesing another script that may take a whole lot of other considerations into perspective when handling your variables and objects (and I am just guessing here since I as explained know nothing). So thats where I'm at... As mentioned I just started with javascript for "real" so I do not have much to show, but at the end of my WOT you can see two unfinisheded scripts I have made so you can see where I'm at roughly - just check out the URL without the /feedback.html for the second example (I am only allowed to post 1 link since I am also a SO n00b) (and for those rushing over to a validation service, remember I wrote "when it's done"...) What I ask for: I am figuring this... I have a piece of code I am working on at the moment, and this little project has taught me a whole lot already, and I have "grown" a lot as a javascript programmer. If I add a whole lot of comments to the script, and explain what it is intended to do, will you then show me where: I am writing incorrect code - making mistakes Where/how my code could be more optimal Where I am just simply being a muppet The code I want to use as the background for the tuition is the one here http://projects.1000monkeys.dk/feedback.html Use firebug and have a quick look see...

  Read the article

• RackSpace Cloud Strips $_SESSION if URL Has Certain File Extensions

  - by macinjosh

  The Situation I am creating a video training site for a client on the RackSpace Cloud using the traditional LAMP stack (RackSpace's cloud has both Windows and LAMP stacks). The videos and other media files I'm serving on this site need to be protected as my client charges money for access to them. There is no DRM or funny business like that, essentially we store the files outside of the web root and use PHP to authenticate user's before they are able to access the files by using mod_rewrite to run the request through PHP. So let's say the user requests a file at this URL: http://www.example.com/uploads/preview_image/29.jpg I am using mod_rewrite to rewrite that url to: http://www.example.com/files.php?path=%2Fuploads%2Fpreview_image%2F29.jpg Here is a simplified version of the files.php script: <?php // Setups the environment and sets $logged_in // This part requires $_SESSION require_once('../../includes/user_config.php'); if (!$logged_in) { // Redirect non-authenticated users header('Location: login.php'); } // This user is authenticated, continue $content_type = "image/jpeg"; // getAbsolutePathForRequestedResource() takes // a Query Parameter called path and uses DB // lookups and some string manipulation to get // an absolute path. This part doesn't have // any bearing on the problem at hand $file_path = getAbsolutePathForRequestedResource($_GET['path']); // At this point $file_path looks something like // this: "/path/to/a/place/outside/the/webroot" if (file_exists($file_path) && !is_dir($file_path)) { header("Content-Type: $content_type"); header('Content-Length: ' . filesize($file_path)); echo file_get_contents($file_path); } else { header('HTTP/1.0 404 Not Found'); header('Status: 404 Not Found'); echo '404 Not Found'; } exit(); ?> The Problem Let me start by saying this works perfectly for me. On local test machines it works like a charm. However once deployed to the cloud it stops working. After some debugging it turns out that if a request to the cloud has certain file extensions like .JPG, .PNG, or .SWF (i.e. extensions of typically static media files.) the request is routed to a cache system called Varnish. The end result of this routing is that by the time this whole process makes it to my PHP script the session is not present. If I change the extension in the URL to .PHP or if I even add a query parameter Varnish is bypassed and the PHP script can get the session. No problem right? I'll just add a meaningless query parameter to my requests! Here is the rub: The media files I am serving through this system are being requested through compiled SWF files that I have zero control over. They are generated by third-party software and I have no hope of adding or changing the URLs that they request. Are there any other options I have on this? Update: I should note that I have verified this behavior with RackSpace support and they have said there is nothing they can do about it.

  Read the article

• Need .Net method to compute a Google Pagerank request checksum.

  - by Steve K

  The company I work for is currently developing a SEO tool which needs to include a domain or url Pagerank. It is possible to retrieve such data directly from Google by sending a request to the url called by the Google ToolBar. On of the parameters send to that url is a checksum of the domain whose pagerank is being requested. I have found multiple .Net methods for calculating that check sum; however, every one randomly returns corrupt values every so often. I can only handle errors to a certain point before my final data set becomes useless. I know that there are countless tools out there, from browser plugins to desktop applications, that can process page rank, so it can't be impossible. My question, then, is two fold: 1) Any anyone heard of the problem I am having? (specifically in .Net) If so, how can it (or has it) be resolved? 2) Is there a better source for retrieving Pagerank data? Below is the Url and checksum code I have been using. "http://toolbarqueries.google.com/search?client=navclient-auto&ie=UTF-8&oe=UTF-8&features=Rank:&q=info:" & strUrl & "ch=" & strCheckSum where: strUrl = the url being queried strCheckSum = CheckHash(GetHash(url)) (see code below) Any help would be greatly appreciated. ''' <summary> ''' Returns a hash-string from the site's URL ''' </summary> ''' <param name="_SiteURL">full URL as indexed by Google</param> ''' <returns>HASH for site as a string</returns> Private Shared Function GetHash(ByVal _SiteURL As String) As String Try Dim _Check1 As Long = StrToNum(_SiteURL, 5381, 33) Dim _Check2 As Long = StrToNum(_SiteURL, 0, 65599) _Check1 >>= 2 _Check1 = ((_Check1 >> 4) And 67108800) Or (_Check1 And 63) _Check1 = ((_Check1 >> 4) And 4193280) Or (_Check1 And 1023) _Check1 = ((_Check1 >> 4) And 245760) Or (_Check1 And 16383) Dim T1 As Long = ((((_Check1 And 960) << 4) Or (_Check1 And 60)) << 2) Or (_Check2 And 3855) Dim T2 As Long = ((((_Check1 And 4294950912) << 4) Or (_Check1 And 15360)) << 10) Or (_Check2 And 252641280) Return Convert.ToString(T1 Or T2) Catch Return "0" End Try End Function ''' <summary> ''' Checks the HASH-string returned and adds check numbers as necessary ''' </summary> ''' <param name="_HashNum">generated HASH-string</param> ''' <returns>modified HASH-string</returns> Private Shared Function CheckHash(ByVal _HashNum As String) As String Try Dim _CheckByte As Long = 0 Dim _Flag As Long = 0 Dim _tempI As Long = Convert.ToInt64(_HashNum) If _tempI < 0 Then _tempI = _tempI * (-1) End If Dim _Hash As String = _tempI.ToString() Dim _Length As Integer = _Hash.Length For x As Integer = _Length - 1 To 0 Step -1 Dim _quick As Char = _Hash(x) Dim _Re As Long = Convert.ToInt64(_quick.ToString()) If 1 = (_Flag Mod 2) Then _Re += _Re _Re = CLng(((_Re \ 10) + (_Re Mod 10))) End If _CheckByte += _Re _Flag += 1 Next _CheckByte = _CheckByte Mod 10 If 0 <> _CheckByte Then _CheckByte = 10 - _CheckByte If 1 = (_Flag Mod 2) Then If 1 = (_CheckByte Mod 2) Then _CheckByte >>= 1 End If End If End If If _Hash.Length = 9 Then _CheckByte += 5 End If Return "7" + _CheckByte.ToString() + _Hash Catch Return "0" End Try End Function ''' <summary> ''' Converts the string (site URL) into numbers for the HASH ''' </summary> ''' <param name="_str">Site URL as passed by GetHash()</param> ''' <param name="_Chk">Necessary passed value</param> ''' <param name="_Magic">Necessary passed value</param> ''' <returns>Long Integer manipulation of string passed</returns> Private Shared Function StrToNum(ByVal _str As String, ByVal _Chk As Long, ByVal _Magic As Long) As Long Try Dim _Int64Unit As Long = Convert.ToInt64(Math.Pow(2, 32)) Dim _StrLen As Integer = _str.Length For x As Integer = 0 To _StrLen - 1 _Chk *= _Magic If _Chk >= _Int64Unit Then _Chk = (_Chk - (_Int64Unit * Convert.ToInt64(_Chk \ _Int64Unit))) _Chk = IIf((_Chk < -2147483648), (_Chk + _Int64Unit), _Chk) End If _Chk += CLng(Asc(_str(x))) Next Catch End Try Return _Chk End Function

  Read the article

• Java algorithm for normalizing audio

  - by Marty Pitt

  I'm trying to normalize an audio file of speech. Specifically, where an audio file contains peaks in volume, I'm trying to level it out, so the quiet sections are louder, and the peaks are quieter. I know very little about audio manipulation, beyond what I've learnt from working on this task. Also, my math is embarrassingly weak. I've done some research, and the Xuggle site provides a sample which shows reducing the volume using the following code: (full version here) @Override public void onAudioSamples(IAudioSamplesEvent event) { // get the raw audio byes and adjust it's value ShortBuffer buffer = event.getAudioSamples().getByteBuffer().asShortBuffer(); for (int i = 0; i < buffer.limit(); ++i) buffer.put(i, (short)(buffer.get(i) * mVolume)); super.onAudioSamples(event); } Here, they modify the bytes in getAudioSamples() by a constant of mVolume. Building on this approach, I've attempted a normalisation modifies the bytes in getAudioSamples() to a normalised value, considering the max/min in the file. (See below for details). I have a simple filter to leave "silence" alone (ie., anything below a value). I'm finding that the output file is very noisy (ie., the quality is seriously degraded). I assume that the error is either in my normalisation algorithim, or the way I manipulate the bytes. However, I'm unsure of where to go next. Here's an abridged version of what I'm currently doing. Step 1: Find peaks in file: Reads the full audio file, and finds this highest and lowest values of buffer.get() for all AudioSamples @Override public void onAudioSamples(IAudioSamplesEvent event) { IAudioSamples audioSamples = event.getAudioSamples(); ShortBuffer buffer = audioSamples.getByteBuffer().asShortBuffer(); short min = Short.MAX_VALUE; short max = Short.MIN_VALUE; for (int i = 0; i < buffer.limit(); ++i) { short value = buffer.get(i); min = (short) Math.min(min, value); max = (short) Math.max(max, value); } // assign of min/max ommitted for brevity. super.onAudioSamples(event); } Step 2: Normalize all values: In a loop similar to step1, replace the buffer with normalized values, calling: buffer.put(i, normalize(buffer.get(i)); public short normalize(short value) { if (isBackgroundNoise(value)) return value; short rawMin = // min from step1 short rawMax = // max from step1 short targetRangeMin = 1000; short targetRangeMax = 8000; int abs = Math.abs(value); double a = (abs - rawMin) * (targetRangeMax - targetRangeMin); double b = (rawMax - rawMin); double result = targetRangeMin + ( a/b ); // Copy the sign of value to result. result = Math.copySign(result,value); return (short) result; } Questions: Is this a valid approach for attempting to normalize an audio file? Is my math in normalize() valid? Why would this cause the file to become noisy, where a similar approach in the demo code doesn't?

  Read the article

• Servlet response wrapper has encoding problem

  - by John O

  A servlet response wrapper is being used in a Servlet Filter. The idea is that the response is manipulated, with a 'nonce' value being injected into forms, as part of defence against CSRF attacks. The web app is using UTF-8 everywhere. When the Servlet Filter is absent, no problems. When the filter is added, encoding issues occur. (It seems as if the response is reverting to 8859-1.) The guts of the code : final class CsrfResponseWrapper extends AbstractResponseWrapper { ... byte[] modifyResponse(byte[] aInputResponse){ ... String originalInput = new String(aInputResponse, encoding); String modifiedResult = addHiddenParamToPostedForms(originalInput); result = modifiedResult.getBytes(encoding); ... } ... } As I understand it, the transition between byte-land and String-land should specify an encoding. That is done here, as you can see, in two places. The value of the 'encoding' variable is 'UTF-8'; the alteration of the String itself is standard string manipulation (with a regex), and never specifies an encoding (addHiddenParamToPostedForms). Where am I in error about the encoding? EDIT: Here is the base class (sorry it's rather long): package hirondelle.web4j.security; import javax.servlet.ServletOutputStream; import javax.servlet.ServletResponse; import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpServletResponseWrapper; import java.io.ByteArrayOutputStream; import java.io.IOException; import java.io.PrintWriter; /** Abstract Base Class for altering response content. (May be useful in future contexts as well. For now, keep package-private.) */ abstract class AbstractResponseWrapper extends HttpServletResponseWrapper { AbstractResponseWrapper(ServletResponse aServletResponse) throws IOException { super((HttpServletResponse)aServletResponse); fOutputStream = new ModifiedOutputStream(aServletResponse.getOutputStream()); fWriter = new PrintWriter(fOutputStream); } /** Return the modified response. */ abstract byte[] modifyResponse(byte[] aInputResponse); /** Standard servlet method. */ public final ServletOutputStream getOutputStream() { //fLogger.fine("Modified Response : Getting output stream."); if ( fWriterReturned ) { throw new IllegalStateException(); } fOutputStreamReturned = true; return fOutputStream; } /** Standard servlet method. */ public final PrintWriter getWriter() { //fLogger.fine("Modified Response : Getting writer."); if ( fOutputStreamReturned ) { throw new IllegalStateException(); } fWriterReturned = true; return fWriter; } // PRIVATE /* Well-behaved servlets return either an OutputStream or a PrintWriter, but not both. */ private PrintWriter fWriter; private ModifiedOutputStream fOutputStream; /* These items are used to implement conformance to the javadoc for ServletResponse, regarding exceptions being thrown. */ private boolean fWriterReturned; private boolean fOutputStreamReturned; /** Modified low level output stream. */ private class ModifiedOutputStream extends ServletOutputStream { public ModifiedOutputStream(ServletOutputStream aOutputStream) { fServletOutputStream = aOutputStream; fBuffer = new ByteArrayOutputStream(); } /** Must be implemented to make this class concrete. */ public void write(int aByte) { fBuffer.write(aByte); } public void close() throws IOException { if ( !fIsClosed ){ processStream(); fServletOutputStream.close(); fIsClosed = true; } } public void flush() throws IOException { if ( fBuffer.size() != 0 ){ if ( !fIsClosed ) { processStream(); fBuffer = new ByteArrayOutputStream(); } } } /** Perform the core processing, by calling the abstract method. */ public void processStream() throws IOException { fServletOutputStream.write(modifyResponse(fBuffer.toByteArray())); fServletOutputStream.flush(); } // PRIVATE // private ServletOutputStream fServletOutputStream; private ByteArrayOutputStream fBuffer; /** Tracks if this stream has been closed. */ private boolean fIsClosed = false; } }

  Read the article

• Effective optimization strategies on modern C++ compilers

  - by user168715

  I'm working on scientific code that is very performance-critical. An initial version of the code has been written and tested, and now, with profiler in hand, it's time to start shaving cycles from the hot spots. It's well-known that some optimizations, e.g. loop unrolling, are handled these days much more effectively by the compiler than by a programmer meddling by hand. Which techniques are still worthwhile? Obviously, I'll run everything I try through a profiler, but if there's conventional wisdom as to what tends to work and what doesn't, it would save me significant time. I know that optimization is very compiler- and architecture- dependent. I'm using Intel's C++ compiler targeting the Core 2 Duo, but I'm also interested in what works well for gcc, or for "any modern compiler." Here are some concrete ideas I'm considering: Is there any benefit to replacing STL containers/algorithms with hand-rolled ones? In particular, my program includes a very large priority queue (currently a std::priority_queue) whose manipulation is taking a lot of total time. Is this something worth looking into, or is the STL implementation already likely the fastest possible? Along similar lines, for std::vectors whose needed sizes are unknown but have a reasonably small upper bound, is it profitable to replace them with statically-allocated arrays? I've found that dynamic memory allocation is often a severe bottleneck, and that eliminating it can lead to significant speedups. As a consequence I'm interesting in the performance tradeoffs of returning large temporary data structures by value vs. returning by pointer vs. passing the result in by reference. Is there a way to reliably determine whether or not the compiler will use RVO for a given method (assuming the caller doesn't need to modify the result, of course)? How cache-aware do compilers tend to be? For example, is it worth looking into reordering nested loops? Given the scientific nature of the program, floating-point numbers are used everywhere. A significant bottleneck in my code used to be conversions from floating point to integers: the compiler would emit code to save the current rounding mode, change it, perform the conversion, then restore the old rounding mode --- even though nothing in the program ever changed the rounding mode! Disabling this behavior significantly sped up my code. Are there any similar floating-point-related gotchas I should be aware of? One consequence of C++ being compiled and linked separately is that the compiler is unable to do what would seem to be very simple optimizations, such as move method calls like strlen() out of the termination conditions of loop. Are there any optimization like this one that I should look out for because they can't be done by the compiler and must be done by hand? On the flip side, are there any techniques I should avoid because they are likely to interfere with the compiler's ability to automatically optimize code? Lastly, to nip certain kinds of answers in the bud: I understand that optimization has a cost in terms of complexity, reliability, and maintainability. For this particular application, increased performance is worth these costs. I understand that the best optimizations are often to improve the high-level algorithms, and this has already been done.

  Read the article

• Function for counting characters/words not working

  - by user1742729

  <!DOCTYPE HTML> <html> <head> <title> Javascript - stuff </title> <script type="text/javascript"> <!-- function GetCountsAll( Wordcount, Sentancecount, Clausecount, Charactercount ) { var TextString = document.getElementById("Text").innerHTML; var Wordcount = 0; var Sentancecount = 0; var Clausecount = 0; var Charactercount = 0; // For loop that runs through all characters incrementing the variable(s) value each iteration for (i=0; i < TextString.length; i++); if (TextString.charAt(i) == " " = true) Wordcount++; return Wordcount; if (TextString.charAt(i) = "." = true) Sentancecount++; Clausecount++; return Sentancecount; if (TextString.charAt(i) = ";" = true) Clausecount++; return Clausecount; } --> </script> </head> <body> <div id="Text"> It is important to remember that XHTML is a markup language; it is not a programming language. The language only describes the placement and visual appearance of elements arranged on a page; it does not permit users to manipulate these elements to change their placement or appearance, or to perform any "processing" on the text or graphics to change their content in response to user needs. For many Web pages this lack of processing capability is not a great drawback; the pages are simply displays of static, unchanging, information for which no manipulation by the user is required. Still, there are cases where the ability to respond to user actions and the availability of processing methods can be a great asset. This is where JavaScript enters the picture. </div> <input type = "button" value = "Get Counts" class = "btnstyle" onclick = "GetCountsAll()"/> <br/> <span id= "Charactercount"> </span> Characters <br/> <span id= "Wordcount"> </span> Words <br/> <span id= "Sentancecount"> </span> Sentences <br/> <span id= "ClauseCount"> </span> Clauses <br/> </body> </html> I am a student and still learning JavaScript, so excuse any horrible mistakes. The script is meant to calculate the number of characters, words, sentences, and clauses in the passage. It's, plainly put, just not working. I have tried a multitude of things to get it to work for me and have gotten a plethora of different errors but no matter what I can NOT get this to work. Please help! (btw i know i misspelled sentence)

  Read the article

• C# WebBrowser control not applying css

  - by JamesL

  I have a project that I am working on in VS2005. I have added a WebBrowser control. I add a basic empty page to the control private const string _basicHtmlForm = "<html> " + "<head> " + "<meta http-equiv='Content-Type' content='text/html; charset=utf-8'/> " + "<title>Test document</title> " + "<script type='text/javascript'> " + "function ShowAlert(message) { " + " alert(message); " + "} " + "</script> " + "</head> " + "<body><div id='mainDiv'> " + "</div></body> " + "</html> "; private string _defaultFont = "font-family: Arial; font-size:10pt;"; private void LoadWebForm() { try { _webBrowser.DocumentText = _basicHtmlForm; } catch(Exception ex) { MessageBox.Show(ex.Message); } } and then add various elements via the dom (using _webBrowser.Document.CreateElement). I am also loading a css file: private void AddStyles() { try { mshtml.HTMLDocument currentDocument = (mshtml.HTMLDocument) _webBrowser.Document.DomDocument; mshtml.IHTMLStyleSheet styleSheet = currentDocument.createStyleSheet("", 0); TextReader reader = new StreamReader(Path.Combine(Path.GetDirectoryName(Application.ExecutablePath),"basic.css")); string style = reader.ReadToEnd(); styleSheet.cssText = style; } catch(Exception ex) { MessageBox.Show(ex.Message); } } Here is the css page contents: body { background-color: #DDDDDD; } .categoryDiv { background-color: #999999; } .categoryTable { width:599px; background-color:#BBBBBB; } #mainDiv { overflow:auto; width:600px; } The style page is loading successfully, but the only elements on the page that are being affected are the ones that are initially in the page (body and mainDiv). I have also tried including the css in a element in the header section, but it still only affects the elements that are there when the page is created. So my question is, does anyone have any idea on why the css is not being applied to elements that are created after the page is loaded? I have also tried no applying the css until after all of my elements are added, but the results don't change.

  Read the article

• How do I correctly Re-render a Recaptcha in ASP.NET MVC 2 after an AJAX POST

  - by Eoin Campbell

  Ok... I've downloaded and implemented this Recaptcha implementation for MVC which uses the ModelState to confirm the validity of the captcha control. It works brilliantly... except when I start to use it in an AJAX Form. In a nutshell, when a div is re-rendered with AJAX, the ReCaptcha that it should contain does not appear, even though the relevant <scripts> are in the source after the partial render. Code Below. using (Ajax.BeginForm("CreateComment", "Blog", new AjaxOptions() { HttpMethod = "POST", UpdateTargetId = "CommentAdd", OnComplete="ReloadRecaptcha", OnSuccess = "ShowComment", OnFailure = "ShowComment", OnBegin = "HideComment" })) {%> <fieldset class="comment"> <legend>Add New Comment</legend> <%= Html.ValidationSummary()%> <table class="postdetails"> <tbody> <tr> <td rowspan="3" id="blahCaptcha"> <%= Html.CreateRecaptcha("recaptcha", "blackglass") %> </td> .... Remainder of Form Omitted for Brevity I've confirmed the Form is perfectly functional when the Recaptcha Control is not present and the Javascript calls in the AjaxOptions are all working fine. The problem is that if the ModelState is Invalid as a result of the Recaptcha or some other validation, then the ActionResult returns the View to reshow the form. [RecaptchaFilter(IgnoreOnMobile = true)] [HttpPost] public ActionResult CreateComment(Comment c) { if (ModelState.IsValid) { try { //Code to insert Comment To DB return Content("Thank You"); } catch { ModelState.AddRuleViolations(c.GetRuleViolations()); } } else { ModelState.AddRuleViolations(c.GetRuleViolations()); } return View("CreateComment", c); } When it's InValid and the form posts back, for some reason the ReCaptcha Control does not re-render. I've checked the source and the <script> & <noscript> blocks are present in the HTML so the HTML Helper function below is obviously working <%= Html.CreateRecaptcha("recaptcha", "blackglass") %> I assume this has something to do with scripts injected into the DOM by AJAX are not re-executed. As you can see from the HTML snippet above, I've tried to add an OnComplete= javascript function to re-create the Captcha on the client side, but although the script executes with no errors, it doesn't work. OnComplete Function is. function ReloadRecaptcha() { Recaptcha.create("my-pub-key", 'blahCaptcha', { //blahCaptcha is the ID of the <td> where the ReCaptcha should go. theme: 'blackglass' }); } Can anyone shed any light on this ? Thanks, Eoin C

  Read the article

• How do I add a toolbar to a region with ExtJS

  - by gargantaun

  I have a border layout in ExtJS, The north region contains some HTML, but also needs to contain a toolbar like this... So i've managed to get the border layout set up, added the html to the North Region of the layout, but I can't find any workable examples of how to implement a tool bar. I have found lot's of examples of toolbars on their own, but I've not got the luxury or learning ExtJs thoroughly so it's all greek to me. I suspect there's a way to define a tool bar outside of the cumbersome JSON style flow of creating a layout and somehow attaching it to the region, and I'm hoping it's relativley simple to do. If someone can explain how I'd do this, it would really help. Here's the code so far... //make sure YOUR path is correct to this image!! Ext.BLANK_IMAGE_URL = '../../ext-2.0.2/resources/images/default/s.gif'; //this runs on DOM load - you can access all the good stuff now. Ext.onReady(function(){ var viewport = new Ext.Viewport({ layout: "border", border: false, renderTo: Ext.getBody(), items: [ // ------------------------------------------------------------------ { region: "north", id : "toolbar-area", xtype: 'panel', html: [ "<div id=\"html-header\">", "<div id=\"council-logo\"></div>", "<ul id=\"ancillary-menu\">", "<li><a href=\"#\">Logout</a></li>", "<li><a href=\"#\">Gazeteer Home</a></li>", "<li>Hello Rachel</li>", "</ul>", "<img id=\"inteligent-logo\" src=\"applied-images/logos/inteligent.gif\">", "</div>" ], /* ++++++++++++++++++++++++++++++++++++++++++++ */ /* The toolbar needs to go around here.... */ /* ++++++++++++++++++++++++++++++++++++++++++++ */ height: 100 }, // ------------------------------------------------------------------ // WEST // ------------------------------------------------------------------ { region: 'west', xtype: 'panel', split: true, resizeable: false, maxWidth : 350, minWidth : 349, collapsible: true, title: 'Gazetteer Explorer', width: 350, minSize: 150, // -------------------------------------------------------------- title: 'Nested Layout', layout: 'border', border: false, id: "west", items: [ { // *********************************************** // Search Form // *********************************************** region : "north", height: 300, split : true, id : "left-form-panel", items : [{ xtype : "form", id : "search-form", items : [ // Authority combo box // =============================== { xtype : "combo", fieldLabel : "Authority", name : "authority", hiddenName : "authority", id : "authority-combo" }, // =============================== // Search Fieldset // =============================== { xtype : "fieldset", autoHeight : true, title : "Search by...", id : "search-fieldset", items : [ // Ref Number text Box // %%%%%%%%%%%%%%%% { xtype : "textfield", name : "ref-number", fieldLabel : "Ref. Number", id : "ref-number-textfield" }, // %%%%%%%%%%%%%%%% // Streetname Combo // %%%%%%%%%%%%%%% { xtype : "combo", name : "street-name", hiddenName : "street-name", fieldLabel : "Street Name", id : "street-name-combo" }, // %%%%%%%%%%%%%%%% // Postcode Combo // %%%%%%%%%%%%%%%% { xtype : "combo", name : "postcode", hiddenName : "postcode", fieldLabel : "Postcode", id : "postcode-combo" }, // %%%%%%%%%%%%%%%% // Postcode Combo // %%%%%%%%%%%%%%%% { xtype : "combo", name : "town", hiddenName : "town", fieldLabel : "Town", id : "towm-combo" }, // %%%%%%%%%%%%%%%% // Postcode Combo // %%%%%%%%%%%%%%%% { xtype : "combo", name : "locality", hiddenName : "locality", fieldLabel : "Locality", id : "locality-combo" }, // %%%%%%%%%%%%%%% // Search Button // %%%%%%%%%%%%%%%% { xtype : "button", text : "Search", id : "search-button" }, // Reset Button // %%%%%%%%%%%%%%% { xtype : "button", text : "Reset", id : "reset-button" } ] }, // ======================= ] }] // ********************************************* }, { region: 'center', html: 'Tree view goes here' } ] }, // ------------------------------------------------------------------ { region: 'center', xtype: 'panel', // -------------------------------------------------------------- layout: 'border', border: false, items: [ { region: 'center', height: 200, split: true, html: 'Map goes here' }, { region: 'south', title: "Selection", split: true, height: 200, collapsible: true, html: 'Nested Center' } ] }, // ------------------------------------------------------------------ { region: 'east', }, // ------------------------------------------------------------------ { region: 'south', }] }); }); Sorry there's so much code, but ExtJS makes me scared to touch anything that's working.

  Read the article

• How to call function that inside JQuery Plugin From outside the plugin?

  - by CaTz

  hi, i am using textarea elastic plugin JQuery. this is the plugin (function(jQuery){ jQuery.fn.extend({ elastic: function() { // We will create a div clone of the textarea // by copying these attributes from the textarea to the div. var mimics = [ 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft', 'fontSize', 'lineHeight', 'fontFamily', 'width', 'fontWeight']; return this.each( function() { // Elastic only works on textareas if ( this.type != 'textarea' ) { return false; } var $textarea = jQuery(this), $twin = jQuery('<div />').css({'position': 'absolute','display':'none','word-wrap':'break-word'}), lineHeight = parseInt($textarea.css('line-height'),10) || parseInt($textarea.css('font-size'),'10'), minheight = parseInt($textarea.css('height'),10) || lineHeight*3, maxheight = parseInt($textarea.css('max-height'),10) || Number.MAX_VALUE, goalheight = 0, i = 0; // Opera returns max-height of -1 if not set if (maxheight < 0) { maxheight = Number.MAX_VALUE; } // Append the twin to the DOM // We are going to meassure the height of this, not the textarea. $twin.appendTo($textarea.parent()); // Copy the essential styles (mimics) from the textarea to the twin var i = mimics.length; while(i--){ $twin.css(mimics[i].toString(),$textarea.css(mimics[i].toString())); } // Sets a given height and overflow state on the textarea function setHeightAndOverflow(height, overflow){ curratedHeight = Math.floor(parseInt(height,10)); if($textarea.height() != curratedHeight){ $textarea.css({'height': curratedHeight + 'px','overflow':overflow}); } } // This function will update the height of the textarea if necessary function update() { // Get curated content from the textarea. var textareaContent = $textarea.val().replace(/&/g,'&amp;').replace(/ /g, '&nbsp;').replace(/<|>/g, '&gt;').replace(/\n/g, '<br />'); var twinContent = $twin.html(); if(textareaContent+'&nbsp;' != twinContent){ // Add an extra white space so new rows are added when you are at the end of a row. $twin.html(textareaContent+'&nbsp;'); // Change textarea height if twin plus the height of one line differs more than 3 pixel from textarea height if(Math.abs($twin.height()+lineHeight/3 - $textarea.height()) > 3){ var goalheight = $twin.height()+lineHeight/3; if(goalheight >= maxheight) { setHeightAndOverflow(maxheight,'auto'); } else if(goalheight <= minheight) { setHeightAndOverflow(minheight,'hidden'); } else { setHeightAndOverflow(goalheight,'hidden'); } } } } // Hide scrollbars $textarea.css({'overflow':'hidden'}); // Update textarea size on keyup $textarea.keyup(function(){ update(); }); $textarea.focus(function(){ update(); }); // And this line is to catch the browser paste event $textarea.live('input paste',function(e){ setTimeout( update, 250); }); // Run update once when elastic is initialized update(); }); } }); })(jQuery); How can i call from the outside of the plugin to the update function that is inside?

  Read the article

• Safari/Chrome problem with ajaxsubmit?

  - by Jan

  Hi I'm currently having some weird issues with ajaxsubmit (http://jquery.malsup.com/form/#ajaxSubmit), which I'm currently using in a project. I have a flow where I need to open a form into a modal window. I'm using fancybox for that and it works like a charm. When the form has been forced to open in the fancybox window there can happen two things. 1) If the user who is about to submit the form is logged in she should see a confirmation in the modal box, that her input was succesfully submitted 2)If the user is not logged in there should be loaded a login form once she hits the submit button 2.1) When the user has logged in she should receive a confirmation in the modal box. This is also working like a charm in Firefox, IE8 and IE7 but not in Safari or Chrome. The weird part is that it seems like safari and chrome are completely ignoring my ajaxsubmit form. To force the first form to be opened I use the follwoing script - this part is working in both Safari and Chrome. $(".klikEnPrisForm").ajaxForm({ success: function(data){ $.fancybox({'content':data}); } }); My ajaxsubmit form scrip looks like this var options = { url: '/?altTemplate=XmlProxyKlikEnPris', dataType: 'xml', data: $(this).serializeArray(), success: function(data) { if ($(data).find('loggetind').text() == 'true') { $("#klikenpris").hide(); $('<div id="fancybox-inner-klik"></div>').appendTo('#fancybox-inner'); $('#fancybox-inner-klik').load('/KlikEnPrisAccept?tilKvittering=1&sagsno=' + $(data).find('sagsnummer').text() + '&pris=' + $(data).find('pris').text() + '&klik-comment=' + $(data).find('kommentar').text() + '&klik-telefon=' + $(data).find('tlf').text() + '&klik-maeglerkontakt=' + $(data).find('maakontakte').text()).stop(true, true); } else { $("#klikenpris").hide(); $("#fancybox-wrap").css({ 'width': '480px', 'height': '220px' }); $("#fancybox-inner").css({ 'width': '460px', 'height': '220px' }); $('<div id="fancybox-inner-klik"></div>').appendTo('#fancybox-inner'); $('#fancybox-inner-klik').load('/login.aspx?loginklikpris=0&klikpris=1&sagsno=' + $(data).find('sagsnummer').text() + '&pris=' + $(data).find('pris').text() + '&klik-comment=' + $(data).find('kommentar').text() + '&klik-telefon=' + $(data).find('tlf').text() + '&klik-maeglerkontakt=' + $(data).find('maakontakte').text()).stop(true, true); } } }; // bind to the form's submit event $('#klikenprisform').submit(function() { // inside event callbacks 'this' is the DOM element so we first // wrap it in a jQuery object and then invoke ajaxSubmit $(this).ajaxSubmit(options); // !!! Important !!! // always return false to prevent standard browser submit and page navigation return false; }); I have tried inserting an alert in the succes callback function but it's never being called it seems. It seems like the default action is not being overruled by the link written in the "url" in ajaxsubmit. I'm really puzzled about this, since it's working nicely in other browsers and I'm completely lost on how I should approach the debugging in safari/chrome. I hope all the above makes sense and I'm looking forward to hear any suggestions. Cheers!

  Read the article

• jquery sortable item cached? #sortable items: '.class1' filter is not working when class is changed

  - by liz

  hello everyone, i came across a weird problem today: i created a sortable list of divs. each div has a class="class1" and items is set to 'class1' (see below simplified code). each div has an a href link that calls a function toggleLock. this function replaces class="class1" with class="locked" for that div. for example: will become the problem is: even though #sortable is set to "make" only items with class="class1" sortable, replacing the class still allows to be sortable. seems like item class is cached at some point. i've tried to refresh #sortable ($('#sortable').sortable("refreshPosition") and $('#sortable').sortable("");), but that didn't work. i've tried both ways of replacing the class: attr('class','lock') and removeClass(), then addClass(). still is sortable. if class is not changed dynamically, but loads into DOM as , then it's not sortable as expected. why wouldn't replacement of the class from class1 to locked prevent that div from being sortable? am i missing something? sample code: <div id="sortable"> <div class="class1" id="1"> <div class="sortHandle">....</div> <href="javascript:void(null);" onclick="toggleLock($(this).attr('id').replace('R',''));" id="R1">lock</a> <p>This is item 1</p> </div> <div class="class1" id="2"> <div class="sortHandle"></div> <href="javascript:void(null);" onclick="toggleLock($(this).attr('id').replace('R',''));" id="R2">lock</a> <p>This is item 2</p> </div> <div class="class1" id="3"> <div class="sortHandle"></div> <href="javascript:void(null);" onclick="toggleLock($(this).attr('id').replace('R',''));" id="R3">lock</a> <p>This is item 3</p> </div> </div> js: $(function() { $("#sortable").sortable({ items: '.class1', handle: '.sortHandle', cursor: 'move', start: function(e,ui) { el = e.target; startPos = ui.item.prevAll().length+1; }, update: function(event, ui) { data = $('.class1').sortable('toArray'); newPos = ui.item.prevAll().length+1; alert("position: "+startPos+"; newposition: "+newPos); } }).disableSelection(); });

  Read the article

• Merging two XML files into one XML file using Java

  - by dmurali

  I am stuck with how to proceed with combining two different XML files(which has the same structure). When I was doing some research on it, people say that XML parsers like DOM or StAX will have to be used. But cant I do it with the regular IOStream? I am currently trying to do with the help of IOStream but this is not solving my purpose, its being more complex. For example, What I have tried is; public class GUI { public static void main(String[] args) throws Exception { // Creates file to write to Writer output = null; output = new BufferedWriter(new FileWriter("C:\\merged.xml")); String newline = System.getProperty("line.separator"); output.write(""); // Read in xml file 1 FileInputStream in = new FileInputStream("C:\\1.xml"); BufferedReader br = new BufferedReader(new InputStreamReader(in)); String strLine; while ((strLine = br.readLine()) != null) { if (strLine.contains("<MemoryDump>")){ strLine = strLine.replace("<MemoryDump>", "xmlns:xsi"); } if (strLine.contains("</MemoryDump>")){ strLine = strLine.replace("</MemoryDump>", "xmlns:xsd"); } output.write(newline); output.write(strLine); System.out.println(strLine); } // Read in xml file 2 FileInputStream in = new FileInputStream("C:\\2.xml"); BufferedReader br1 = new BufferedReader(new InputStreamReader(in)); String strLine1; while ((strLine1 = br1.readLine()) != null) { if (strLine1.contains("<MemoryDump>")){ strLine1 = strLine1.replace("<MemoryDump>", ""); } if (strLine1.contains("</MemoryDump>")){ strLine1 = strLine1.replace("</MemoryDump>", ""); } output.write(newline); output.write(strLine1); I request you to kindly let me know how do I proceed with merging two XML files by adding additional content as well. It would be great if you could provide me some example links as well..! Thank You in Advance..! System.out.println(strLine1); } }

  Read the article

• How can I highlight empty fields in ASP.NET MVC 2 before model binding has occurred?

  - by Richard Poole

  I'm trying to highlight certain form fields (let's call them important fields) when they're empty. In essence, they should behave a bit like required fields, but they should be highlighted if they are empty when the user first GETs the form, before POST & model validation has occurred. The user can also ignore the warnings and submit the form when these fields are empty (i.e. empty important fields won't cause ModelState.IsValid to be false). Ideally it needs to work server-side (empty important fields are highlighted with warning message on GET) and client-side (highlighted if empty when losing focus). I've thought of a few ways of doing this, but I'm hoping some bright spark can come up with a nice elegant solution... Just use a CSS class to flag important fields Update every view/template to render important fields with an important CSS class. Write some jQuery to highlight empty important fields when the DOM is ready and hook their blur events so highlights & warning messages can be shown/hidden as appropriate. Pros: Quick and easy. Cons: Unnecessary duplication of importance flags and warning messages across views & templates. Clients with JavaScript disabled will never see highlights/warnings. Custom data annotation and client-side validator Create classes similar to RequiredAttribute, RequiredAttributeAdapter and ModelClientValidationRequiredRule, and register the adapter with DataAnnotationsModelValidatorProvider.RegisterAdapter. Create a client-side validator like this that responds to the blur event. Pros: Data annotation follows DRY principle (Html.ValidationMessageFor<T> picks up field importance and warning message from attribute, no duplication). Cons: Must call TryValidateModel from GET actions to ensure empty fields are decorated. Not technically validation (client- & server-side rules don't match) so it's at the mercy of framework changes. Clients with JavaScript disabled will never see highlights/warnings. Clone the entire validation framework It strikes me that I'm trying to achieve exactly the same thing as validation but with warnings rather than errors. It needs to run before model binding (and therefore validation) has occurred. Perhaps it's worth designing a similar framework with annotations like Required, RegularExpression, StringLength, etc. that somehow cause Html.TextBoxFor<T> etc. to render the warning CSS class and Html.ValidationMessageFor<T> to emit the warning message and JSON needed to enable client-side blur checks. Pros: Sounds like something MVC 2 could do with out of the box. Cons: Way too much effort for my current requirement! I'm swaying towards option 1. Can anyone think of a better solution?

  Read the article

• N2 CMS SlidingCurtain control is not visible

  - by Carl Raymond

  I just set up a new N2 site by starting with the MVC 2 Web Application template in Visual Studio, then following the directions in N2 CMS Developer Documentation in the section Integrating with Existing ASP.NET MVC Application. I have the basic site running now, but with one problem: the sliding curtain widget that holds the administrative controls is not visible in the upper right corner (when logged in, of course). I can make it visible the hard way by using Firebug to locate it in the DOM, and then disabling a couple of the CSS positioning elements. Once I do that, it seems to work normally. After I open it that way, I can click the various controls, or close it up (and I see the animation). But then it's off screen again. My master page has the sliding curtain just inside the <body> tag: <body> <n2:SlidingCurtain runat="server"> <n2:ControlPanel runat="server" /> </n2:SlidingCurtain> ... The site.css file generated in the base MVC site doesn't seem to do any positioning that would affect this. Firebug shows that right after by <body> tag, I have this: <div class="sc" id="SC" style="top: -2px; left: -574px;"><div class="scContent"> .... The style for <div class="sc" ...> is element.style { left:-574px; top:-2px; } .sc { background:#FFFFFF none repeat-x scroll 0 0; border-color:#CCCCBB; border-style:none solid solid none; border-width:1px; left:-200px; position:fixed; top:-200px; z-index:990; } If I disable both top: and both left: rules, the widget appears.

  Read the article

• Rails Multiple Checkboxes with Javascript Dynamic Select

  - by Jack

  Hi, I have followed the Railscast episode 88 to implement a set of dependant drop down menus. In the students-new view, when the student's year is selected, the javascript figures out which courses are available to that year and offers the selection in a new drop down menu. My javascript erb file is here: var courses = new Array(); <% for course in @courses -%> <%for year in course.years -%> courses.push(new Array(<%= year.year_id%>, '<%=h course.title%>', <%= course.id%>)); <%end -%> <% end -%> function yearSelected() { year_id = $('student_year_id').getValue(); options = $('student_course_ids').options; options.length = 1; courses.each(function(course) { if (course[0] == year_id) { options[options.length] = new Option(course[1], course[2]); } }); if (options.length == 1) { $('course_field').hide(); } else { $('course_field').show(); } } document.observe('dom:loaded', function() { yearSelected(); $('student_year_id').observe('change', yearSelected); }); Any my view is as follows: <% form_for(@student) do |f| %> <%= f.error_messages %> <p> <%= f.label :name %><br /> <%= f.text_field :name %> </p> <p> <%= f.label :cid, "CID" %><br /> <%= f.text_field :cid %> </p> <p> <label for="student_year_id">Year:</label> <%= collection_select(:student, :year_id, Year.all, :id, :title, {:prompt => true})%> </p> <p id="course_field"> <label for="student_course_ids">Course:</label> <%= collection_select(:student, :course_ids, Course.find(:all), :id, :title, {:prompt => true}, {:multiple => true})%> </p> <p> <%= f.submit 'Save' %> </p> <% end %> What I would like to do is to add checkboxes instead of the drop down menu. Any suggestions? I previously was using this method, but was not able to get it to work with the new javascript. Cheers

  Read the article

• JQGrid and JQuery Autocomplete

  - by Neff

  When implementing JQGrid 4.3.0, Jquery 1.6.2, and JQuery UI 1.8.16 Ive come across an issue with the Inline edit. When the inline edit is activated, some of the elements get assigned an auto complete. When the inline edit is canceld or saved, the auto complete does not always go away (selecting text by double clicking it then hitting delete, then hitting escape to exit row edit). Leaving the auto complete controls in edit mode when the row is no longer considered in edit mode. Perhaps you can tell me if there is a problem with the initialization or if I you are aware of an event post-"afterrestorefunc" that the fields can be returned to their "original" state. Original state being displayed as data in the JQGrid row. I've tried removing the DOM after row close, .remove() and .empty(): ... "afterrestorefunc": function(){ $('.ui-autocomplete-input').remove(); } ... but that causes other issues, such as the jqgrid is not able to find the cell when serializing the row for data or edit, and requires a refresh of the page, not just jqgrid, to be able to once again see the data from that row. Auto complete functionality for the element is created on the double click of the row: function CreateCustomSearchElement(value, options, selectiontype) { ... var el; el = document.createElement("input"); ... $(el).autocomplete({ source: function (request, response) { $.ajax({ url: '<%=ResolveUrl("~/Services/AutoCompleteService.asmx/GetAutoCompleteResponse") %>', data: "{ 'prefixText': '" + request.term + "', 'contextKey': '" + options.name + "'}", dataType: "json", type: "POST", contentType: "application/json; charset=utf-8", success: function (data) { response($.map(data.d, function (item) { return { label: Trim(item), value: Trim(item), searchVal: Trim(item) } })) } }); }, select: function (e, item) { //Select is on the event of selection where the value and label have already been determined. }, minLength: 1, change: function (event, ui) { //if the active element was not the search button //... } }).keyup(function (e) { if (e.keyCode == 8 || e.keyCode == 46) { //If the user hits backspace or delete, check the value of the textbox before setting the searchValue //... } }).keydown(function (e) { //if keycode is enter key and there is a value, you need to validate the data through select or change(onblur) if (e.keyCode == '13' && ($(el).val())) { return false; } if (e.keyCode == '220') { return false } }); } Other Sources: http://www.trirand.com/jqgridwiki/doku.php?id=wiki:inline_editing http://api.jqueryui.com/autocomplete/ Update: I tried only creating the autocomplete when the element was focused, and removing it when onblur. That did not resolve the issue either. It seems to just need the autocomplete dropdown to be triggered.

  Read the article

• Java object to XML Elements?

  - by DaveKub

  I'm working on a webservices client app and I have it mostly working. I can retrieve and read data from the third-party webservice fine. Now I need to submit some data and I'm stuck. The classes for the objects I'm retrieving/submitting were generated from XSD files via the xjc tool. The part I'm stuck on is turning one of those objects into an XML tree to submit to the webservice. When I retrieve/send a request from/to the ws, it contains a 'payload' object. This is defined in java code as (partial listing): @XmlAccessorType(XmlAccessType.FIELD) @XmlType(name = "PayloadType", propOrder = { "compressed", "document", "any", "format" }) public class PayloadType { @XmlElement(name = "Compressed") protected String compressed; @XmlElement(name = "Document") protected List<String> document; @XmlAnyElement protected List<Element> any; protected String format; public List<Element> getAny() { if (any == null) { any = new ArrayList<Element>(); } return this.any; } } The only field I'm concerned with is the 'any' field which contains an XML tree. When I retrieve data from the ws, I read that field with something like this: ('root' is of org.w3c.dom.Element type and is the result of calling 'getAny().get(0)' on the payload object) NodeList nl = root.getElementsByTagName("ns1:Process"); // "ns1:Process" is an XML node to do something with if (nl != null && nl.getLength() > 0) { for (int i = 0; i < nl.getLength(); i++) { Element proc = (Element) nl.item(i); try { // do something with the 'proc' Element here... } catch (Exception ex) { // handle problems here... } } } Submitting data is where I'm stuck. How do I take a java object created from one of the classes generated from XSD and turn it into an Element object that I can add to the 'any' List of the payload object?? For instance, if I have a DailyData class and I create and populate it with data: DailyData dData = new DailyData(); dData.setID = 34; dData.setValues = "3,5,76,23"; How do I add that 'dData' object to the 'any' List of the payload object? It has to be an Element. Do I do something with a JAXBContext marshaller? I've used that to dump the 'dData' object to the screen to check the XML structure. I'm sure the answer is staring me in the face but I just can't see it! Dave

  Read the article

• Are jQuery's :first and :eq(0) selectors functionally equivalent?

  - by travis

  I'm not sure whether to use :first or :eq(0) in a selector. I'm pretty sure that they'll always return the same object, but is one speedier than the other? I'm sure someone here must have benchmarked these selectors before and I'm not really sure the best way to test if one is faster. Update: here's the bench I ran: /* start bench */ for (var count = 0; count < 5; count++) { var i = 0, limit = 10000; var start, end; start = new Date(); for (i = 0; i < limit; i++) { var $radeditor = $thisFrame.parents("div.RadEditor.Telerik:eq(0)"); } end = new Date(); alert("div.RadEditor.Telerik:eq(0) : " + (end-start)); var start = new Date(); for (i = 0; i < limit; i++) { var $radeditor = $thisFrame.parents("div.RadEditor.Telerik:first"); } end = new Date(); alert("div.RadEditor.Telerik:first : " + (end-start)); start = new Date(); for (i = 0; i < limit; i++) { var radeditor = $thisFrame.parents("div.RadEditor.Telerik")[0]; } end = new Date(); alert("(div.RadEditor.Telerik)[0] : " + (end-start)); start = new Date(); for (i = 0; i < limit; i++) { var $radeditor = $($thisFrame.parents("div.RadEditor.Telerik")[0]); } end = new Date(); alert("$((div.RadEditor.Telerik)[0]) : " + (end-start)); } /* end bench */ I assumed that the 3rd would be the fastest and the 4th would be the slowest, but here's the results that I came up with: FF3: :eq(0) :first [0] $([0]) trial1 5275 4360 4107 3910 trial2 5175 5231 3916 4134 trial3 5317 5589 4670 4350 trial4 5754 4829 3988 4610 trial5 4771 6019 4669 4803 Average 5258.4 5205.6 4270 4361.4 IE6: :eq(0) :first [0] $([0]) trial1 13796 15733 12202 14014 trial2 14186 13905 12749 11546 trial3 12249 14281 13421 12109 trial4 14984 15015 11718 13421 trial5 16015 13187 11578 10984 Average 14246 14424.2 12333.6 12414.8 I was correct about just returning the first native DOM object being the fastest ([0]), but I can't believe the wrapping that object in the jQuery function was faster that both :first and :eq(0)! Unless I'm doing it wrong.

  Read the article

• Exclude one or more elements from being connected (using connectWith) in jQuery's sortable lists

  - by Lev

  I have two lists, one with an ID of "vlist" and one with an ID of "hlist". The "vlist" holds elements which should be visible, while the "hlist" holds items that should remain hidden. The idea here is to allow the administrator of the system to specify which elements/fields should be shown on a sign-up page, and which shouldn't. The two lists are connected using "connectWith", so the administrator can drag items from the visible list to the hidden list (or vice versa). My dilemma is that there are a few fields I want locked into the visible list, but still sortable within that one list. For example, the "username", "email" and "password" fields should be locked within the visible list (as they always need to be used for registration). Is this even possible? Perhaps it is a no-brainer that I simply haven't discovered yet. I've looked around through jQuery's documentation for a while and can't seem to find anything related to this scenario. I have found how you can "cancel" specific elements in the list from being sortable altogether or even disabled from being a dropable target, but this doesn't do it. The user should still have the ability to drag these items within the "visible" list, in case they want to adjust the ordering of the locked fields. I'm also aware that you can contain sortable elements within a specific element or DOM object, but this also can't be used as this only seems to apply to the whole sortable list, and not specific elements of that list. I've even tried to see if something like this would work after I built the sortable listing(s): $('#vlist > #slist-li-username').sortable('option', 'containment', '#vlist'); Obviously, that didn't work either or I wouldn't be posting this. In case it might help, I thought I'd throw in the code I'm using now; here is the jQuery code: $(function() { $('#vlist, #hlist').sortable ({ connectWith: '.signup-set_flist', forcePlaceholderSize: true, receive: function (event, ui) { var itemID = ui.item.attr('id'); var fID = itemID.replace(/slist-li-/g, ''); var hID = 'slist-' + fID; if (ui.sender.attr('id') == 'vlist') { $('#'+hID).val(''); } else { $('#'+hID).val(fID); } } }).disableSelection(); $('#vlist > #slist-li-username').sortable('option', 'containment', '#vlist'); }); And as for the HTML, I'll upload it to here (since StackOverflow seems to break when I paste it in here - even in code mode): http://sikosoft.net/jquery-sort-connect.html Any help would greatly be appreciated! :) Oh, and be gentle as this is my first question here. ;)

  Read the article

• Model-View-Controller in JavaScript

  - by Casey Hope

  tl;dr: How does one implement MVC in JavaScript in a clean way? I'm trying to implement MVC in JavaScript. I have googled and reorganized with my code countless times but have not found a suitable solution. (The code just doesn't "feel right".) Here's how I'm going about it right now. It's incredibly complicated and is a pain to work with (but still better than the pile of code I had before). It has ugly workarounds that sort of defeat the purpose of MVC. And behold, the mess, if you're really brave: // Create a "main model" var main = Model0(); function Model0() { // Create an associated view and store its methods in "view" var view = View0(); // Create a submodel and pass it a function // that will "subviewify" the submodel's view var model1 = Model1(function (subview) { view.subviewify(subview); }); // Return model methods that can be used by // the controller (the onchange handlers) return { 'updateModel1': function (newValue) { model1.update(newValue); } }; } function Model1(makeSubView) { var info = ''; // Make an associated view and attach the view // to the parent view using the passed function var view = View1(); makeSubView(view.__view); // Dirty dirty // Return model methods that can be used by // the parent model (and so the controller) return { 'update': function (newValue) { info = newValue; // Notify the view of the new information view.events.value(info); } }; } function View0() { var thing = document.getElementById('theDiv'); var input = document.getElementById('theInput'); // This is the "controller", bear with me input.onchange = function () { // Ugly, uses a global to contact the model main.updateModel1(this.value); }; return { 'events': {}, // Adds a subview to this view. 'subviewify': function (subview) { thing.appendChild(subview); } }; } // This is a subview. function View1() { var element = document.createElement('div'); return { 'events': { // When the value changes this is // called so the view can be updated 'value': function (newValue) { element.innerHTML = newValue; } }, // ..Expose the DOM representation of the subview // so it can be attached to a parent view '__view': element }; } How does one implement MVC in JavaScript in a cleaner way? How can I improve this system? Or is this the completely wrong way to go, should I follow another pattern?

  Read the article

• Ajax problem not displaying data using multiple javascript calls...

  - by Ronedog

  I'm writing an app that uses ajax to retrieve data from a mysql db using php. Because of the nature of the app, the user clicks an href link that has an "onclick" event used to call the javascript/ajax. I'm retrieving the data from mysql, then calling a separate php function which creates a small html table with the necessary data in it. The new table gets passed back to the responseText and is displayed inside a div tag. The tables only have around 10-20 rows of data in them. This functionality is working fine and displays the data in html form exactly as it needs to be on the page. The problem is this. the HREF "onclick" event needs to run multiple scripts one right after the other. The first script updates the "existing" data and inside the "update_existing" function is a call to refresh a section of the page with the updated HTML from the responseText. Then when that is done a "display_html" function is called which also updates a different section of the page with it's newly created HTML table. The event looks like this: Update This string gets built dynamically using php with parameters supplied, but for this example I simply took the parameters out so it didn't get confusing. The "update_existion() function actually calls the display_html() function which updates a section of the page as needed. I need to update a different section of the page on the same click of the mouse right after the update, which is why I'm calling the display_html() again, right after it. The problem is only the last call is being updated on my screen. In other words, the 2nd function call "display_html()" executes and displays the refreshed data just fine, but the previous call to update_existing() runs and updates the database properly, but doesn't display on the screen unless I press the browsers "refresh" button, which of course displays the new data exactly how I want it to, but I don't want the users to have to press the "refresh" button. I tried adding multiple "display_html() calls one right after the other, separating all of them with the semicolon and learned that only the very last function call actually refreshed the div element on the html page with the table information, although all the previous display_html() calls worked, they couldn't be seen on the page without a refresh of the browser. Is this a problem with javascript, or the ajax call, or is this a limitation in the DOM that only allows one element to be updated at a time. The ajax call is asynchroneous, but I've tried both, only async works period. This is the same in both Firefox and Internet Explorer Any ideas what's going on and how to get around it so I can run these multiple scripts?

  Read the article

• Queue ExternalInterface calls to Flash Object in UpdatePanel - Needs Improvement?

  - by Laramie

  A Flash (actually Flex) object is created on an ASP.Net page within an Update Panel using a modified version of the embedCallAC_FL_RunContent.js script so it can be written in dynamically. It is re-created with this script with each partial postback to that panel. There are also other Update Panels on the page. With some postbacks (partial and full), External Interface calls such as $get('FlashObj').ExternalInterfaceFunc('arg1', 0, true); are prepared server-side and added to the page using ScriptManager.RegisterStartupScript. They're embedded in a function and stuffed into Sys.Application's load event, for example Sys.Application.add_load(funcContainingExternalInterfaceCalls). The problem is that because the Flash object's state state may change with each partial postback, the Flash (Flex) object and/or External Interface may not be ready or even exist yet in the DOM when the JavaScript - Flash External Interface call is made. It results in an "Object doesn't support this property or method" exception. I have a working strategy to make the ExternalInterface calls immediately if Flash is ready or else queue them until such time that Flash announces its readiness. //Called when the Flash object is initialized and can accept ExternalInterfaceCalls var flashReady = false; //Called by Flash when object is fully initialized function setFlashReady() { flashReady = true; //Make any queued ExternalInterface calls, then dequeue while (extIntQueue.length > 0) (extIntQueue.shift())(); } var extIntQueue = []; function callExternalInterface(flashObjName, funcName, args) { //reference to the wrapped ExternalInterface Call var wrapped = extWrap(flashObjName, funcName, args); //only procede with ExternalInterface call if the global flashReady variable has been set if (flashReady) { wrapped(); } else { //queue the function so when flashReady() is called next, the function is called and the aruments are passed. extIntQueue.push(wrapped); } } //bundle ExtInt call and hold variables in a closure function extWrap(flashObjName, funcName, args) { //put vars in closure return function() { var funcCall = '$get("' + flashObjName + '").' + funcName; eval(funcCall).apply(this, args); } } I set the flashReady var to dirty whenever I update the Update Panel that contains the Flash (Flex) object. ScriptManager.RegisterClientScriptBlock(parentContainer, parentContainer.GetType(), "flashReady", "flashReady = false;", true); I'm pleased that I got it to work, but it feels like a hack. I am still on the learning curve with respect to concepts like closures why "eval()" is apparently evil, so I'm wondering if I'm violating some best practice or if this code should be improved, if so how? Thanks.

  Read the article

• How can I inject Javascript (including Prototype.js) in other sites without cluttering the global na

  - by Daniel Magliola

  I'm currently on a project that is a big site that uses the Prototype library, and there is already a humongous amount of Javascript code. We're now working on a piece of code that will get "injected" into other people's sites (picture people adding a <script> tag in their sites) which will then run our code and add a bunch of DOM elements and functionality to their site. This will have new pieces of code, and will also reuse a lot of the code that we use on our main site. The problem I have is that it's of course not cool to just add a <script> that will include Prototype in people's pages. If we do that in a page that's already using ANY framework, we're guaranteed to screw everything up. jQuery gives us the option to "rename" the $ object, so it could handle this situation decently, except obviously for the fact that we're not using jQuery, so we'd have to migrate everything. Right now i'm contemplating a number of ugly choices, and I'm not sure what's best... Rewrite everything to use jQuery, with a renamed $ object everywhere. Creating a "new" Prototype library with only the subset we'd be using in "injected" code, and renaming $ to something else. Then again I'd have to adapt the parts of my code that would be shared somehow. Not using a library at all in injected code, to keep it as clean as possible, and rewriting the shared code to use no library at all. This would obviously degenerate into us creating our own frankenstein of a library, which is probably the worst case scenario ever. I'm wondering what you guys think I could do, and also whether there's some magic option that would solve all my problems... For example, do you think I could use something like Caja / Cajita to sandbox my own code and isolate it from the rest of the site, and have Prototype inside of there? Or am I completely missing the point with that? I also read once about a technique for bookmarklets, were you add your code like this: (function() { /* your code */ })(); And then your code is all inside your anonymous function and you haven't touched the global namespace at all. Do you think I could make one file containing: (function() { /* Full Code of the Prototype file here */ /* All my code that will run in the "other" site */ InitializeStuff_CreateDOMElements_AttachEventHandlers(); })(); Would that work? Would it accomplish the objective of not cluttering the global namespace, and not killing the functionality on a site that uses jQuery, for example? Or is Prototype too complex somehow to isolate it like that? (NOTE: I think I know that that would create closures everywhere and that's slower, but I don't care too much about performance, my code is not doing anything that complex)

  Read the article

< Previous Page | 135 136 137 138 139 140 141 142 143 144 145 146  | Next Page >