How to fill a div that is loaded from another html page - javascript

I'm trying to load a div from another html page, then fill it with values from my main html page.
My div is correctly loaded and displayed, but it seems like it doesn't want to fill up. Here's what I have so far :
$("#valider").click(function() {
$("#ag_pub_panneau_detail_html").load( "https://tc610/ag_pub_collecte/Ag_pub_panneau_detail.html #ag_pub_panneau_detail_master_div");
$("#ag_pub_panneau_detail_html").show();
});
So when I click on the "valider" button, my div is loaded and displayed, so far so good.
And here's where I'm struggling, I tried this :
if ($('ag_pub_panneau_detail_html').is(':visible')) {
$('#ag_pub_panneau_entityid').val($('#ag_id_panneau').val());
}
but the div stays blank. So I tried this instead :
$("#valider").click(function() {
$("#ag_pub_panneau_detail_html").load( "https://tc610/ag_pub_collecte/Ag_pub_panneau_detail.html #ag_pub_panneau_detail_master_div", fillDiv());
$("#ag_pub_panneau_detail_html").show();
});
function fillDiv(){
$('#ag_pub_panneau_entityid').val($('#ag_id_panneau').val());
}
But I get the same result. So I tried something else :
$("#valider").click(function() {
$("#ag_pub_panneau_detail_html").load( "https://tc610/ag_pub_collecte/Ag_pub_panneau_detail.html #ag_pub_panneau_detail_master_div");
$("#ag_pub_panneau_detail_html").show();
$('#ag_pub_panneau_entityid').val($('#ag_id_panneau').val());
});
I was thinking that since the .show() works well, I could add my line below it, but it doesn't seem to execute either.
So I used to think that this line :
$('#ag_pub_panneau_entityid').val($('#ag_id_panneau').val());
Was wrong but when I execute it from the Chrome console, the field is correctly filled... I don't know what's happening, and I'm out of ideas for my issue.
Is there something I'm doing wrong ?
I can provide more code/details if you want to, just ask me
Any help would be greatly appreciated !

I managed to get it working, what I did is that I created a js file for the Ag_pub_panneau_detail.html page (the one that is loaded) in which I just wrote :
$(document).ready(function()
{
$('#ag_pub_panneau_entityid').val(localStorage.getItem("ag_pub_panneau_entityid"));
});
And now it works like a charm :)
By the way, can I know why I have those downvotes on my question ?
Anyway thanks for your help !

Related

Counting the number div loaded from external php file

I have two php files, child.php and parent.php. Child.php generates div. Now, the parent.php calls child.php to be loaded in <div id='divContainer'>. Now, I need to count the div inside the divContainer. Is it possible?
I tried something like this:
$(document).ready(function () {
var total_record = $('#divContainer > div').length;
alert(total_record);
});
But it's not working. Even an empty alert is not popping out.
Can someone here, help me on this? THank you!
There's a syntax error:
)};
Should be:
});
Often if you are not getting any output/result at all when expected, it is down to a syntax error which will cause the browser to be unable to parse and execute the code. For future debugging, use the error console as this normally points out any errors with a decent description of the problem.

Firefox- Extension - How to make a sidebar

Can anybody tell me how to make a sidebar. There is nothing about sidebar in the XUL reference. I referred some old codes. But, I can't get where to edit. In those codes I have to create jar files frequently which annoys a lot. Can anybody show me a guidance, just a simple code to add a listbox in sidebar?
Edit:
This code works. I edited the code in "emptysidebar.xul". But it didn't work.
Any solution to add elements in sidebar is welcomed.
I didnt even dreamt that the solution will be this much simple. This is the solution.
var sidebarWindow = document.getElementById("sidebar").contentWindow;
if(sidebarWindow)
{
sidebarWindow.location = "chrome://custombutton/content/login.xul";
// your xul location
}
else
{
alert("sidebar window is not null");
}

Unable to show the div on body load

This is my code posted in a jsfiddle Demo.
As you can see when you click on the
Hyderabad.
Visakhapatnam.
Then a Horizontal Image slider is shown ( YOu can slide throgh the Pictures )
Now my requirement is I need to also show the Image slider on body load itself also
I have tried using body onload function to show the div , and also in Jquery ready function , and by commenting all the hide() functions in javascript , but none of them really worked .
Could anybody please tell me what is the way to do this .
I just tested it.. first I thought that you should just do this:
jQuery(document).ready(function() {
$fp_galleries.first().click();
});
but poorly this will only show the first image and not all images.
I don't know why but it looks like you should do this.
$(window).load(function() {
/* your code */
$fp_galleries.first().click();
});
Maybe because you need to wait until the images are loaded.
perhaps use document on ready to call the function: http://api.jquery.com/ready/
$(document).ready(function() {
openGallery(galleryname){
})
;
The problem is not that it is hidden, its rather that the content are only generated by som javascript when the user clicks one of your links.
You could add something like
$("li",$fp_galleries).first().click()
at the bottom of your script.
This will trigger the click event on one of the links.

jQuery AJAX is not showing output after first PHP conditional

I am having trouble using the jQuery AJAX call. The query runs properly and debug output also shows the correct data, but anything apart from the first PHP conditional in the document being called is not being shown.
First, there are two buttons, one linked to "core" the other "email":
Here's the relevant JavaScript:
$("#core").click(function(){
loaddetails ("core");
});
$("#email").click(function(){
loaddetails ("email");
});
function loaddetails(type) { var query = "details=" + type;
$.post("details.php", query , function( data ) {
$("#d-features").html(data); alert (data);});
return false;
};
And the contents of details.php:
<? if($_POST['details']=='core'){ ?> blah1 <? }
if($_POST['details']=='email') { ?> blah2 <? } ?>
Both "blah1" and "blah2" appear in the alert box debug output. But, only "blah1" ever gets posted on the page div (#d-features), as "blah2" never appears on the page.
I have checked Firebug and there are absolutely no errors. But I suspect the second conditional request may have gone in a loop, as the alert window showing up when "email" button is clicked shows "Prevent page from creating additional dialogs", though no additional dialogs show up even when unchecked.
What is causing this problem and how to fix it?
.html() replaces the content instead of appending.
Try changing that line to see if all the data is returned from both calls:
$("#d-features").html(data); ==> $("#d-features").append(data);
A small modification on your code, you could try to see if this works:
function loaddetails(type) {
$.post(
"details.php",
{
details: type
},
function( data ) {
$("#d-features").html(data);
alert (data);
}
);
return false;
}
Ok, it seems to be a conflict with the tabs effect I loaded for a div that encompassed these links. So once I removed that effect, it works now. But I'm not sure what is wrong with the effect yet, I'll post another question to figure it out.
Thanks to those that offered assistance!

onclick issues with dijit.Tooltip

I am facing following issue. I have attached tooltips with some tab titles of a dijit.TabContainer. The hover behavior is OK, but when I click on the tab, the tooltip stays visible unless I click somewhere else on the page.
On googling I got following page discussing this issue. http://ahackersnotes.com/web/hide-dojo-tooltip-after-a-mouse-click-by-extending-dijittooltip.html.
But the solution provided there didn't seem to work (at least in my case). Is there some other solution (may be a subclass solution) which could handle this?
I think I figured out one solution as follows:
dojo.provide("my.Tooltip");
dojo.require("dijit.Tooltip");
dojo.declare("my.Tooltip" , [ dijit.Tooltip ] ,
{
_onFocus: function(/*Event*/ e){
this.inherited(arguments);
this._focus = false;
}
});
Its working for me. I don't know for sure if it can cause any other problem in the tooltips.

Categories

Resources