Object [object Object] has no method surroundSelectedText - javascript

I made a jsfiddle and it works there, but I'm not able to find a work around for my problem.
window.surroundtest = function surroundtest(element, text2,text3) {
var c = $(element).parent().next('textarea');
c.surroundSelectedText(text2, text3);
}
This is the code working on jsfiddle: http://jsfiddle.net/qmpY8/4/
It uses rangy plugin to place text in certain textareas. But when I tried to place this on my website, it doesn't work and gives me that error I set on the topic.

Fixed. had to use jQuery instead of $ for some reason.

Related

Changing style of getElementsByClassName gives compile error

I am trying to change the style of all of the elements which I received by calling the method getElementsByClassName. The thing is that it does work when it has compiled before (I commented these rows out to let it compile), it just says the error in the cmd. After it compiled I just set the lines back to normal, they keep giving errors but are working in the browser. Any thoughts on this weird behavior?
When commented out:
When not commented and giving errors:
I think the problem is with TypeScript. You should try this workaround
var texts = document.getElementsByClassName("section_text") as HTMLCollectionOf<HTMLElement>;
I had a similar issue when trying to pull off something with angular. The problem is that the getElementsByClassName returns a nodelist, not a normal array, so you can't access properties like you're trying to. You can read more in about it in this answer.
you can simply addClass():
CSS
.newStyle{
width:100%;
float:left;
}
Use Jquery
$('.section_text input').addClass('newStyle');
Use Javascript
document.querySelector('.section_text input').classList.add('newStyle';
getElementsByClassName returns a nodelist. Access properties directly.
let hiddenLocales = document.getElementsByClassName('localeMatch') as HTMLCollectionOf<HTMLElement>;
let hideParentNode = hiddenLocales[0].parentElement;
hideParentNode?.classList.add('newStyle');

Object has no method 'charAt' in jQuery plugin

I am attempting to use the autoNumeric jQuery plug-in which helps with the conversion of various currencies in jQuery.
The plug-in itself works when I use it in a jsFiddle example.
$(function () {
$('.money').autoNumeric('init', {
aSign: '$',
vMin: '-999999999.99',
nBracket: '(,)'
});
});
However, as soon as I integrate it into a big, legacy project, I start receiving the above error on line 194. I know why I'm getting the error - a string is not being passed into the negativeBracket function (negativeBracket(s, nBracket, oEvent) is the signature). Instead, it seems to be a jQuery object - e.fn.init1. I'm confused on how this might be happening. I realize the community may not be able to give a direct answer, but I would love (and will accept as an answer) being pointed in the right direction as nothing has jumped out at me so far.
Update
So, have some additional info that may be of help. It still has me stumped how it's happening (unfortunately, the answers below didn't help to provide any additional insight). When I link in autoNumeric, I key it off of any text field with the class money. It does work as I am typing in the box. I can see see formatting. However, when I tab into a new box, the box I just finished typing in clears itself completely after hitting line 152 in autoNumeric with the same exact error.
#Carlos487 was correct in his answer when he said I have an object that is not a string. I instead have an object that, I believe, is a function. Here's what I'm seeing in Chrome debugger tools:
e.fn.init[1]
> 0: input#price.money required
> context: input#price.money required
length: 1
selector: ""
> __proto__: Object[0]
The "arrowed" items can be further expanded out. I don't know if this provides any more clues, but it's at least something a bit different.
The errors like
no method XXXXX in Object
are produced because you are trying to call obj.XXXX() and obj is not of the desired type, in your particular case a string.
Have you tried in another browser because older or IE can be a little troublesome. I would recomend using chrome developer tools with your legacy app to see if anything else is conflicting or producing the error
I will bet money that you are using a second library which is interfering with jQuery. It has probably overridden $ with its own function.
Try using jQuery instead of $:
jQuery(function () {
jQuery('.money').autoNumeric('init', {
aSign: '$',
vMin: '-999999999.99',
nBracket: '(,)'
});
});
It turns out that the issue was a myriad of issue compounding into the error I saw. A couple things that was happening:
The validator plug-in was wrapping the jQuery object in its own structure (hence the charAt issue).
Once I fixed that, I also learned that some homegrown code was also wiping and rewriting data into the field to provide formatting (which is what autoNumeric is also doing), so autoNumeric would bomb out because it would get a null value and attempt to format it.
There was some other random craziness that also needed cleaned up. So...issue resolved! Still more to work on, but at least this hurdle is past. Thanks all for your help.

jQuery SVG plugin transform animation error

I'm trying to use the jQuery SVG plugin to animate some stuff — scaling and whatnot. I'm totally new to SVG.
var params = {};
params['svgTransform'] = ['scale(1)', 'scale(1.5)'];
$('#TX', svg.root()).animate(params);
This is copied almost verbatim from the developer of the plugin.
Yet when it runs, I'm getting this:
4TypeError: 'undefined' is not a function (evaluating 'f.easing[i.animatedProperties[this.prop]](this.state,c,0,1,i.duration)')
Any ideas?
I think you should check for existence of an element with ID="TX" in your SVG document.
Anyway, I must say that sometimes I found very difficult to remember where to code specific behaviour: there are so many choices, among XML (plain SVG), plain JavaScript+DOM (but what DOM?), jQuery specific, jQuery+SVG.... And all of these with their details... It's daunting! I hope it will be rewarding in the end.
BTW I found that Chrome give a good IDE to workout problems (I'm on Linux now...). Hit Ctrl+Shift+I to enter the debugger and see whatever error...
maybe it doesn't support array inside animate arg object. can you try :
var params = {};
params['svgTransform'] = 'scale(1.5)';
$('#TX', svg.root()).animate(params);

IE Object doesn't support this property or method

This is probably the beginning of many questions to come.
I have finished building my site and I was using Firefox to view and test the site. I am now IE fixing and am stuck at the first JavaScript error which only IE seems to be throwing a hissy about.
I run the IE 8 JavaScript debugger and get this:
Object doesn't support this property or method app.js, line 1 character 1
Source of app.js (first 5 lines):
var menu = {};
menu.current = "";
menu.first = true;
menu.titleBase = "";
menu.init = function(){...
I have tested the site in a Webkit browser and it works fine in that.
What can I do to fix this? The site is pretty jQuery intensive so i have given up any hope for getting it to work in IE6 but I would appreciate it working in all the others.
UPDATE: I have upload the latest version of my site to http://www.frankychanyau.com
In IE8, your code is causing jQuery to fail on this line
$("title").text(title);
in the menu.updateTitle() function. Doing a bit of research (i.e. searching with Google), it seems that you might have to use document.title with IE.
Your issue is (probably) here:
menu.updateTitle = function(hash){
var title = menu.titleBase + ": " + $(hash).data("title");
$("title").text(title); // IE fails on setting title property
};
I can't be bothered to track down why jQuery's text() method fails here, but it does. In any case, it's much simpler to not use it. There is a title property of the document object that is the content of the document's title element. It isn't marked readonly, so to set its value you can simply assign a new one:
document.title = title;
and IE is happy with that.
It is a good idea to directly access DOM properties wherever possible and not use jQuery's equivalent methods. Property access is less troublesome and (very much) faster, usually with less code.
Well, your line 1 certainly looks straight forward enough. Assuming the error line and number is not erroneous, it makes me think there is a hidden character in the first spot of your js file that is throwing IE for a fit. Try opening the file in another text editor that may support display of normally hidden characters. Sometimes copying/pasting the source into a super-basic text-editor, like Notepad, can sometimes strip out non-displayable characters and then save it back into place directly from Notepad.

Jquery taconite selector with character that needs to be escaped

I'm using the jquery taconite plugin to make an ajax request that will replace a certain element in my page, however the element has an id like "email.subject"..
I can select it just fine if I do '$("email\\.subject")', but when I try to use the taconite plugin like this:
<taconite>
<replaceWith select="#email\\.subject">
JUCA
</replaceWith>
</taconite>
The plugin log says:
[taconite] No matching targets for selector: #email\\.subject
How can I make this work?
Ok this is what i did. It is not working for me though. (I did not go through the entire source). But it will point you in the right direction.
The problem really is that in the jquery.taconite.js file, around line 152 (if you are looking at the latest version!) you can see:
var q = cmdNode.getAttribute('select');
var jq = $(q);
if i add an alert to the above statement to find out the value of jq it says: [Object object]. But this works as long as it contains no .
The problem is that the author of taconite is not checking for . from the "select" attributes value. The following code works for me when i tried it isolated in a simple js file. But when i use the same in the jquery.taconite.js file it does not work. Needs more tweaking around?
var x = cmdNode.getAttribute('select');
alert(x); //Shows what you have entered in <replaceWith select="#email.subject"> i.e "#email.subject"
var q = x.replace(/\./g, "\\\\\."); //Searches for a . in the string and escapes it! So now it becomes: "#email\\.subject"
alert(q) //Alerts #email\\.subject ... Great! Works fine till this point!
var jq = $(q);
alert(jq[0]); //Says "undefined"!!!! This is where i got stuck! Why does it say undefined??

Categories

Resources