JQuery :: 1.4 Slower Than 1.3x When Using Append Or Html With Large Strings?

Jan 18, 2010

I've been using jquery for some time, and was very excited about the improvements in jquery 1.4 I have found however, that in one particular instance, jquery 1.4 seems to be performing slower than 1.3x, to the point that it has forced me to downgrade the script. I use jquery heavily throughout my web application; in this particular case, when a very large block of html consisting of a bunch of <tr>s is .appended (or .htmled, tried both) to a table, jquery 1.4 in firefox will give the "unresponsive script" error, prompting the user to stop, debug, or continue. The same block of html works perfectly fine in jquery 1.32 (and quite fast too). I haven't had time to do too much experimentation, as this is in a production environment, and thus downgrading was necessary as it was breaking the page, but I would love to figure out why this is happening so that I may optimize the code sometime in the near future. Have the improvements to .html resulted in code that causes higher cpu usage, or that would have a much higher overhead on longer strings? I've commented much of the code around the call, so that it pretty much consists of an ajax call that returns a chunk of html, which is inserted to a table (that I first empty). I thought it might be something with event bindings that occur after the insertion, but removal of these event bindings does not resolve the unresponsive script error. It seems the .html or .append is doing it. Note that this code, as is, works perfectly in jquery 1.3, even with event bindings, etc.

Does anyone have any ideas? My next step was going to be to try returning the entire table including the <table> tags, and doing a replace instead of an append, but if anyone has other suggestions to try, please let me know. Also, just as an aside, what do you guys consider the 'best practice' to be when returning dynamic data for a table (server side sorting, filtering etc from a db) ? Do you return just the data in json, and repeatedly clone a row element, replacing the values in each row (thus decreasing the size of the ajax call, but increasing the client side processing), or return the full html, and replace the innerHTML of the table?

View 2 Replies


ADVERTISEMENT

Find Text Between Two Strings And Prepend/append

Nov 9, 2010

I am attempting to manipulate a long text string with javascript. This text string may have one or more occurrences of a string which starts with a particular string and ends with another string. So, for example, text that starts with 'nam' and ends with 'sit' in this example:

Lorem ipsum dolor sit amet, consectetur adipiscing elit nam aliquam leo sit amet nibh tincidunt ultricies. Nullam nam feugiat velit sit amet dui scelerisque id ornare nulla ultricies.

I want to prepend another string before the nam and append another after the sitt, to give me:

Lorem ipsum dolor sit amet, consectetur adipiscing elit before nam aliquam leo sit after amet nibh tincidunt ultricies. Nullam before nam feugiat velit sit after amet dui scelerisque id ornare nulla ultricies.

I think the way to do this is via RegExp, but I'm insufficiently familiar with this to know how to write the expression.

View 11 Replies View Related

JQuery :: Add A Function To Appended Html Strings?

Oct 7, 2011

I want to create a questions creation page. It has a Question Text Box and a Add Button.When users press the add button, there will be a newQuestion Text Box and a new Add Button appear in the next line. But the old Add Button will become a Delete Button and change its functionality.[code]I put all the Add Buttons and Minus Buttons into two different classes, ".buttonPlus" and ".buttonMinus".The .buttonPlus works well when the line is added by the main html. But it fails to work when it is added by the .append() function. It simply adds the .buttonPlus's CSS code to its button, but the$(".buttonPlus").click(function (event) {...} is NOT attached to the new buttonPlus.

View 1 Replies View Related

JQuery :: Large Table On The Fly And Add It To The Dom Using Html(val)

May 26, 2009

I am constructing a large table on the fly and add it to the dom using html(val). It takes about 6 seconds. I am wondering if there's any practice that would speed up this process?

View 2 Replies View Related

JQuery :: Large Applications And HTML Ids?

Nov 21, 2011

'm coming from the Java/Flex world and trying to get my mind around jQuery/HTML5 to evaluate how you would build a large scale application using them. One issue that I can't quite grasp is how to deal with HTML element IDs. My understanding is that jQuery allows you to manipulate HTML elements by referencing them by ID (there are other ways but those seem to require grabbing a list of elements and sorting through them to find the right one) In a large application with namespaced code how do you deal with dynamically created elements and the IDs the elements may contain?

For example, lets say you have a dashboard app that can contain a number of reports, each report is basically a div with the report content (a chart or table) and some associated views that can edit the report's data model. How can I assure that IDs for the report's subcomponents don't collide with IDs elsewhere in the application? I can envision some programmer working on a large project in a team naming a custom widget 'MyWidget' and then some other programmer naming their widget 'MyWidget' effectively causing two 'MyWidget' IDs to be assigned to different elements.

In the OOP world this isn't an issue because programmer one's widget is really something like MyForm.MyDiv.MyWidget and programmer two's widget is MyForm.MyOtherDiv.MyWidget allowing them to have unique names.

This could just be a fundamental misunderstanding of how things work in HTML but from what I've done every ID assignment is basically a global variable.

View 3 Replies View Related

JQuery :: .html To Display Large Amount Of Content?

Jun 19, 2010

I'm using the .html() function to update information in a div whenever a button is clicked, like this:

$("#myPic").click(function() {
$("#myDiv").html("//new content for div goes here

However, for some of these new sections, the html is QUITE lengthy. can i store it on a separate file in the same directory and somehow import it?? Is there a better way?

View 1 Replies View Related

Loading PHP Seems Slower Than Loading HTML?

Dec 2, 2011

I have a jQuery script that loads and displays a small window on a mouse hover. I use jQuery AJAX to load the content on that window. Having that, I noticed that loading the response from php file (which does not have a php code, only the file has .php on its name) is slower than the same file content with .html name. I wonder if this is a common problem or there is some issue with my codes. I will post my code if needed (if that seems to be the problem).Note: I mentioned that there is no php code in the php file because I am only testing the performance currently. After it is developed, there will be (obviously) php code in it.

View 2 Replies View Related

Jquery :: Use Each To Get Html Of Ul And Append It To Div?

Feb 16, 2009

im trying to look into a div and find each instance of a ul in that div and get all the li elements into a variable then remove the ul's and append the new ul with li from variable. here is what i have so far:

Code:

//var ulla = ' ';
jQuery("ul").each(function() {
var ulla = jQuery(this).html();
});

[Code]....

im trying to get all of the li elements from all ul elements and store them so I can remove all the multiple ul elements and make one ul and put all the li elements inside this new single ul. I keep trying variations of this with different selectors and forms of each and i cant get anything into that ulla variable, i get undefined when loading the page for ulla with code above.

View 1 Replies View Related

JQuery :: Append HTML In An IFrame's Parent?

Feb 28, 2010

how it is possible to append HTML in an textarea of an iframe's parent window.

First of all, i would like to give you an short overview about the related files:

* insert_media.php (a PHP file, which represents a self-made filebrowser) * article.php (a PHP file, which inherits logic to edit and create articles) ** <textarea id="content"> (the textarea which should accept HTML from "insert_media.php")

I'm using CKEditor for my project and wanted to add a selfmade filebrowser for including media into my articles. Therefore i created a "insert_media.php", which inherits all necessary logic to retrieve media items from a database.

The "insert_media.php" is opened inside "article.php" via TopUp (JS library) in form of a lightbox iframe - for sure "article.php" has jQuery loaded in its header.

Now, when I'm clicking on a media item (inside "insert_media,php"), i want to have the content of my textarea "#content" (inside "article.php") being appended by the necessary HTML code.

I'm able to retrieve the val of #content ("article.php") inside my iFrame ("insert_media.php") via $("#form_content_content", window.parent.document).val(); but i can't manage to have access to it into the other direction.

View 2 Replies View Related

JQuery :: .append Automatically Closing Html Tags?

Oct 19, 2010

I have a system receiving an html document as an array of lines, an am inserting this into a div using .append().

If an html tag is opened in 1 line (array element) of the string, and not closed within the same line, .append() automatically closes the tag on the same line, though there is already a corresponding close tag later in the html string.

Minimal test code:

$(document).ready(function() {
var testString = [ "<pre>Test line 1
", "line 2
", "line 3</pre>" ];

[Code]....


Is there an append alternative without this behaviour?

View 2 Replies View Related

JQuery :: Collect A Html Value And Append To Image As A Title Tag?

May 29, 2011

have a small problem and hope you can point me in the right direction ore solve my problem

I have a wrapper Inside a div with $tabs within every tab a table , wo 's working with datatables.js within the tabel several rows with image and tekst the picture's are opend with fancybox. In fancybox the titel of the picture is under the picture.

here is a sample of my table:

<div id="tabs">
<ul>
<li><a href="#tabs-1">Appels</a></li>
<li><a href="#tabs-2">Peren</a></li>

[Code]....

View 6 Replies View Related

JQuery :: Load() Html Files But Append Them Instead Of Replacing?

Nov 30, 2011

Now I can successfully load the data from html files. I want to show these data in seperate div instead of replace them.

Here is my load() code, I add sliders in "scroll-pane".

How can I write my append() ??

View 2 Replies View Related

DIV Not Get Centered When HTML Element Is Large

Jul 17, 2009

My code that centers html elements fails when the html element is large. For example, I have a list of 443 items, which I break into 3 columns within a div. Therefore there are 148 lines in the div. When I use the code below to center the div, the top part of the div is beyond the top of the window screen.

function centerPopup(){
// Get data for centering
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
var popupHeight = $(".popupArea").height();
var popupWidth = $(".popupArea").width();
//centering
$(".popupArea").css({ "position": "absolute", "top": Math.floor(windowHeight/2)-Math.floor(popupHeight/2), "left": Math.floor(windowWidth/2)-Math.floor(popupWidth/2) });
//only need force for IE6
$(".popupBackground").css({ "height": windowHeight });
}

View 2 Replies View Related

Code Runs Slower In IE9 Than IE8

May 14, 2011

I'm having difficulty in explaining why the following code runs slower in IE9 than IE8! (Testing in Win 7 IE9 both 32 bit and 64 bit running in VMWare 3 virtual machine on OS X 10.6.7)

Here's some test code that runs smoothly in about half a second in (latest) FF/Chrome/Safari on OS X, WinXP, and Win7 plus IE7 & 8 on WinXP (for simplicity I removed the tweak that makes it work in IE6).

For some reason I can't explain, it's awful in IE9, slow and clunky. Reducing the time for the setTimeout makes it a bit quicker but no less jerky.

I've tried removing and benchmarking a number of what might be the choke points (Math.min for example ... all with no change.

Here's the test code ...

View 2 Replies View Related

Is It Possible To Append Html Text To Current Document?

Jul 20, 2005

document.write will flush current document content. I've found I can use DOM to append some element to the document, but I think append html text directly is better. Is it possible to append html text to current document?

View 1 Replies View Related

Background Scrolls Slower Than The Foreground

Sep 16, 2011

I have seen this on websites before where the website will be one page. And you have to scroll down our sideways to view the different sections of the website like "about", "contact" etc. But when you scroll the background scrolls slower than the foreground. King of like how the android phones work when you swipe home screens and the background moves just a little bit. I heard it was done using JavaScript but I have Google my brain off and cannot find much on it.

View 2 Replies View Related

JQuery :: Append() Function - Select Element Using ID And Add A Row To Table With A HTML Form Element

Oct 13, 2009

I'm having some problems understanding the append() function. What I'd like to do is select an element using it's ID and add a row to the table with a HTML form element. The table is dynamically generated using a Django template ( form.as_table() ) so I'm not able to alter the original HTML markup too much.

If I had a table like this...

View 3 Replies View Related

Strings Not Replacing Strings

Sep 25, 2007

I've been learning javascript for about a week and I'm really struggling right now. This is a homework assignment to help in learning loops and arrays.

What I want to happen is when a form button is hit it will replace the array from the one previous instead of just adding to it. Hopefully that makes sense. What do I need to do? here's my code....

View 1 Replies View Related

JQuery :: Getting Attr With Strings That Contain?

Jan 11, 2012

If the element i'm getting has an attr that contains string like this....

<span names="Joes|Joe's">Joes|Joe's</span>

When we get the contents of attr st, there is an error because of the ' in they're.

View 3 Replies View Related

JQuery :: Concatenate Two Strings Or Variables?

Jul 27, 2011

i have the following code:

var myHeight = $(".sidebar").outerHeight(true); /* returns Height */
alert(myHeight); /* returns an integer e.g. 500 */
var addPixels = "px"; /* String variable with value "px" */
$(".text").css({"padding-bottom":myHeight}); /* myHeight = 500 NOT 500px */

[Code]....

View 4 Replies View Related

JQuery :: Converting Objects To Strings?

Jun 16, 2009

I have the following code, which I am trying to pass in 5 variables.

<script type="text/javascript">
$(function(){
$('#DrainStackDiameter').change(function(){

[code]....

View 2 Replies View Related

JQuery :: Highlight Certain Text Strings?

Jul 3, 2010

What I want to do specifically is add a CSS class to strings that start with an @ symbol. I can't seem to find any examples online and I haven't had enough experience with jquery to figure this out on my own.

I want it to highlight either the first word only, or just the line that the @ symbol is found on.

View 8 Replies View Related

JQuery :: Use Strings In An Array As Selectors?

Sep 9, 2011

The follow jQuery code doesn't work. Does that mean jQuery doesn't support such a usage?

Code JavaScript:
var selectors = ['#header', '#content', '#footer'];
$(selectors.join(',')).addClass("new");

View 3 Replies View Related

JQuery :: Dynamic JSON Variable Strings?

Apr 18, 2010

I have variables coming in from JSON files via AJAX calls. Each file will have 3 variables for different background colours. Depending on which button is clicked the background will change colour to the value specified in the JSON file.

[Code]...

View 1 Replies View Related

JQuery :: Hiding Single Strings On A Page?

Apr 20, 2010

Is there a simple way to just hide some text in a page? Browsing the documentation I found the .hide() function. But how can I tell jQuery to hide all occurrences of a specific string? If I use the :contains() Selector I can find the text but can only hide the element that contains the text not just the text.

View 2 Replies View Related

JQuery :: Cache The Sizzle Parsed Strings?

Apr 21, 2010

The scenario would be something like checking if an element fulfills some complex conditions, something like if(myElement.is('div.someClass[someAttribute], td.someOtherClass[someAttribute]')) ... . Is there a way to parse that string only once, maybe create some sort of "compiled" version of the check, cache it, then give it to is ? Or does jQuery cache the string after parsing it once so I don't have to do anything?

View 3 Replies View Related







Copyrights 2005-15 www.BigResource.com, All rights reserved