I am opening my foundaiton modal after loading jQuery by calling:
$('#decisionModalId').foundation('open');
which gives me Uncaught ReferenceError: We're sorry, 'open' is not an available method for this element.
How can I load it?
Appears that even though I was initialization foundation before attempting to open this modal:
$(document).foundation();
That the above code wasn't "finished loading" (probably waiting for onready from the document, then it runs). So the fix for me was to run it like this instead:
$(function() { // onready
$('#decisionModalId').foundation('open');
});
It wasn't immediately clear if this is the same as what was suggested here: https://github.com/foundation/foundation-sites/issues/8482#issuecomment-206819207 (which also discusses a few more fix alternatives, but not this one).
I'm guessing with straight $('#decisionModalId')... that it runs immediately instead, which is too early.
I would have added this info to the github ticket but it had been locked. Thankfully SO doesn't have that problem...
Related
I am using a reveal modal and populating it using AJAX, following the recommended methods in the Zurb Documentation to do so. The modal appears and populates OK, but if I then close the modal (e.g. click on background) and try to reopen I get a javascript error. I am trying to fix this so I can reopen the modal after close.
I have tried adding the option "data-reset-on-close" to the modal definition to ensure that the modal is reset when it closes, but this does not help.
Here is how the modal itself is defined.
<div class="reveal" id="edit_modal" data-reveal data-reset-on-close="true">
Here is the javascript I am using to trigger the modal (and load the javascript. The modal fires when I click on a <div> with ID "load_modal".
$("#load_modal").click(function() {
var $modal = $('#edit_modal');
$.ajax("/_modal_content/edit_modal")
.done(function(resp){
$modal.html(resp).foundation('open');
});
});
The aim is to allow the user to close then reopen the modal as required. Right now it opens once without problem, but it will not open a second time.
On attempting to open the second time a javascript error is reported:
app.js:65 Uncaught TypeError: t.html(...).foundation is not a function
at Object.<anonymous> (app.js:65)
at l (<anonymous>:3:6477)
at Object.fireWith [as resolveWith] (<anonymous>:3:7245)
at r (<anonymous>:4:10371)
at XMLHttpRequest.<anonymous> (<anonymous>:4:16224)
Hopefully I'm doing something silly and there is an easy fix.
Would be most grateful for any guidance on what I should do to resolve.
There are some tutorials on this that may help:
https://zurb.com/university/lessons/dynamically-update-your-web-pages
and
https://zurb.com/university/lessons/ajaxing-dynamic-content-with-foundation
I'm using AngularStrap Typeahead with an async call in my webapplication and i'm noticing a strange behaviour: when i select one entry from the list the selected value correctly displays in the typeahead, the popup disappears but shortly after a new popup comes out displaying only 1 entry, which is the one i already selected.
This happens only with async calls, and this issue also happens on the
official angulastrap showcase page.
Notice that the not-async calls are working properly.
Has anyone already faced and solved this issue?
Thank you.
I have a problem with my page: on start page cufon-yui is loaded fine, but when I go to another page, it doesn't load. But when I refresh, it looks fine. I use turbolinks.
Turbolinks works by replacing the page content instead of navigating to a new page. If you're calling cufon-yui on document.ready, then it will NOT be called when you navigate to a new page. Your code should then look like:
$(document).on 'ready page:load', function(event)
{
Cufon.replace("whatever you're replacing");
// And whatever other Cufon code you're using is.
}
This way, it'll be called both when the document is ready, as well as when page:load is called by Turbolinks upon the completion of the page loading process.
how can i access the content property of a controller within the chrome debugger.
I really try to find a way to debug my application. So far i can't find a way to do that.
Thank you
Alex
add the statement
debugger;
in the method you want to debug,
Open Google Chrome, CTRL+SHIFT+i
Hit the URL of your application, navigate to the state where you think the code would run
Google Chrome automatically stops at the debugger; statement and focuses you to the sources/scripts tab as you can see in the picture
Inside the Watch expression tab click on the "+" too evaluate code in your case it would be
this.get("content");
As long as you have this breakpoint you can switch to the console panel and execute the code in that context, whenever you are done you can either close the panel by clicking CTRL+SHIFT+I or the close button down there, you can add breakpoints manually by clicking on the line number as well , Hope this helps
For more info
I'm using Ember Extentions which is not ready yet but certainly usable.
There are 2 possibilities
Use the Ember Inspector Tool for Chrome: It is not officially released yet, but from what i have heard it seems usable. I had no time to try it myself yet, but here is an article telling you how to install and use it.
Get access to your controller in the console of your browser. And then examine it as you like. Here is the code to get access to your controller.I use it myself in my app for debugging:
// i assume that your Ember.Application is stored in the global var App
var App = Ember.Application.create({
getController : function(name){
return this.__container__.lookup("controller:" + name);
}
});
// now you can use it like this. To get the users controller (App.UsersController) just use this in the console:
App.getController("users")
I'm getting started with Selenium IDE and trying to test a webapp that's full of modal dialogs (window.showModalDialog).
Recording the test seems to work (except there's nothing in the log when the dialog pops up) but they don't play back properly. The script actually opens the window (triggered by a button click), but then just waits indefinitely.
Any suggestions?
From the Selenium FAQ, Selenium apparently works with some types of dialogs but not others:
I can't interact with a popup dialog.
My test stops in its tracks!
You can, but only if the dialog is an
alert or confirmation dialog. Other
special dialogs can't be dismissed by
javascript, and thus currently cannot
be interacted with. These include the
"Save File", "Remember this Password"
(Firefox), and modal (IE) dialogs.
When they appear, Selenium can only
wring its hands in despair.
To solve this issue, you may use a
workaround (if one exists); otherwise
you may have to exclude the test from
your automated corpus. For the "Save
File" dialog in Firefox, a custom
template may be specified when running
via the RC that will always cause the
file to be downloaded to a specified
location, without querying the user
(see
http://forums.openqa.org/thread.jspa?messageID=31350).
The "Remember this Password" dialog
should not appear again after you've
chosen to remember it. Currently there
is not much that can be done about IE
modal dialogs.
I seem to remember someone working around this with an AutoHotKey script that dismissed the dialog.
I have been using Selenium IDE to test jQuery modals for quite sometime now, I never faced any problem. Here are the things I do to ensure that the test executes properly on playback:
execute the script at the slowest possible speed
when the modal opens, I use the waitForElementPresent command to verify the presence of at least one of the constituent elements on the page; argument being, if one element loads properly, it is safe to assume that all the elements and hence the modal window loaded up properly.
Hope this helps. If you want further help, you can share the code with me alongwith the error in execution that IDE throws out to you.
Modal window hacked:)
http://seleniumdeal.blogspot.com/2009/01/handling-modal-window-with-selenium.html
This is how I handle pop up alert in Selenium IDE
right click on the element (in this case your pop up window) there are some command you can choose. There's also a show all available commands whiche might be a help.
You should use AssertElementPreset and I guess the best locator in this case is CSS. So you can choose AssertElementPresent.
Or
you can use two command on Selenium IDE
selectWindow | null
verifyElementPresent | css=div.content
Hope this helps!