i'm working since hours on this issue without any success, hope to get some help here!
I use the tablesorter plugin to sort table on client side.
First of all, I set an default sort order and initalize the sorter-plugin:
var defaultSort=[[4,1]];
$("#myTable").tablesorter({sortList:defaultSort});
Which does not work (does not sort) while this works:
$("#myTable").tablesorter({sortList: [[4,1]]});
Can't see a reason for this behavior.
Later, I add columns dynamically by using getJSON. After adding a line, I have to update the tablesorter and order again (because of the new rows). For that: read the current "sortList" and try to apply this list:
$("#myTable").trigger("update");
sortOrder=$("#myTable")[0].config.sortList;
setTimeout('$("#myTable").trigger("sorton",['+sortOrder+']);',1);
But this does not work. There is no ordering.
An console.info(sortOrder) returns 4 instead of [[4,1]].
Why?
But all this code works, if the sortList is hardcoded, like:
$("#myTable").trigger("update");
setTimeout('$("#myTable").trigger("sorton",[[[4,1]]]);',1);
Thank you
try this:
var myTable = $("#myTable");
var sortOrder=myTable.trigger("update")[0].config.sortList;
setTimeout(function(){
myTable.trigger("sorton",[sortOrder]);
},1);
in your 3rd example you wrote
setTimeout('$("#myTable").trigger("sorton",['+sortOrder+']);',1);
sortOrder is having toString() called on it when you stick it in that string. That's at least one of the reasons it's not working.
Related
A function in my WP plugin has just randomly (as far as I can tell) stopped working.
Here's the code in question:
window.send_to_editor = function(html) {
var classes = jQuery('img',html).attr('class');
var items = classes.split(" ");
... more stuff here
}
I've confirmed that the html variable is indeed an img html tag. Here's what firebug shows when I do a console.log of the object (console.log(jQuery('img',html));):
Object[]
context -> undefined
jquery -> "1.11.2"
length -> 0
prevObject -> Object[img.alignnone.size-full.wp-image-1234 name.jpg]
And the error it shows is classes is undefined.
I figure there's something wrong with the object I get, but this used to work recently and I'm not aware of any changes in the site that could have caused this.
I'd appreciate any input on this.
EDIT:
More info. This happens with two plugins which are supposed to be unrelated (made by different people). It happens when, after uploading an image to the server (or selecting a previously uploaded picture) you try to insert it into the post.
As I said before this error has appeared out of nowhere, it was working as intended a couple days ago. The only thing I can think of that has changed since then is the domain name, but I can't see how that could be related.
The jQuery selector always returns a jQuery object, but when the length is 0 then no elements were found matching the selector that you provided. In your example you've confirmed that nothing is selected as the length of the jQuery object is 0. Perform a check whether an element was selected like this:
var $els = jQuery('img',html),
classes;
if ($els.length) {
classes = $els.attr("class");
}
Keep in mind that your DOM query is limited by what you pass in as the html parameter. If you simply want to find the images on the page do: var $els = jQuery('img');
I finally managed to fix this; the key was parsing the html string variable into proper HTML, using jQuery.parseHTML(). Thanks to everyone who helped!
I'm trying to create a generic JS method that will adjust (fnAdjustColumnSizing()) all visible dataTables. Problem is that I just can't get the syntax quite right...
So far, i got this close:
$.fn.dataTable.fnTables(true); //this gets all visible dataTables...
$('#givenTable').dataTable().fnAdjustColumnSizing(); //this adjusts a given dataTable
$.each($.fn.dataTable.fnTables(true), function(singleTable) {
$(singleTable).dataTable().fnAdjustColumnSizing();
}); // And this just don't work! Don't know why...
Any ideas or suggestions on an alternative way to acomplish this?
EDIT: I marked the answer below as the correct answer but i did found what was wrong on my original approach (and will include it as it may be usefull to others): It is the syntax of the $.each's provided function, which should receive 2 parameters, being the first one the index and the second the element itself. So:
$.each($.fn.dataTable.fnTables(true), function(idx, singleTable) {
$(singleTable).dataTable().fnAdjustColumnSizing();
}); // This works!
The DataTables API documentation contains an example that might help you:
var table = $.fn.dataTable.fnTables(true);
if ( table.length > 0 ) {
$(table).dataTable().fnAdjustColumnSizing();
}
i try to figure out a greasemonkey script that replaces every onmousedown on a site with an ondblclick. And i want it to constantly update, like every 1,5 Seconds, because the page refreshes using AJAX.
This is the script i came up with, but it doesn't seem to be working.
window.setInterval(document.body.innerHTML= document.body.innerHTML.replace('onmousedown','ondblclick');,1500);
The page it should work with is internal use only. But a good example would be the google search, where onmousedown is used for the links of the results to swap out the URL before you click it.
I also tried it without the semicolon after the document.body.innerHTML.replace.
I'm really new to JavaScript, but since i'm the only one in the company who can code, this one is stuck with me.
Any help would be appreciated.
Also, a small "side question"
Do i have to use #exclude, or is it enough to only use #include internal.companysite.tld* so it will only work on this site ?
A direct answer: you need to supply a function to setInterval - and it's best to set a variable so that you can later cancel it with clearInterval() if necessary.
function myF(){document.body....;}
var myIntv = setInterval(myF, 1500);
You could also do it using an anonymous function in one line as you're trying to do... do that this way:
var myIntv = setInterval(function(){document.body....;}, 1500);
I wouldn't suggest this as the solution to your problem. What it sounds like you want to do is manipulate the active DOM - not really change the UI. You likely need something like this:
var objs = document.getElementsBy__(); // ById/ByName/etc - depends on which ones you want
for (var i in objs){objs[i].ondblclick = objs[i].onmousedown;objs[i].onmousedown = undefined;} // just an example - but this should convey the basic idea
Even better, if you can use jQuery, then you'll be able to select the proper nodes more easily and manipulate the event handlers in a more manageable way:
$(".class.for.example").each(function(){this.ondblclick = this.onmousedown;this.onmousedown = undefined;}); // just an example - there are multiple ways to set and clear these
I am trying to remove the "day" from every possible date occurrence on a page.
This is to make jQuery turn every date in the format of "08/22/2012" into "08/2012"
I was able to do this with this code: Replacing wildcard text using jquery
See my fiddle for more information: http://jsfiddle.net/CfZjF/223/
But it just isn't working within this table layout, regardless of what I have tried.
Another problem will be to specify the day specifically (maybe with wildcards?)-- that is the 2 numbers between the forward-slashes: /xx/, but please see the fiddle for more info.
Any ideas on how I can pull this off?
Try
str.replace(/\/\d+\//g, "/");
Or be more specific by replacing /(\d{2})\/\d{2}\/(\d{4})/g with "$1/$2" or something…
(Updated fiddle)
I think you should individually traverse the table cells instead of trying to globally muck with the entire rows HTML.
This assumes that your data is formatted as in your jsFiddle.
Updated fiddle: http://jsfiddle.net/GKrCS/
$('tr').each(function(){
$('td',this).not(':first').text(
function(){
return $(this).text().replace(/\/[0-9]+\//,'/');
});
});
Since all your dates are in the form xx/xx/xxxx, using a simple split() would always split it into an array with these values:
xx,xx,xxxx
So, something like this:
var totalDate = $("whateverYourDateSelectorMightBe");
var daysInMiddle = totalDate.val().ToString().split(",")[1];
so then you could do:
totalDate.val(totalDate.val().ToString().replace(daysInMiddle + "/",""));
Note that there are much cleaner ways to do this. I just did it this way because I think it better explains what I was trying to do.
I want to edit some HTML I get from a var I saved. like:
var testhtml = $('.agenda-rename').html();
console.log($('input',testhtml).attr('name'));
Also tried
console.log($(testhtml).find('input').attr('name'));
But i get undefined? I figured it'd work like an $.ajax, $.get, $.post? How else can i do it?
When you call .html(), you're only getting the content, not the .agenda-rename. So if the input is a direct child of .agenda-rename, then .find() won't be able to find it.
Probably better just to do without the .html() call:
var testhtml = $('.agenda-rename').clone(); // or .clone(true)
console.log($('input',testhtml).attr('name'));
Now you have the .agenda-rename element(s) and you'll be able to search for elements nested inside it/them.
EDIT: Based on comment, OP doesn't want to modify the original. As such, .clone() can be used. Answer above has been edited to reflect change.
If events are attached that should be retained, then you use .clone(true).
EDIT: The reason $('input',testhtml) and $(testhtml).find('input') give the same result is that they are actually the same thing.
jQuery converts the first version into the second behind the scenes. As such it is technically a little more efficient to use the second than the first.
Here's the code where jQuery makes the switch (after running a bunch of other tests to determine what it was passed).
http://github.com/jquery/jquery/blob/master/src/core.js#L150