Jquery fire function problem for elements added via ajax
Hello experts.
I'm using this plugin:
http://code.google.com/p/ajax-upload/
The script is working fine.
The problem i have is that when i add via ajax new UploadButton 's the function is not fireing.
To fire functions for new added elements via ajax i'm using : $("body").on("something",.
How can i do it in this case?
$(".UploadButton").ajaxUpl
url : "upload.php",
name: "file",
onSubmit: function() {
.....
},
onComplete: function(result) {
.....
}
});
I'm using this plugin:
http://code.google.com/p/ajax-upload/
The script is working fine.
The problem i have is that when i add via ajax new UploadButton 's the function is not fireing.
To fire functions for new added elements via ajax i'm using : $("body").on("something",.
How can i do it in this case?
$(".UploadButton").ajaxUpl
url : "upload.php",
name: "file",
onSubmit: function() {
.....
},
onComplete: function(result) {
.....
}
});
Last Comment
ASKER
Hi.
Can you please show me how to do this with this code?
$(".UploadButton").ajaxUpl
url : "upload.php",
name: "file",
onSubmit: function() {
.....
},
onComplete: function(result) {
.....
}
});
Can you please show me how to do this with this code?
$(".UploadButton").ajaxUpl
url : "upload.php",
name: "file",
onSubmit: function() {
.....
},
onComplete: function(result) {
.....
}
});
Not in there. In
$(function() {
// here
});
$(function() {
// here
});
ASKER
Like this?
$('#instruc').on('click','
ajaxUpload();
});
$('#instruc').on('click','
ajaxUpload();
});
Yes, but wrap that in
$(function() {...});
Try it and see
$(function() {...});
Try it and see
ASKER
This is my code:
$('#instruc').on('change',
ajaxUpload();
});
I get firebug error:
ReferenceError: ajaxUpload is not defined
ajaxUpload();
$('#instruc').on('change',
ajaxUpload();
});
I get firebug error:
ReferenceError: ajaxUpload is not defined
ajaxUpload();
No wrap YOUR code in the page load code $(function() { here your 3 lines });
It is the main jquery method on page load
It is the main jquery method on page load
ASKER
Yes i did this so. i missed to write it. I did copy only this. I have other fynctions included in the main $(functio() .....
So any messages in the console?
I cannot help you with the little snippets you have posted so far. I still cannot guess how your buttons are called, where the new buttons live and so on.
I cannot help you with the little snippets you have posted so far. I still cannot guess how your buttons are called, where the new buttons live and so on.
ASKER
Well i tried to do it it as simplier as i can.
Download the zip file with my full code. Included a test html page and my customajaxupload file.
http://www.2shared.com/file/DfnwXjLB/test.html
The upload procces is working for the div that exists on the page but not for the div i add with the addinstruction function.
! The content from the js function is a div like the one that is allready on the page but with a different id and including a form like the one the plug in is generating on page load.
Download the zip file with my full code. Included a test html page and my customajaxupload file.
http://www.2shared.com/file/DfnwXjLB/test.html
The upload procces is working for the div that exists on the page but not for the div i add with the addinstruction function.
! The content from the js function is a div like the one that is allready on the page but with a different id and including a form like the one the plug in is generating on page load.
I do not understand where the button is loaded with Ajax. I only see a json call
ASKER
Hi.
Tis one will show you what i mean.
The function is not firering for the div you will add with addinstruction function
http://www.2shared.com/file/5cmgZibm/test.html
Tis one will show you what i mean.
The function is not firering for the div you will add with addinstruction function
http://www.2shared.com/file/5cmgZibm/test.html
Sorry. I am not going to execute an unknown .exe on my work PC.
Can you upload the pages on a site somewhere?
Can you upload the pages on a site somewhere?
ASKER
Click the small Download blue button not the big one. It is only the file. No exe
That invited me to find a f*ck buddy on my office computer. Not great.
I will no longer click anything from that site. It is either compromised or tries to install a virus. All download buttons go to an EXE file and clicking to get to one gave me a fullscreen porn page
http://www.siteadvisor.com/sites/http%3A//www.2shared.com/
I will no longer click anything from that site. It is either compromised or tries to install a virus. All download buttons go to an EXE file and clicking to get to one gave me a fullscreen porn page
http://www.siteadvisor.com/sites/http%3A//www.2shared.com/
ASKER
I'm sorry but i have not this kind of problems. I will not use it any more.
Here is a rapidshare link.
http://rapidshare.com/files/3597745753/test.zip
Here is a rapidshare link.
http://rapidshare.com/files/3597745753/test.zip
Ok, running the page in Firefox. If I click the square, I get a prompt with an
Edit
Select
I click the select and get to choose an image
I select an image and I get
Uploading...
so what are the steps to find your issue?
Edit
Select
I click the select and get to choose an image
I select an image and I get
Uploading...
so what are the steps to find your issue?
ASKER
click the add link.
A new field will be added (the content of : testcontent.html). when you select a file here the upload function is not working.
Replace last line before the scripts:
<a href="#" id="addinstruction">Add</a
I have one image there instead of : "Add" you can't see it.
A new field will be added (the content of : testcontent.html). when you select a file here the upload function is not working.
Replace last line before the scripts:
<a href="#" id="addinstruction">Add</a
I have one image there instead of : "Add" you can't see it.
Ah, now getting somewhere.
"<parsererror xmlns="http://www.mozilla.org/newlayout/xml/parsererror.xml">XML Parsing Error: undefined entity
Location: testcontent.html
Line Number 7, Column 63:<sourcetext> <i class="qq-ui-icon ui-icon-wrench" title="Edit">&nbsp;
--------------------------
"<parsererror xmlns="http://www.mozilla.org/newlayout/xml/parsererror.xml">XML Parsing Error: undefined entity
Location: testcontent.html
Line Number 7, Column 63:<sourcetext> <i class="qq-ui-icon ui-icon-wrench" title="Edit">&nbsp;
--------------------------
So I fixed the XML and am now getting s jQuery error in 1.9.1
TypeError: context is null
http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js
Line 4392
I have a hard time getting to where that is appearing
TypeError: context is null
http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js
Line 4392
I have a hard time getting to where that is appearing
Seems to work better when I do
$('#addinstruction').on('c
$("<div/>").load("testcont
});
$('#addinstruction').on('c
$("<div/>").load("testcont
});
ASKER
hmmm......
The div is loading the content.
The problem i have is that after selecting one image (in the new div) nothing happens
The div is loading the content.
The problem i have is that after selecting one image (in the new div) nothing happens
ASKER
Don't care about after firering.
ASKER
mplungjan
The ajaxUpload function is creating the form with the input file field on page load for every .qq-uploader li element and add an iFrame in the bottom of the page.
I'm "simulating" this adding the new div.
By input.change(function (e) line 49 in the plugin js file i get the validation and finally the upload function for the divs that exists on pageload but not for the new ones.
May be i need new script for this case.
The ajaxUpload function is creating the form with the input file field on page load for every .qq-uploader li element and add an iFrame in the bottom of the page.
I'm "simulating" this adding the new div.
By input.change(function (e) line 49 in the plugin js file i get the validation and finally the upload function for the divs that exists on pageload but not for the new ones.
May be i need new script for this case.
Hmm.
The plugin only handles ONE iframe since it is using the same ID if you execute more than once. I think you need a new script that can handle more than one upload
Also I think that perhaps that script should not need to ajax the new form in each time, but create one and append it with the relevant event handlers.
The plugin only handles ONE iframe since it is using the same ID if you execute more than once. I think you need a new script that can handle more than one upload
Also I think that perhaps that script should not need to ajax the new form in each time, but create one and append it with the relevant event handlers.
ASKER
......a new script that can handle more than one upload
It is working for me with multiple uploadfields using class attributes and a different holder id.. Also the loaded page has a dynamic content with a different id every time.
........but create one and append it with the relevant event handlers.
Can you explain this please?
It is working for me with multiple uploadfields using class attributes and a different holder id.. Also the loaded page has a dynamic content with a different id every time.
........but create one and append it with the relevant event handlers.
Can you explain this please?
ASKER
Hi.
I removed completele the plugin.
I created a new function to the onchange event of the input file with a class value.
I tried to use some of my old code.
I have a problem now with the response.
after first submitting i have a content in my iFrame but the alert shows nothing.
The second submitting is working.
I add the form element manually without any script but for the existing div the upload now is not firering.Only for the new added one.
I think we are near to the solution.
Please take a look:
http://rapidshare.com/files/3517134510/newtest.zip
(i don't know if i could use something like onSubmit or onComplete too)
I removed completele the plugin.
I created a new function to the onchange event of the input file with a class value.
I tried to use some of my old code.
I have a problem now with the response.
after first submitting i have a content in my iFrame but the alert shows nothing.
The second submitting is working.
I add the form element manually without any script but for the existing div the upload now is not firering.Only for the new added one.
I think we are near to the solution.
Please take a look:
http://rapidshare.com/files/3517134510/newtest.zip
(i don't know if i could use something like onSubmit or onComplete too)
form.submit();
var response = $('#__ajaxUploadIFRAME').c
does not make sense.
You need the result from the submit to execute stuff. You cannot rely or content being available right after the submission
var response = $('#__ajaxUploadIFRAME').c
does not make sense.
You need the result from the submit to execute stuff. You cannot rely or content being available right after the submission
ASKER
This makes sense .
Any work around. I need something that will get the content ,when i get something from the action page.
Any work around. I need something that will get the content ,when i get something from the action page.
tell me again why you need to submit the form and not ajax the form?
ASKER
I was just looking how this was done with the plugin.
1). It did add an iframe, 2) add as target the iFrame id and finally 3) submit the form.
May be i'm wrong .
What are you suggesting?
1). It did add an iframe, 2) add as target the iFrame id and finally 3) submit the form.
May be i'm wrong .
What are you suggesting?
ASKER CERTIFIED SOLUTION
THIS SOLUTION IS ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
ASKER
Ok.
Thank you for your help.
I will check this tutorial. Maybe using the jquery.form plugin would solve the problems too.
Thank you for your help.
I will check this tutorial. Maybe using the jquery.form plugin would solve the problems too.
ASKER
thank you
regards
panos
regards
panos
JavaScript
JavaScript is a dynamic, object-based language commonly used for client-side scripting in web browsers. Recently, server side JavaScript frameworks have also emerged. JavaScript runs on nearly every operating system and in almost every mainstream web browser.
127K
Questions
--
Followers
--
Top Experts
Get a personalized solution from industry experts
TRUSTED BY
$(''#UploadButtonContainer
You need to bind the even using .on to the new element's container