JQuery :: Losing Object Definition On Return To A Click Handler?
Feb 8, 2011
I am looping through an array of objects and creating an <li> element for each one and appending to a <ul> in the DOM. Works fine.During the looping I am also attached a 'details' object as data for the list element:$(thisListItem).data('details',{<obj>});Later, I am using the selector:$('ul#images_list li')to attach an on click function for each <li> element.In the click handler I am reading the data 'details' object for the <li> element:dataDetails = $.data(lotImage,'details');and, using the jAlerts plugin, I am opening a jPrompt which asks for the user to enter a price.
The jPrompt call includes a callback which receives the entered value as a parameter. The callback uses the value to 'post' the updated value, via $.ajax, to a server side unction.After OK is clicked in the jPrompt popup, in Firebug, I get an error that the dataDetails is undefined and it lists the line number in the click handler where I originally read the data object from the <li> element.I don't really understand why it should care after the click event has fired and the jPrompt callback has been invoked
View 3 Replies
ADVERTISEMENT
Oct 16, 2010
I have pairs of terms and short definitions in a table. I want to display a longer definition in a box below the terms table when the term is clicked on. The box needs to disappear if clicked on. [code]...
View 6 Replies
View Related
Sep 3, 2009
I've always wanted to help second-language English speakers access my site better, by offering a 'double-click on a word' definition in other languages. I had a useful script for some years which was rather dated, and ceased to work if there was an iframe on the page for some reason. Anyway, I found a very good solution at [URL]However, this opens the definition in a new tab/window.
Having experimented with it opening in a popup, I found problems in getting the popup to regain focus if someone had not closed it before looking for another definition. And anyway, popups can get blocked. So I found a nice layer/iframe solution at [URL] though their positioning of the layer is poor, at least in FF because it slides too far down below the bottom of the page. Their script is: [URL]I have modified that to work with dictionarist and stripped out their own floating part of the script, so that it works with position fixed for everything except IE6. But for IE6, I need to still change this from position fixed to position absolute, and then use a script to float the box.I have been trying the script I use successfully elsewhere in a vaguely similar context:
Code:
/* Script by: www.jtricks.com
* Version: 20060303
* Latest version:
[code]....
which has a call to startFloat(); near the end, which is based on their own floating script nearer the top of [URL] which I have removed. (Doubtless the references to Netscape (RIP) can be removed.)
View 4 Replies
View Related
Aug 17, 2010
Did any one use bind inside for-in loop? In my case it never work correctly whatever I do.I'm trying to go through a collection of objects using for-in and bind MouseEnter handler for each object.What happened is the handler I bound to the last object works for all the objects?!
View 2 Replies
View Related
Nov 13, 2011
My plan is to create a JavaScript class, with some functions and variables, and one of the functions is called when a user clicks on a certain element. However, I need to find out the ID of the element that was clicked (in the example, that of the <p>) for further processing. It looks basically like the following:
[Code]...
The result was very crazy, because console.log(this) gave me the node as result, and console.log($(this)) did the same only as jQuery node, but trying to find out the attribute via jQuery gave undefined as result. I haven't checked if this.id would work (should probably), but I'd prefer to keep the whole script in jQuery, if possible. I suspect it may be an overusage of the 'this' keyword, but if so, what's the proper way to do it?
View 1 Replies
View Related
Dec 4, 2010
I'm fairly new to JQuery and I'm struggling with something: I'm trying to assign a click handler to a table but it's not working. Here's my [code]...
However, when I click on any of the rows, the handler is never called (at least I see no alerts fired).
I suspect that I could use the newer delegate syntax but I'm currently using version 1.4.1 and would rather not upgrade right now.
Can anyone tell me what I'm doing wrong here.
View 3 Replies
View Related
Jan 8, 2012
I can't append click event handler at the <a> element when it is created by jquery on that way...
<script type="text/javascript" language="javascript">
$(document).ready(function(e) {
// Abrindo textos na língua padrão do website.
[code]....
View 2 Replies
View Related
May 18, 2010
I have the following code:
$(document).ready(function(){
$('#link').click(function() {
alert('Clicked!');
$('#content').load('dialogs/load/content', function() {});
});
});
The link is a normal link that is not dynamically created. The alert works. I know the problem is not the Ajax call because this works just fine:
$(document).ready(function(){
$('#content').load('dialogs/load/content', function() {});
$('#link').click(function() {
[Code]....
It only breaks when located inside the click handler. It does not return response headers or a response. Is there something about event handlers and ajax that I'm missing?
View 2 Replies
View Related
Oct 3, 2010
I have simplified the problem - see image.[URL]I instantiate object obj1 which inturn instantiates subObj1. subObj1 is a slave to obj1. obj1 registers a handler function called method1 with subObj1 so that subObj1 can tell obj1 when it has finished.For example: call subObj1.subMethod2() to get the sub object to do something.subObj1 calls subMethod1 when its finished with its task, which inturn causes method1 to be called.
If I call method1 directly from obj1 'this' refers to obj1.However when method1 gets called by the subObj1 through the event handler mechanism,I find that 'this' has been changed to refer to subObj1.This is a problem as now method1 has lost all connection with its object obj1.If I define method1 within the 'Class1' function, I can get it to work if I use the 'var me = this;' trick, but if you have lots of methods within Class1() with further nesting this can get a bit hard to read.So, can someone tell me how to deal with 'this' changing. I.e. I want 'this' to refer to obj1 within method1.
<html>
<body>
<script type="text/javascript">
[code]....
On another note, there seems to many ways of defining methods (e.g using 'prototype' etc etc) and I gettting sick and tierd of a 'trial and error' approach to get things working. Can anyone recomend a good resourse that sets out the best way to design with javascript so I dont keep running into these issues.
View 5 Replies
View Related
Mar 4, 2010
alert($(
"ul li").get(0));
Thisalert show this, literally: [object] This [object] will not accept any DOM methods like addClass, etc
View 6 Replies
View Related
Jan 3, 2006
I've been playing around with JS for a while, but I've not ever found fantastic learning resources. I'm comfortable with other programming languages, so I'm very interested in OOP programming for JS, and I've started to use tools like the Prototype library for that purpose.
However, one problem has consistently caused me problems whenever I'm writing a JS Class. How can I get a reference to the specific class instance from inside an event handler that I create with a class method. Let me give an example of what I want to do:
(This code is using the Prototype library...)
myClass = Class.create();
myClass.prototype = {
makeLink: function(obj) {
// Out here, "this" refers to the instance of the myClass Class
obj.innerHTML = ''
obj.onclick = function() {
// In here, "this" refers to the clicked on element.
// How do I get a reference to the instance of myClass in here?
}
}
Here's the best way that I know how to do this right now. It seems to work in Firefox alright, but doesn't seem to work in IE:
myClass = Class.create();
myClass.prototype = {
makeLink: function(obj) {
obj.innerHTML = ''
self = this; // Save a reference to class instance as "self"
obj.onclick = function() {
// Self is evaluated to instance reference at time of assignment to onclick
self.linkClicked();
}
linkClicked: function() {
// Do something useful here
}
}
Is there a more elegant way to do this? I could just create all of my event handlers for objects outside of the class in procedural code where I already have a reference to the class object, but I like to wrap these things up inside the class, because sometimes they get significantly more complicated than this very simple one. Anybody have any solutions? This has to be a common design pattern...
View 8 Replies
View Related
Jan 10, 2011
I'm writing a function that substantially load a given image making a fadeout/faidin waiting 'till the complete load. The function is named "loadImage" and I would like use it in the following way:
$('#image img').fadeOut().loadImage(src).attr("src",src).fadeIn();
In order to make the image disappear, load... change the attribute "src" of the image and then re-appear. The code for the function is:
(function($) {
$.fn.loadImage = function(src) {
var img = new Image();
$(img).attr('src', src).load(function() {
return this;
});
}})(jQuery);
But when I run it I get the following error:
$("#image img").fadeOut().loadImage(src) is undefined
I think that the function don't return a "valid" object to make it chainable, isn't it?
View 5 Replies
View Related
May 7, 2011
I'm trying to dynamically load javascript from a file with a click handler.
The code is for a class function.
I'm instantiating an instance of the class from the click handler.
It doesn't work the first time I call the "constructor" function, but it does work the second time.
If I put in a call to the "alert" method, it works the first time.
From this, it would be logical to conclude that the code being loaded isn't being given time enough to load and be implanted within the DOM structure for the page.
How can I get the click handler to wait for the code to get established?
What follows is the code for the method that inserts the tag to load the javascript:
Code:
function load_js_code_from_file (js_code_file)
{
var form_ref = document.getElementById ("theForm1");
var new_js_node = document.createElement ("script");
[Code]....
View 1 Replies
View Related
Jul 12, 2009
I've been trying to make my very ajaxy site more SEO friendly, lots of the returned actions from ajax can be retrieved as a full page, so it's just a matter of exposing the links. Up until now I've had 'span' tags which I have now changed to 'a href' so that the search engines will follow them. I've added the following code so that if the event should send an ajax request, it does that, or if it should go get the full page, it does that.
<code>
jQuery('a.mixContent').livequery('click',function(){
var vtid=jQuery(this)..parent('div.controller').parent('li').attr
('id');
alert(eventid);
if(eventid!=null){
clicked(getSelected, eventid);
} else {
[Code]...
View 1 Replies
View Related
Aug 1, 2009
I am currently trying to get an action on the click of a link, and not make it follow the link, just carry everything out in jQuery. Now, if the AJAX request isn't there, it will work as supposed too, but with the AJAX request, it will follow the link, not taking any notice for the return false.
[Code]....
View 3 Replies
View Related
Jun 1, 2011
I have two div tags, first div is the father and the second div is son Inside the father like this
PHP Code:
<div id="father">
<div id="son"> </div>
</div>
[Code]....
My question is why the son inherits the father in the event.
I want when I click on the Father div implement the event, but when i click on the son does not implement anything because it does not have any event.
View 1 Replies
View Related
Jan 8, 2010
I have the following code
Code:
$('a').live( 'click', doIt() ) ;
...
function doIt() { return false }
However, the 'return false' does nothing. If I click a link the event is not stopped and the page it points to is loaded!
So, what could I do, given the above code, to stop the click event ?
UPDATE: I inspected jQuery object and changed doIt to
Code:
function doIt() {
$.Event.preventDefault();
$.Event.stopPropogation() ;
}
Does not produce errors, but didn't stop the event, but I feel I'm getting closer
View 2 Replies
View Related
Jul 13, 2010
I am trying to produce a web form to allow wedding guests to RSVP. The form allows them to enter a name and select from a radio button whether they will be attending or not. If they select the "yes" radio button then a further pair of radio buttons are displayed for their meal preference.
They can then click a submit button or they can click another button to add another line for another guest which operates in exactly the same way. I've almost got this working, but it seems that the checkbox change handler is lost for the current guest when a new guest is added and the checkbox value is reset. I've got a feeling I'm doing something stupid but can't for the life of me figure out what.
Code (source file (renamed to .txt) also attached as I'm not sure the pasted code is too clear):
View 2 Replies
View Related
Jun 10, 2009
I use the live - method to bind a handler to a click-event for all links with class "userDiv"
When I DON'T use this and use instead the "normal" click handler
I can still use the middle Mouse-Button in Firefox to open the link in a new tab without any jquery-stuff
But when I use the live-method (and it would be nice to use it) the middle Mouse-Button behaves like the left one.
View 2 Replies
View Related
May 19, 2006
reSplit is used to return an object from a string of name/value pairs.
pass reSplit()your own delimeters or use the defaults.
String.prototype.reSplit= function(d1,d2){
if(!d1) d1= /s*;s*/
if(!d2) d2= /s*=/;
var Obj= new Object, tem;
var A= this.split(d1);
var L= A.length;
for(var i= 0; i< L; i++){
if(!A[i]) continue;
tem= A[i].splat(d2);
Obj[tem[0]]=tem[1];
}
return Obj;
};
String.prototype.splat= function(delim){
var ax,L;
var d= this.match(delim);
if(!d) return this;
else{
ax= d.index;
L= d[0].length;
return [this.substring(0,ax), this.substring(ax+L), d[0]];
}
};
View 1 Replies
View Related
May 7, 2009
I have three buttons set up using onClick. These buttons are used to display the differing results from an object. They work except the results are displayed on a new page. Ive been trying to get them to display the results in the same page using a div. The problem is I cant get them to work properly i.e the result wont display at all in the div area.
Here is my code
Code:
<body>
<input type="button" value="emp1" onClick="document.write(ger.getFullName())">
<input type="submit" value="emp2" onClick="document.write(tom.getFullName())">
<input type="submit" value="emp3" onClick="document.write(mar.getFullName())">
[code]....
How do i get the results to display in the div?
View 4 Replies
View Related
Aug 25, 2010
I am using JQuery to load data into a textarea element on a form. The data has CRLFs in it, and of course the textarea element supports that. However, they seem to get lost in the load.
Code:
var sURL = "AjaxFunctions.php?Act=QuoteComment&CommentID=" + sID;
$('#MainEdit').load(sURL);
I've tried replacing the CRLF with <BR> on the backend before returning the data, but that doesn't work. Is this just a limitation of the technology?
View 1 Replies
View Related
Apr 9, 2010
I've just set up an accordion using the simple version that comes with JQuery UI.It uses links inside h3s as the headers, and I noticed that links within the content divs had disappeared. The documentation at says - If you have links inside the accordion content and use a-elements as headers, add a class to them and use that as the header, eg. header: 'a.header'.I'm just struggling with the right way to do that. I've tried giving each 'a' a class of 'faq' and using :
Code:
$(document).ready(function() {
$("#faq_accordion").accordion( { header: 'a.faq' },{ autoHeight: false } );
[code]....
View 4 Replies
View Related
Aug 20, 2010
i've seen this code at work which i do not get.
var Key = {
'Number1': 49, 'Number2': 50, 'Number3': 51, 'Number4': 52, 'Number5': 53, 'Number6': 54, 'Number7': 55,
'Number8': 56, 'Number9': 57, 'Number0': 48,
};
I need to return a var element from Key based what a var containing a string contains e.g
var string = "1"; an example
return Key.Number1
How would I do this using a for loop and not having multiple if statements
View 5 Replies
View Related
Mar 19, 2010
I have a JSON source (a plain text file) that has some special chars in it and they look correct in the text file. However when I retrieve the file and use $.evalJSON against it the resultant array has things likeinstead.I'm sure I must be missing something obvious
View 1 Replies
View Related
May 28, 2009
Unexpectedly it's not happening in IE 6/7 :) So looking for form jQuery plugin which can save and deserialize form values on a event. Already using form plugin which saves form values in an Array but it doesn't write back the values, need to write back those values after some manipulation to the individual form. But the case is bit different here; we have been using multiple forms on a single page.
View 3 Replies
View Related