i have created a html page which contain two iframe .
first iframe refer another html which contain a list of members
this list is not fixed and every member name there is a separate html page. which is shown by second iframe.
i have written some javascript code to get the value of that list but i am unable to update the src link of second iframe.
document.getElementById("frame2").setAttribute("src", name);
i have used this code to set the value but i didn't work. i have written this code in javascript file in setFileName(name) function.this is user define function.
might want to give this a try:
window.frames["frame2"].src = name
Information from: Changing Iframe source using Javascript
I have faced this query once and following article helped me. Hopefully it will be useful to resolve your issue.
http://www.dyn-web.com/tutorials/iframes/
i got my answer
top.parent.frame2.location = name;
like this we can change the src of another frame.
thanks all of you..
Related
I have created one application where I am generating multiple nested iframes dynamically. In my structure, I have one iframe name as "list" along with same value to ID attribute. I get name as " ", In chrome when I tried to check its name as mentioned below:
"parent.content0.list" OR parent.frames['content0'].frames['list']
Only I get its name when I use index of its iframe like below
"parent.content0.frames[0]" OR parent.frames['content0'].frames[0]
All my iframes have name and Id attribute with same value.
Also, in chrome and Mozilla I get iframe instead of window object when i try below line of code on debugger:
parent.frames['content0'].frames['list']
but index path give window object
parent.frames['content0'].frames[0]
Check attached screen shot for more clarification. check this image
Let me know if you need any other details.
Don't know why iframe with index 0 have this issue in my code. All other iframes and index iframes are accessible and return correct value.
Because of this my form target is also not working as expected because my form has same iframe name as target.
Can anyone please help me to understand this behavior?
Note: Standalone code gives me correct name but dynamically created iframe[0] create an issue.
I'm using an XML file that has a number for each section. The page loads a link for each section of the XML and puts the article number in the URL parameter (page.html?aid=###). When the link is clicked an overlay iframe pops up the with more information about that article. is calling the overlay iframe popup but I can't use more than one of the same ID for a page.
$(function(){
$('#b1').frameWarp();
});
Instead of using ID="b1", am I able to use each article number for the id? I cannot use class instead of ID.
Would there be another way to do this?
You could use $('a[id^="b"]'), but that's hugely inefficient and will probably match more than what you want it to. Alternatively, you could filter on a regex:
$('a').filter(function(){
var re = /^b[0-9]+$/;
return re.test($(this).attr('id'));
}).frameWarp();
It's not much more efficient, if at all, but at least it would rule out false positives.
Here is the answer courtesy of benalpert on reddit:
$('.b1').each(function() { $(this).frameWarp(); })
This allows the class to be used instead of ID without error.
Thanks to everyone for the help.
I'm trying to write jQuery code to count the number of <img> elements contained on a site. The site is comprised of 4 separate HTML pages, all in the same folder on the server. Only one of these pages, "pics.html", loads the .js file that needs to perform this function (pics.html is the only page that needs to know how many images are on the site).
It's easy to get the <img> elements from pics.html, since pics.html is the page that loads the script:
var numImgs = $('img').length;
...but I'm confused as to how I would perform this same function in reference to a different page. Is it possible to specify the HTML page that the selector refers to?
I tried this, as a wild guess:
var numImgs = $('test.html:img').length;
Unsurprisingly, it didn't work. I googled for the answer, but couldn't find a solution - or if I did find one, I suppose I didn't understand it well enough to realize that it was the answer.
Thanks for any help you can offer!
To select an object from an external file, you'll need to use $.load().
Reference: http://api.jquery.com/load/
Try this
$(document).ready(function(){
$('#myDiv').load('/remotePage.html #TargetDiv', function () {
var elements = $('.class', this).length;
alert(elements);
});
});
I'm using the BeautyTips jQuery extension, but I'm not having any luck passing dynamic URLs as the ajaxPath. In the documentation, they suggest:
$('#example18').bt({
ajaxPath: ["$(this).attr('href')", 'div#content']
});
I have
$( '.username' ).bt({
ajaxPath: ["$(this).attr('title')"]
});
However, when I hover over the username element, instead of bringing up the URL stored in the title attribute within the Beautytip, it attempts to send the whole browser to another page (or refresh; it's hard to tell because the browser address doesn't change, but the page goes blank, and a View Source shows an entirely different page.)
I have verified that the title in the element in question is correct and is being addressed correctly. If I statically pass the path, it works, but I'd rather not write a new version of this function for every item on the page that needs a Beautytip.
Is there a syntax issue here? Any help would be much appreciated.
My HTML is like:
<span class="username" title="http://degree3.com/popup/baloon/member-summary?id=53">Username</span>
Okay, I had to dig through the extension, but I figured this one out.
The plugin author (for reasons I did not spend the time to decipher) kills the "title" attribute of the element that BeautyTips operates on and moves its value to an attribute called "bt-xtitle" instead. I guess this is why his sample used the "href" attribute instead of the title attribute, and it was my dumb luck to attempt this maneuver on the wrong attribute.
Anyway, this works:
$( '.username' ).bt({
ajaxPath: ["$(this).attr('bt-xtitle')"]
});
I have got the values by passing the query string in an iframe.src = "xyxz.jsp?name="+name+"&pass="+pass+"&id="+id.
I need to pass those values which i have got to another jsp page
<iframe src="xyz.jsp"></iframe>
How can i do that?
Your question is unclear, but I guess that you want to pass the querystring of the parent JSP page to the JSP page which is in an iframe of the parent JSP page. If so, then just print HttpServletRequest#getQueryString():
<iframe src="page.jsp?${pageContext.request.queryString}"></iframe>
That said, iframes are an extremely bad practice and very clumsy when all the pages are located at the same server. Rather use server side includes using <jsp:include>. This way the included JSP has access to the same request object.
Use Javascript to dynamically change the src attribute of frame
function changeSrc()
{
window.frames['testframe'].src = "xyxz.jsp?name="+name+"&pass="+pass+"&id="+id;
}
Is this what are you looking for?
according to your cooment to #Manjoor post you want to call javascript function which is defined inside iframe and pass the parameters to it, if that so check this post
Invoking JavaScript code in an iframe from the parent page