I want to have a confirmation dialog (not plain javascript) show when the user clicks a button, but I'd rather have it embeded instead of referencing another page.
How do I embed a dialog for use on a jQuery Mobile page?
You have 2 options really - if you want it to popup and fill the page, you can create a JQM dialog page (even dynamicaly), and switch to it. JQM dialogs are explained more in detail here:
http://jquerymobile.com/demos/1.0b1/docs/pages/docs-dialogs.html
It is quite possible to append a new dialog to the same page (simple append it to the container above the one with data-role="page") and switch to it with $.changePage(...)
Another option, if you want it to popup "over" the existing content (modal mode from UI dialog), this plugin will do that:
http://dev.jtsage.com/jQM-SimpleDialog/
Full disclosure: I wrote the second one, so I am biased. However, it does employ a bit of option 1 above, and you are of course welcome to rip the code apart to see how it works if you'd rather roll your own.
Edit:
Another option is to use the builtin popup interface, added in the last major version (1.2.0 I think). It can be found here, and is included in the default:
http://jquerymobile.com/demos/1.2.0/docs/pages/popup/index.html
Related
I'm using a Rails 6 template (Jumpstart Pro) that has the new stuff hotwire, stimulus, webpacker. It works OK for basic stuff... scaffolding new models and make CRUD forms, etc.
However one of my pages uses a vendor's javascript widget, which also requires jquery.
Neither Jumpstart Pro template nor its Forum have any up-to-date documentation or support for adding jQuery via webpacker (e.g., no support for adding jquery the "right way").
So I've added jquery to the one page that needs it via a good old fashioned script tags in the header
%script{:src => "//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"}
followed by the vendor's javascript to initialize the vendor's widget, inside $(document).ready(function(){ init_code_goes_here }); so the widget has time to load to the page.
Works: If I type the page's url into the browser "localhost:5000/cool_page" or "mydev.ngrok/cool_page", it works fine.
Broken: But clicking a link IN the app to go to the page (via link_to "cool page", "/cool_page") does not work:
jQuery is loaded (I have a little "hello world" jquery script that un-hides a div to confirm jquery is loaded)
the vendor widget does not load properly (browser console says widget object is null)
But if I then refresh the page, everything loads fine.
So the page works if "loaded" but not it reached via another page.
From this I infer that the magic behind hotwire/etc is interfering with a proper load of the page when I navigate to it.
So, the question: in a hotwire-enabled Rails 6 app, is there any way to have a nav link that, when clicked, simply tells Rails... skip hotwire shortcuts, load this page for real?
I believe your issue is just that you need to restore default (non-Hotwire) link behavior. There are 3 ways to do that.
See this answer: https://stackoverflow.com/a/68657223/2648054
In short:
1: Set the data-turbo attribute to false.
2: Set the target attribute to "_top".
3: Move the link outside any Turbo frame. Any link inside a Turbo frame, without one of the above attributes, will be handled by Turbo by default.
I am designing a menu for an outlook add-in using Node.js
I would like that menu to behave like these SplitButton (a button that can trigger events adjacent to a dropdown menu). If you look at the splitbutton picture, It shows the paste button you see on Office Word as an exemple; if you click paste, it will paste by default but the the dropdown menu next to it has a seperate action that gives you different pasting options in the form of a dropdown menu.
I am using this the manifest found in this tutorial https://learn.microsoft.com/en-us/office/dev/add-ins/outlook/manifests , unfortunately the menu button cannot have any event attached to it, just give the dropdown menu.
A description of what I am trying to achieve can be found here https://www.codeproject.com/Articles/18447/SplitButton-a-NET-WinForm-control-Part-1, the button part and the split part can have their own actions. Is there a way to do this inside the outlook add in manifest? I am using node.js
Currently the whole button works as a dropdown.
Thank you
Currently the feature you requested, is not a part of the product. We track Outlook add-in feature requests on our user-voice page. Please add your request there. Feature requests on user-voice are considered, when we go through our planning process.
I am new to jquery mobile. I want to open a dialog containing external page as content. At the same time not want to change hash in url.
I have link
Open dialog
which opens the dialog but changes the hash in url. Need help, thank in advance
From official docs:
Since dialogs are typically used to support actions within a page, the
framework does not include dialogs in the hash state history tracking.
This means that dialogs will not appear in your browsing history
chronology when the Back button is clicked.
http://api.jquerymobile.com/dialog/
I know there is a MessageBox class in the isolate library but that is not what I need. I am looking for the pop-up style messagebox functionality found in desktop windows apps (i.e. WinForm apps) where you ask a simple confirmation question and the user can click a yes or no button in response. Is there an equivalent in Dart, if not can anyone suggest some alternatives?
You can display a message box easily with :
window.alert('test');
don't forget this in the top of your file:
import 'dart:html';
This will behave like the alert function in JavaScript. If you want to add buttons (other then the default "ok" button) to your message window, then you will need to make a custom window, which would not be very hard. You create an element which you add to your document body. This element should be absolute positionned. Adding an overlay in front of your document will be useful to prevent user clicks on the page.
this is in javascript, but it is useful to know what to do with dom and css :
http://raventools.com/blog/create-a-modal-dialog-using-css-and-javascript/
I'm making a mobile site with JQuery Mobile and need to allow entry to any section and still allow the user to navigate backwards.
Example to show what I mean. The JQuery Mobile demo site starts at:
http://jquerymobile.com/demos/1.0a3/
If I click on "Toolbars" I reach:
http://jquerymobile.com/demos/1.0a3/#docs/toolbars/index.html
There is a back-button which leads to the previous site. But if I manually enter the above toolbar URL into my browser the page will not have a back button.
How can I accomplish to always have a back button, while still keeping the nice AJAX backed page loads? The server back-end will generate all html-pages so it's fine to "hard code" what the previous section is.
If it's fine to hardcode, then just add
<a href="hardcodedprevious" data-icon="back" />
to the header