JQuery :: Apply Effects/manipulations On A Just Ajax-retrieved Element
Nov 15, 2010
I'm stuck with a "problem" on a website development. The basic structure ofthe websiteis that:
- There's only one main .php page
- There's a large div in it, initially blank
- Clickin on a link the div is filled with a portion of html code from another .php page, using load() functionplus # selector.
Now, teorically, my main page contains "more html elements", and initially I wrote some rows that changes the color oftexts when the mouse in on it:
$(document).ready(function()
{
$('ul li:first-child').hover(function ()
{
[Code]....
Simple. The problem is that the effect works on elements already written in the main page, but not onthe elements that come from the asynchronized html! How can I apply the effect on the "new" code too?
View 1 Replies
ADVERTISEMENT
Sep 13, 2010
I am attempting to do two things and I'm missing a vital element: ajax call to an XML file to be inserted onto a page, FOLLOWED by selecting these newly created elements to apply event handlers on them. I am near certain that the problem is that the selectors are not 'seeing' these elments and it's an issue of running the event handler only AFTER these elements have been loaded.
How do you do this? I already have a $(document).ready(function() { in order which I naively thought would take care of this exact issue...
View 1 Replies
View Related
Nov 10, 2011
I have something similar to;
$("a").wrap('<div class="mapwrap" />');
$("a").after('<div class="mapover" >A</div>');
how can I combine this to a single line with one reference to $("a")
View 2 Replies
View Related
Apr 1, 2010
When retrieving JSON data I'm able to access individual elements using the $.each() function and iterate over them. However, how would I access just one element by its location and not by name? (i.e. data(0) not data.ID).
View 3 Replies
View Related
Jul 30, 2011
I have been struggling with an AJAX issue for 2 days now and have finally started looking for some help. This is my first post on this forum but by the looks of it , it seems to be full of people who know what they are doing so I humbly ask your advice on this issue. I want to build a javascript function which can retrieve data from an SQL database by calling a php script. For this I use the script underneath. There is off course a php-part to this but the problem is not situated there since the script runs smoothly if I put the returned value (ajaxRequest.responseText) into an html-element like a <div> for instance.
If I don't do this however and just want to assign it to a javascript variable (like shown below : window.out_text = ajaxRequest.responseText) it will not show when I call document.write(window.out_text); EXCEPT WHEN THERE IS A DELAY. So If I put alerters in there to slow down the generation of the final html, it seems to be able to write the javascript variable to the screen. Is this a bug in the ajaxRequest.readyState? Or am I doing this wrong? And especially: How can I solve this. Someone else on this forum must surely have already ran into this problem?
[Code]...
View 4 Replies
View Related
Aug 7, 2010
I am using spinbox plug-in. Its working well.
But it is not working in dynamic text boxes
View 1 Replies
View Related
Jul 27, 2007
Code:
test.div.style.backgroundImage=test.div2.style.backgroundImage;
It works if I specify the actual background image within the function, so I know the image is there, and I know it's been properly assigned to div2, but div1's background image doesn't change.
View 3 Replies
View Related
Jan 25, 2011
I'm writing a little application with JSF 2.0 + jQuery. My page contains a simple input form, a submit button and a div containing one div for each string that the user type in the input text field. i'm using JSF 2.0 ajax to send the request to the server and rerendering only the div-container, with the updated content. Initially the div contains a single div with a text example for the user. Every div inserted by the user has the style-class "user", so with jquery I manipulate all off them through a simple function.
Here my code:
But i've encountered this problem when I started using ajax: my jquery function doesn't work on the new content, so I started trying to resolve the problem with live() method as suggested in the FAQ and on several posts
So my code changed a little:
This code doesn't work at all after the submit event, so for test purpose only i've changed the event to click and ,using the event generated from the mouse click, it's working.
But obviously i need to apply my jquery function right after the ajax request and without the user's partecipation.
I'm testing this code on Firefox 3.6.13, but i need it to work correctly also on IE8, Chrome 8 and Opera 10
What's wrong in my code?I have bound the wrong event to the div-container and instead I have to bind the submit-event to the form?
View 2 Replies
View Related
Dec 2, 2010
Code:
This is a trimmed down version of my problem, '.myElement' gets duplicated on double click. In '.myElement' is content and a close button that when clicked removes itself.
The problem is "newly" created elements don't get the the dblclick or the child 'a.close' click events. i know i can double the events and re apply after the element is created but in my real version there is WAY more going on in each of these events and i don't want to create all that redundant code. i guess i can pull all the actions out into functions and bind after creation but even that is a little messy, is there an apply events feature in jQuery or something?
like:
Code:
View 1 Replies
View Related
May 22, 2011
i am using ajax to retrieve the img url path how am i going to use the img url path i retrieve and display as a image and i using javascript language anyone know? how to do that i try the follow way but don't work what wrong?
Code:
var descIg = "";
descIg += rssent[i].descImg;
var placeImg = document.createElement('img');
placeImg.src = descIg;
View 24 Replies
View Related
Mar 1, 2010
I am having problems with slideUp/slideDown effects on elements that I add to page with a AJAX callback. slideUp/Down works on elements that are present on the page load, but doesn't work on all elements added later with AJAX.
These items can be added with ajax... Then I have checkboxes that I can filter some items by using jQuery slideUp/Down. If checkbox is clicked some items are hidden or shown. But as said abowe it doesn't affect the newly added items!
View 4 Replies
View Related
Mar 16, 2010
I have a website using jQuery that for the most part works fine, but it contains a very large form with a lot of fields. I have an option to save the settings from the form and to load and retrieve them from the server. The problem I'm running into is that the loading settings involves changing so much in the DOM (the form is huge and contains a lot of fields) that it seems to be freezing up on some browsers or timing out. I can't reproduce this on my computer (although it does take awhile to finish processing) but I've gotten enough reports of the problem that I'm looking for some advice as to how I can speed it up some.
The site is [URL] I've tried to speed it up by caching a good chunk of the selectors I'm interacting with and I'm using IDs to access the fields in most circumstances. But I'm not sure what else I can do to really optimize the loading. how I can go about improving on the load speed?
View 9 Replies
View Related
May 6, 2011
I've googled the heck out of this, and although I'm finding plenty of solutions, I'm having trouble understanding them. I'm very new to jquery, and brand new to ajax. My problem is, I have a php application using several jquery effects. I've just started learning ajax and it is going really well, this stuff is incredible! But all the ajax loaded data loses the jquery effects. I get that it is a DOM issue, and I've seen that others have used "live" (i think?) to fix this, but I honestly just have no understanding of how toimplementanything that I'm seeing.
This is part of my ajax...
And this is the main effect I need to get working.
View 5 Replies
View Related
Oct 20, 2009
In the code below the second alert is executed before the first one making it show the "empty" content, and not the result from the .json file. Why, and how can I make it work? getjson.html file
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL]">
<html xmlns="[URL]"><head>
<title>getJson</title>
<script type="text/javascript" src="[URL]"></script>
<script type="text/javascript">
$(document).ready(function(){
var content = 'empty';
$.getJSON("getjson.json",
function(json){
content = json.layout.template[1].content;
alert(content);//This work
});
alert(content); //This don't
});
</script>
</head>
<body></body>
</html>
getjson.json file {
"layout": {
"template": [ {
"key": "01",
"content": "<span id="span1">010101</span>" },{
"key": "02",
"content": "<span id="span2">020202</span>" },{
"key": "03",
"content": "<span id="span3">030303</span>"
}]}}
View 2 Replies
View Related
Jul 21, 2009
I want an identical effect that has three buttons -- print, email, text that does the same thing on the site.I can handle the server-side code (PHP), but I want to know how I can get that exact effect? My JavaScript is a bit above beginners, and I see they are using Prototype with some other effects.Now, on Firefox, I had saved the webpages but when I tried click on either of the 3 buttons, the JavaScript effect did not work. Can anyone show me how to implement something similar on my site?
View 2 Replies
View Related
Sep 24, 2010
If I generate a new element via AJAX, jQuery don't listen to events at this element. I read that live() how to use this function together with post().
That's what I have:
$(document).ready(function() {
$.post('products.php', $('#products_form').serialize(), function(returnData) {
$('.target').html(returnData);
});
[Code].....
View 5 Replies
View Related
Jul 23, 2005
I wanted to add additional data to my select function.
I tried:
<select id="sel_1" name="sel_1"
<option struct_id="24" value="4">Text 1</option>
<option struct_id="37" value="8">Text 2</option>
</select>
function dispSel(obj)
{
alert(obj.struct_id);
}
This did not work. I'd like to be able to add some other data
associated with the option in the select element.
Anyone have any other ideas.
One I thought of was instead of
<option struct_id="24" value="4">Text 1</option>
use
<option value="24|4">Text 1</option>
and then
function dispSel(obj)
{
var myarray=obj.value.split("|");
alert(myarray[0]);
}
View 4 Replies
View Related
Jul 22, 2010
here is the code I am using it is suppose to apply a style attribute the the id "toplink" but I can't seem to get it to work right.
$(document).ready(function(){
menuYloc = parseInt($(name).css("top").substring(0,$(name).css("top").indexOf("px")))
$(window).scroll(function () {
var offset = menuYloc+$(document).scrollTop()+"px";
$("#toplink").animate({top:offset},{duration:500,queue:false});
});
});
View 6 Replies
View Related
Mar 26, 2010
I'm trying to grab values from a set of arrays based on the value returned by my select box.
**Caveat - this is not an area I have any real experience with**
My arrays look like:
Code JavaScript:
I then need to test for each, then associate with one of my fees arrays, then grab each of the values in the array and write those values to elements within my page.
I'm then doing this to evaluate for each degree
Code JavaScript:
I need to first figure out how best to import all of these 60+ arrays and then in each of my conditions pull out each value and write to my page.
There is a unique 1 to 1 relationship between each degree and array so I can't consolidate as the values for each degree differ slightly.
View 3 Replies
View Related
Aug 6, 2010
the code i have works in ff, chrome, opera, safari. but not ie7.in the callback function i append to the dom and after it exists in the dom i attach an event to it. this works in other browsers but does nothing in ie.. what could be causing this?
Code JavaScript:
$.get('/ajax/itemqty.aspx', {'product':product}, function(data){
// this is just a snippet of code. in my project i loop through rows and insert links based
[code]....
View 1 Replies
View Related
Nov 4, 2010
I have ajax request with a success function. The data I'm getting back are an entire <html> ..</html> page. Is there a way to retrieve from those data only a given DOM element by its id ?
$.ajax({
type: "POST",
url: requestURL,
data: formData,
[Code].....
View 1 Replies
View Related
Apr 21, 2010
function GetDepartmentTree() {
$.ajax({
type: "POST",
url: "Service/service.asmx/GetDepartmentTree",
[Code]....
View 2 Replies
View Related
Jul 26, 2009
I have a form on page1.php that will need multiple copies of page2.php to be placed or removed accordingly.
On page2.php it needs to have a select box (populated from a database) and a text area that will be posted along with the information on page1.php
Not sure if it'll help understand it, but basically page 1 has the employee's information, and they can add various details (and remove them) by pressing 'Add skill' then selecting a type from the drop down (communication, marketing, admin or whatever) and then a comment next to it.
View 3 Replies
View Related
Oct 31, 2010
I am echoing some dynamic content into a DIV based on form entries. The content is essentially a dynamic table, with results populated based on the user input. The user can further refine the database results by entering more data into other fields. All of this works fine. What I'd like to add is the ability to click on an <a> tag header on each column to sort by that column. I haven't gotten it to work, so I wanted to try a more simple test. I currently echo <a id='test' href='#'>Click Me</a> into the DIV set aside for AJAX response. I then setup a jquery .click() event monitor to simply alert me when I click on it. If I place this <a> tag in the main portion of the content that is static, I get the alert box. But when I put this into the content of the DIV tag generated dynamically by AJAX, it doesn't fire the alert. Is there something I need to do to 'reload' the page? Is the dynamically added content not part of the document since the entire page isn't reloaded?
View 1 Replies
View Related
Apr 24, 2010
I wonder how you can select the ID of an element (li) you have clicked and pass this to the server to do stuff with it :-)
View 2 Replies
View Related
Jun 9, 2009
I'm trying to replace the <head> of a page with the <head> of another page.[code]I call $("head").load("/About head")expecting to replace the <head> section of the current page with that of URL...However, the function seems to insert an empty string into my <head> tag.
View 5 Replies
View Related
