Comments (14)
Can you console.log( $("#main") ); to see whether you are really passing the object to pageContainer?
I think the "#" is the problem, because pages have id and panels have data-id. This is not the same.
I'm usually settings the panel to something like $('#myPage').closest('div:jqmData(role="panel")'), which then passes the correct object to the changepage. So in your case, either
a) give the panel a classname and set: pageContainer: $('.classname')
b) set it like this: pageContainer: $('div:jqmData(panel="main")')
Both should work. Does this help?
from multiview.
Thanks for your response!
I have output $("#main") and it was taking ok because i added id="main" attributte to the panel...
I have tried your option b but does not do the changepage correctly, here is the log :
cleanup
clear active page and wrapper page
how many to clear =1
who is being cleared=wrap1
panelHash 03a $ignoreMyOwnNextHashChange=false
cleanup
Do you have a working example?
from multiview.
Ok. Tried it a few times. I can call the page allright programmatically, either by referencing a .class or #id, but after the transition the screen turns white. Try something like this:
var page = $('#somePage');
$.mobile.changePage( page, { transition:'slide', changeHash:false, fromHashChange: false, pageContainer: $('#main') });
Do you get the same?
I think I still have an error in JQM's css3TransitionHandler, where active-page class gets dropped after transitions. It should not drop active page on the wrapper page, if you are calling programmatically... I thought I had an easy solution there. I will let you know once it's working.
from multiview.
Hi,
Yes, i have tried like this also and getting the same problem, the screen turns white...
Thanks for trying!
from multiview.
Hey epb,
Figured it out. I'm actually blocking changePage calls on panel transitions, so... you can call whatever you want, it won't work :-)
You need to call the panelTrans function inside the plugin like so:
$('#wrapperpageID').data('multiview').panelTrans('#details', 'main', 'main', 'link');
The options are:
#details = where to go
main = on which panel-ID
main = from which panel-ID
link = flag, so panelTrans knows whether this is a pageChange from a click or function-call.
It will need some fine tuning, but I will try to have it ready with the next commit.
Regards,
Frequent
from multiview.
Hi,
Thanks very much for your response, I have tried your solution but i can't get it working.
My problem is that I want to reload one of the internal pages of the multiview, because I want to pass a new productId each team I am calling this page. Do you know the best way to do this?
Should i load that page as external page inside the multiview?
Thanks very much for your help!!
Regards
from multiview.
Hi,
my solution is not in the current version on Github. I need to finish up some things and make an update of all the files. Therefore it is not working for you. I will send you a message when I commit.
Actually I'm just sitting over something similar, like you are doing... I'm also thinking about the best way to accomplish this.
a) If you load the page externally into the panel and the user leaves again, the plugin should drop the page, so when the next item is loaded, the page will be loaded again. Nothing to do for you.
b) If you have the productID page "on board" when the wrapper page loads you would have to load the productID related stuff when calling the page and remove them again when the user leaves the page.
Without having tried, I would go for a). I will let you know how it turns out
Regards
from multiview.
Hi,
Thanks very much for the effort and explanations!
I have page1.cshtml and page2.cshtml that will be loaded as external page in the page1 menu panel.
Inside page1 menu page, I have this link to load the external page:
a href="page2.cshtml" data-role="button" data-rel="external" data-target="menu" >Load external page2</a
The page is loading correctly and the hash is pointing to: .../page2.cshtml
Inside page2 menu page, I have this link to go back to page1 menu page:
a href="#menuPage" data-target="menu">Return to page1 menuPage</a
The correct menuPage of page1 is being displayed, but the hash is not being updated, it still points to .../page2.cshtml instead of .../page1.cshtml#menuPage
I am doing something wrong? Any ideas?
Thanks very much again
from multiview.
I set up a sample page which breaks both ways I'm trying = using the panel-history or using the back button :-(
I will try to fix it over the weekend along with the programmatic panelTransition call, so you can continue. Actually external page handling is pretty much the trickiest area in the plugin.
In general:
If you want to have a back button on panels, you will have to set data-hash="history" on the panel (see the demo page source code). There is also a plugin demo to show how the history works - see here. Click around and use the back buttons or use the browser back button. This works ok for internal pages, but external pages still difficult - see what happens to the URL for example.
I will let you know how it turns out.
from multiview.
@epb - new commit with JQM 1.0.1. coming up in which you can call changePage programmatically. Trying to upload tonight.
from multiview.
new commit is done. You can now changepage programmatically by calling:
$.mobile.changePage('#pageid', {transition: 'slide', pageContainer: $('div:jqmData(id="data_id_panel")') });
So. I'm closing this.
from multiview.
Is it me or it dosent work with external pages?
from multiview.
which version are you using? multiview-JQM 1.1?
from multiview.
Here is a quick sample page. Click on the text in the left menu. This
will fire an alert and a programmatic changepage call to load external dummy2.html into the middle panel.
Check the source code on the bottom how it's done.
I'm almost done with the JQM 1.1. version of multiview - please use the version from this folder:
Also note, you will need to use the JQM version in this folder, because there are a few if-clauses I need to add inside JQM to make it work.
Let me know if this helps.
from multiview.
Related Issues (20)
- how can i make the Menu First column like split view? HOT 4
- how can i hide the mid menu for the 1st load? HOT 4
- menu and min panel can't scroll HOT 6
- Multiple selects crash the page HOT 3
- PopOver showing and Hiding in Javascript
- Back buttons HOT 4
- Select options
- Changing window width breaks layout ... HOT 5
- Fullscreen page and navigation between panels HOT 3
- Back button appearing underneath menu-toggling control group HOT 5
- Scrolled column will not redraw HOT 9
- An issue with getting mathml to show in a main-loaded external page HOT 3
- One way ticket HOT 4
- Changing a panel twice will corrupt history HOT 29
- Close Button in popUp work only when there is no active history on master page HOT 2
- Advice on stable jquerymobile/multiview versioni combination that can be used in production HOT 6
- Disable back buttons
- Please update to latest JQM 1.2.0 (beta) HOT 1
- panelHeight() calcualte the contents 'margin-top' bug HOT 16
- DemoSplitview - iPhone Menu not Main div area and resizing screen HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from multiview.