Hello,
1. I am trying to open a PopOver from within a list view.
in this way any clicked <li> will open a PopOver, where at any given moment, a maximum of only 1 PopOver will be open and visible at any given time.
2. Assuming we've succeeded the above, the plan is to open each PopOver with it's relevant info.
For example a listView with
Remarks...
Remarks...
Remarks...
Will open a PopOver with the actual remarks for each line ( <li> ).
I am a newby at Kendo Mobile, but it looks like something trivial for someone who knows what they are doing :)
What I've tried so far
According to the docs:
"The Mobile PopOver widget can be open when any mobile navigational widget (listview link item, button, tabstrip, etc.) is tapped. To do so, add
Not 100% working. I've tried opening from within the ListView with a button (data-role="button").
The only kind of working option, is opening the PopOver from within
<div data-role="header"> or <div data-role="footer"> only.
Another thing I've tried is opening the PopOver directly using various jQuery commands. Not recommended :)
PopOver officially has a .close() command. if only it had an .open() command...
Any help is appreciated.
Many thanx
Ran
PS - I am developing on FireFox on Windows 7
1. I am trying to open a PopOver from within a list view.
in this way any clicked <li> will open a PopOver, where at any given moment, a maximum of only 1 PopOver will be open and visible at any given time.
2. Assuming we've succeeded the above, the plan is to open each PopOver with it's relevant info.
For example a listView with
Remarks...
Remarks...
Remarks...
Will open a PopOver with the actual remarks for each line ( <li> ).
I am a newby at Kendo Mobile, but it looks like something trivial for someone who knows what they are doing :)
What I've tried so far
According to the docs:
"The Mobile PopOver widget can be open when any mobile navigational widget (listview link item, button, tabstrip, etc.) is tapped. To do so, add
data-rel="popover"
attribute and a href
attribute equal to the PopOver id
to the navigational widget DOM element (prefixed with #
, like an anchor)."Not 100% working. I've tried opening from within the ListView with a button (data-role="button").
The only kind of working option, is opening the PopOver from within
<div data-role="header"> or <div data-role="footer"> only.
Another thing I've tried is opening the PopOver directly using various jQuery commands. Not recommended :)
PopOver officially has a .close() command. if only it had an .open() command...
Any help is appreciated.
Many thanx
Ran
PS - I am developing on FireFox on Windows 7
6 Answers, 1 is accepted
0
Hi Ran,
Can you please be a little more specific? The data-rel popover approach is working in our online demos.
I would also like to point out that our documentation also describes the openFor widget method.
If you still face troubles with this, you can consider opening a support ticket with a sample project, that demonstrates the problem you have.
Regards,
Petyo
the Telerik team
Can you please be a little more specific? The data-rel popover approach is working in our online demos.
I would also like to point out that our documentation also describes the openFor widget method.
If you still face troubles with this, you can consider opening a support ticket with a sample project, that demonstrates the problem you have.
Regards,
Petyo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Ran
Top achievements
Rank 1
answered on 01 Aug 2012, 05:43 PM
Thanx for replying.
Attached is a small demo based on your own docs.
it is a Mobile ListView binded with an external JSON source.
Everything seems to work fine, until I add a button to open the PopOver.
Once the code is run, you will see it hangs for ever and does not load.
If you delete the line:
<a data-role="button" href="#myPopOver" data-rel="popover">Open PopOver</a>
Everything seems to be OK.
So the issue remains... how to open a PopOver from within a ListView, and then how to load the text content of that PopOver, from the binded data?!
Also, the issue of "openFor" is not well documented and has no example. At least for me, a Kendo newbe, it is not very clear to say the least.
Many thanx
Ran
Attached is a small demo based on your own docs.
it is a Mobile ListView binded with an external JSON source.
Everything seems to work fine, until I add a button to open the PopOver.
Once the code is run, you will see it hangs for ever and does not load.
If you delete the line:
<a data-role="button" href="#myPopOver" data-rel="popover">Open PopOver</a>
Everything seems to be OK.
So the issue remains... how to open a PopOver from within a ListView, and then how to load the text content of that PopOver, from the binded data?!
Also, the issue of "openFor" is not well documented and has no example. At least for me, a Kendo newbe, it is not very clear to say the least.
Many thanx
Ran
0
Hello Ran,
Your listview template is invalid. The problem is that the # characters should be escaped in the template (as they are delimiters for code blocks).
The error is also visible in the chrome/safari console, an error about an invalid template is displayed.
by adding a backslash in front of #, the provided sample works as expected.
Kind regards,
Petyo
the Telerik team
Your listview template is invalid. The problem is that the # characters should be escaped in the template (as they are delimiters for code blocks).
The error is also visible in the chrome/safari console, an error about an invalid template is displayed.
by adding a backslash in front of #, the provided sample works as expected.
<
a
data-role
=
"button"
href
=
"\#myPopOver"
data-rel
=
"popover"
>Open PopOver</
a
>
Kind regards,
Petyo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Ran
Top achievements
Rank 1
answered on 02 Aug 2012, 08:59 AM
Thank you, it works now :)
To complete this issue, remains the question of how to open the PopOver and load the text content of that PopOver from the binded data?!
For example a listView with
Remarks...
Remarks...
Remarks...
Will open a PopOver with the actual remarks for each line ( <li> ).
Also, the issue of "openFor" is not very well documented. could you please give a small example for me and every one else getting here thru search (either Forum search or Google search)
Thanx
To complete this issue, remains the question of how to open the PopOver and load the text content of that PopOver from the binded data?!
For example a listView with
Remarks...
Remarks...
Remarks...
Will open a PopOver with the actual remarks for each line ( <li> ).
Also, the issue of "openFor" is not very well documented. could you please give a small example for me and every one else getting here thru search (either Forum search or Google search)
Thanx
0
Danilo
Top achievements
Rank 1
answered on 06 Aug 2012, 09:15 AM
Hi.
I'm trying to open a popOver from javascript to display a successful save operation.
Regards, Danilo
I'm trying to open a popOver from javascript to display a successful save operation.
function openPopover() { $("#popover-location").data("kendoMobilePopOver").open(); } My error
TypeError: $("#popover-location").data("kendoMobilePopOver").open is not a function
The open() function is obviously not working?
Regards, Danilo
0
Ran
Top achievements
Rank 1
answered on 06 Aug 2012, 10:03 AM
Danilo, 'PopOver' has no "open" function/method exposed for us users. it does however have a "close" function/method.
See the code attached above in my own question, together with the minor improvement/fix suggested by Petyo, and you'll see how to open PopOvers
See the code attached above in my own question, together with the minor improvement/fix suggested by Petyo, and you'll see how to open PopOvers