I have two Pivot pages each with their own unique AppBar. The second pivot page, is accessible through the first pivot page via the AppBar. However, when I visit the second pivot page, its corresponding AppBar is not there. At first I thought the AppBar was not being rendered, but I suspect that it is being rendered, and being hidden. Furthermore, when I press the back button, the AppBar corresponding the first page is also gone.
I've attempted doing the following in the ready block
WinJS.UI.processAll().done(function() {
/* Grab winControl for app bar, and show it */
})
But that didn't work. What is going on?
To solve the problem you need to give the appBar a different identifiers (id option of your appBar div tag) in everyone of your HTML pages.
P.S: don't forget to update id in your related JS code.
Related
I'm building a site in Kentico 12 MVC and working on setting up content personalization. The normal way to do this is to add an editable area in the view:
<div>
#Html.Kentico().EditableArea("area1")
</div>
Then, in the CMS, the Page tab will show an empty area where the user can add a widget with personalized content.
The problem is that the content I want to personalize is located in my site's login box, which is a common element on every page, so I'd need to manually add a widget into the editable area on every page individually. But my site has over 300 pages, so that's totally impractical.
Is there a way from within my view model that I could check if the editable area has any widgets, and if it doesn't, output default content instead? I'm trying to see if there's an API method or something that would let me count the number of widgets inside an editable area, but I can't find anything in the documentation.
I guess you need to check with regex if Editable area html contains widget tag "<object type="widget" >"
This is a more conceptual question, so I'm not initially submitting any code for it unless someone requests it.
On a current website of mine, I am using a Kendo UI grid to display a table of multiple pages. I also have a (Kendo UI) drop down list, allowing the user to filter rows by class (it reloads the page and makes the necessary edits through the controller).
My problem is this: when the user pages through the Kendo UI grid, it loads a new page and the filtering preferences do not persist. How can I make it either not reload the page(and do everything on the same page instead), or make the drop down box's value persist? Thanks, and tell me if there's any information that would be helpful for me to add!
CLARIFICATION: The functionality is all fine, the only issue is that the dropdownlist does not visually persist.
Actually you can bind both dropdownlist and grid to a single external datasource. This datasource will actually place a ajax call and get the records when the value in drop down changes. As the new records appear in datasource the grid can be refreshed or will automatically refresh without the page reload. Page reload doesn't look like a clean way to filter the grid.
I have a single AppBar declared in default.html for use throughout my application.
On some of the pages I need to show the App Bar and in some of the I need to hide the AppBar.
So far, my efforts to find the methods to hide and show the AppBar have met a dead end.
The documentation on MSDN says:
AppBar.hide method :
Hides the app bar on Windows and the secondary command menu on Windows Phone.
So, that method only hides the AppBar for Windows and not for a Windows Phone project.
I have also tried giving display:none as a CSS style, to no effect.
Any help will be appreciated :)
AppBar.Hide hides the secondary command bar on Windows Phone, not the main AppBar. If you want the entire AppBar to go away then this isn't the right property.
The easiest way is to declare the AppBar on pages that you want to show it and to leave it out on pages that you don't want it, but you should be able to hide it by disabling the AppBar on pages that you don't want it on.
I just modified the appbar-commands.js file in the HTML AppBar control sample as follows and the appbar hides and shows as I click the hide and show buttons:
// These functions are used by the scenario to show and hide elements
function doShowItems() {
document.getElementById('commandsAppBar').winControl.disabled = false;
//document.getElementById('commandsAppBar').winControl.showCommands([cmdFavorite, cmdCamera]);
document.getElementById('scenarioShowButtons').disabled = true;
document.getElementById('scenarioHideButtons').disabled = false;
}
function doHideItems() {
document.getElementById('commandsAppBar').winControl.disabled = true;
//document.getElementById('commandsAppBar').winControl.hideCommands([cmdFavorite, cmdCamera]);
document.getElementById('scenarioHideButtons').disabled = true;
document.getElementById('scenarioShowButtons').disabled = false;
}
I also confirmed with the single-page navigation model navigating between two pages. If you aren't seeing the appbar hide and show when disabled and enabled then make sure you are calling the code to disable / enable the appbar. The PageControl's ready function may not be called when returning to a cached page.
You'll have to do it with C#, You can simply just type.. (If your appbar is called ApplicationBar)
ApplicationBar.Visibility = Visibility.Collapsed;
This will instantly hide the AppBar! If you want your HTML Page to perform this action, it will be much complicated.
Cheers
I think you can try below step in your code.
Add a event listener for appbar beforeshow
In code of before show Check a condition with specific page name
Like : if (WinJS.Navigation.location.match("test.html"))
According to you condition you can Disable your appbar.
All the best..!!
I am using a Data View control and the Pager Add Rows control to allow the user to add more rows to the data view.
Can I extend the Pager Add Rows control to automatically add rows to the Data View when the user reaches the bottom of screen?
Yes, you can do that easily with jquery. if you master dojo you can probably do it in similar ways. but this example show jQuery.
add jQuery to your xpage
add a new custom scriptlibrary to your xpage
put below code in your custom scriptlibrary
Add a addPageRows control to your xpages and connect it to a repeat.
All set, try it out.
$(function(){
$(window).scroll(function(){
if($(window).scrollTop() == $(document).height() - $(window).height()){
$("[id$='pagerAddRows1_ar'],[id$='pagerAddRows2_ar']").click();
}
});
})
The jquery code will try and find pagerAddRows1_ar or pagerAddRows2_ar and if found will click the link automatically when you reach the bottom of screen.
You can actually use this code with any kind of pager or link you have on your xpage. just make sure your code click the right id.
Actually, I want to store some data in background page and the popup page just show that part of data say Data as a div element created in background page document.createElement("div"). Here, the background page will register some listeners to the tab update and change the Data elements accordingly. What the popup will do is to get that Data and appendit use the document.appendChild(Data).
(The purpose I intend is this will cause the popup changes immediately while the tab updage is triggered.)
However, the elements are shown as usual, what I am facing very headache is I have registered the onclick for the div object in backgroundpage as onclick="chrome.extension.getBackgroundPage().somefunc()". However, the first time, all the click will triger the right behavior but after the popup loses foucs and get focus again, all the click won't work.
I try to put something like change the onclick="somefunc()" and leave the func within the script of popup page. And there I want to log whether it is called by console.log("clicked"). Here, something unbelievable happens, the function is succefully trigerred BUT the console is null here, I cannot even call chrome.extension.getBackgroundPage() as well.
Here are a list of questions, maybe very hard to express for me...
1. Whether I can reuse the DOM element from the background page to the popup page directly by appendChild(chrome.extension.getBackgroundPage().getElementById()?
2.Will the onclick event registered in the background page still work in the popup pages?
3. What's the problem with the problem I am encountering? I have tried many ways to find out the reason but all in vain at last...
Best Regards,
If you need any more information, please let me know.
(PS: I am wonderning if it is called something like the event propogation, however, I am not an expert in this two pages communicating...)