So I have this site on which I have several divs. When you click on a div, a modal opens (OnClick). The modal's content is loaded remotely (modal body in another file). Within the remote link, I'm also delivering some data via GET. The data is different for each clickable div. Now if I click a div, the modal opens with the correct data. When I close that modal and try to open another one, the content displayed is still made with the data of the first clicked div.
What seems to be the issue here?
That's about what I'm trying to do (simplyfied):
<div id="1" OnClick="openModal('modal_content.php?name=Peter')"></div>
<div id="2" OnClick="openModal('modal_content.php?name=John')"></div>
"openModal" is a selfmade function which opens the modal with the remote content (url in brackets).
Now when I click on the first div, the modal should be
Hello Peter!
and the 2nd should be
Hello John!
First one clicked works fine. When I close that one and try to open the other, the content doesn't change.
Related
So I have tried using these TableLock method on normal page, it works just fine, but I tried using it on modal box and it didn't work. Any idea how to make table header at modal box freezes after it touched the top part of browser? I don't want the whole table to stay in one place like this freeze pane.
I have an issue and I can't seem to get around it.
I have button that opens up a slider in the same page (move a section of the page right and reveal text underneath) but when you click on the button I want to point to the href to move the text-slider to the top of the page and also execute the slider function to activate.
Here is the code:
<div id="st-trigger-effects">
<button ng-click="edu_non_sports()" data-effect="st-effect-3" class="btn- transparent sidebar-btn">
<img src="images/non-sport-extra-murals.svg">
</button>
Its just a basic button that activated the slider, but it is set to a specific section on the page. So when when you click on the button, it opens the slider but you have to then scroll to see the section that was opened.
So I want to know, how can I get the button to:
Move to the section of the page I want to see on the screen, and then also
Execute the code that actually opens the slider to reveal the text
I'm working within Zend Framework 2 and following this tutorial to display and handle form submission via AJAX. Instead of using a jQuery UI modal, I'm using the modal from Twitter Bootstrap 3.
To begin with, I'm just trying to load some dummy content in the modal by specifying a path to a controller action in the href attribute of the modal trigger button.
The view file for the AJAX action I call contains dummy html.
When I click on 'Add Agency', the page darkens but no modal window is displayed although the dummy html does appear in the top left corner of the page. I'm expecting a Twitter Bootstrap modal window to be displayed along with the dummy html within it. When I remove the href tag from the modal trigger button, the modal displays fine.
Appreciate if anyone can help me achieve this simple aim of loading content in the Twitter Bootstrap modal window.
The reason my dummy HTML wasn't being displayed within the modal window was because I wrote the HTML markup for the modal div, along with its inner divs for the header, body and footer sections of the modal. I wrongly assumed that the content I call via AJAX will be inserted into the modal-body div, however the HTML doest not get injected in the modal-body div and because the markup for that div already exists, the dummy HTML appears outside of this and breaks the layout.
So I removed all the inner divs within the modal div and moved them into the remote content, so that the HTML I want to return is enclosed in those divs.
I have some buttons containing different contents and when the user clicks, a new window should popup with the content for the clicked button.
There should only be one popup window where the content should be altered, depending on which button the user has pressed.
I'm using PHP to generate HTML code but I can't find a way to do it as PHP is server side..
Don't want to use href in html, JS could work, although I'm not great at JS..
Here is a site that will auto-generate javascript code for a popup window that you can attach to your buttons
I'm currently trying to write a jQuery script which opens a modal box then (upon user entry) changes a value on the original page.
Currently I've got the script working on just the page itself (without the modal), but when I try to run the command from the modal the value on the main page doesn't change?
Does anyone know how I can solve this?
Thanks,
Tom
Make a function in the page itself (not the modal sub-page), then call opener.myMethod() in the modal sub-page.
If the modal dialog is using an iframe, then from within the iframe you can do either of the following (depending on whether you have nested iframes or whatnot).
window.parent.myMethod();
top.myMethod();
And to access elements on the main page you could do this (assuming you have jquery included on the main page as well):
top.$('#myDiv').html('hello world');
Hope this helps.