I'm playing around a little with a Chaplin App and try to add a class to a link in my navigation depending on the routed URL.
# navigation_view.coffee
initialize: ->
super
#subscribeEvent '!router:changeURL', #setActiveNavigation
setActiveNavigation: (path) ->
$('nav a[href="/' + path + '"]').addClass "active"
That works pretty well for the fraction of a second until the whole navigationView is being rerendered. autoRender is set to false. Does anybody know how to prevent the view from being rerendered?
Thanks a lot
Never mind, I forgot about the #subscribeEvent 'startupController', #render and now without that it works fine.
Related
I am using history.replaceState() to update the query params of my page without causing a page reload as suggested in this SO answer.
function setQueryParam ({ name, value }) {
const params = new URLSearchParams(window.location.search)
params.set(name, value)
history.replaceState({}, '', decodeURIComponent(`${window.location.pathname}?${params}`))
}
I am also storing the scroll position of the user with the following line:
history.scrollRestoration = 'auto'
When navigating from one page to another, scrollRestoration works fine - the scroll position is maintained between pages. However, after I change the query params with my setQueryParam function, scroll restoration no longer works.
Why is this happening?
Note: the same code works fine outside of Svelte/Sapper, using HTML and JavaScript only.
As a client-side router, Sapper has to hijack scroll management & restoration a good deal to emulate the behaviour you normally get when you fully reload the browser on each page change.
To do that, it uses history's state to know the scroll position to restore.
When you're using history.replaceState, you're changing the state (it's the first argument you place to replaceState). And so, Sapper don't find its restore scroll data when you later pop the state.
You can try to manually preserve the history state like this:
// notice the first argument
history.replaceState(history.state, '', decodeURIComponent(`${window.location.pathname}?${params}`))
I don't think history.scrollRestoration actually has any effect in Sapper.
Greetings to you dear colleagues!
Prompt.
I have here a situation - there is a component RadWindows RadButton button on it by pressing a button in the RadGrid RadWindows component is set to Visible = true; But after PostBack and shape RadWindows disappears. But going into the RadWindows everything remains as it was changed to reboot.
Question: How to prevent reload the page.
Who does not know what are the components of Rad Teleric.
The source code can throw if it helps.
Thank you, Regards!
Set DestroyOnClose="true" to prevent the window from reopening after close or postback. It sounds like you may be setting the Visible property to true using server-side code. This is bad practice which leads to issues like you describe. RadWindows should be opened via the client-side methods.
On the server side use this code to open a window from the client side using the RadWindow.Show client-side method while having DestoryOnClose set to true. You can customize the script string should you want to use the RadWindow.Open() method to pass a url to the window.
private void ShowWindow()
{
string script = "function f(){$find(\"" + YourRadWindow.ClientID + "\").show(); Sys.Application.remove_load(f);}Sys.Application.add_load(f);";
ScriptManager.RegisterStartupScript(Page, Page.GetType(), "key", script, true);
}
Consider opening it with JavaScript, this will let you stop using these unnecessary postbacks: http://www.telerik.com/help/aspnet-ajax/window-programming-opening.html.
Use OnClientClicking of the RadButton: http://blogs.telerik.com/aspnet-ajax/posts/12-08-10/migrating-onclientclick-handlers-from-asp-button-to-telerik-s-asp-net-ajax-button.aspx.
You can also use AJAX to prevent full postbacks that will dispose (and thus, hide) the RadWindow: http://www.telerik.com/help/aspnet-ajax/radwindow-ajaxifying.html.
Read this sticky to see how to open it from the server if you need to. If you set VisibleOnPageLoad to true it will re-show after postbacks, so you will only need to take care of setting the property back to false when you need to: http://www.telerik.com/community/forums/aspnet-ajax/window/opening-radwindow-from-the-server.aspx.
I would like to know if someone could explain me what happens exactly when we call a "render".
Let me introduce you my problem:
This is my action:
public function actionIndex()
{
$new_user = new CustomUser;
$new_person = new CustomPerson;
$tab_person = $this->getListPerson();
$this->render('index',array('tab'=>$tab_person,
'user'=>$new_user,
'person'=>$new_person));
}
And this is my index view:
.
.
.
</p> <br/>
<?php $this->renderPartial('person-form', array('person'=>$person,
'user' =>$user ));
?>
So my problem is that the loading page time is very long.
If I put a
die("die");
just befor the render in my actionIndex or at the end of my view (after the renderPartial) the execution is very fast. I'll see "die"(and my index page if I put the statement at the end of it) after 0.3 second. But if I put it after my render or I don't put it, then my page is going to be loaded correctly but in 4-5 secondes.
So I think I didn't understand very well what happens after a render. I repeat if I stop the execution at the end of my view page it's very fast, but at the end of my action it's very slow. I thought about js and css, but after looking into I didn't see anything and Firebug shows me that these files are loaded very quickly.
And if I put the "die()" statment at the end of my layout main.php it's very fast as well.
So I know that render will show the page and wrap it in the layout but is there another thing which maybe could make the action very slow?
If anybody has an idea about my problem I would be very grateful.
Sorry if I did mistakes, English is not my mothertongue.
Thank you for reading me, have a good day :)
Michaël
From my understanding it should not load slower. Maybe you have something else loaded on the page.
Try enabling the logs on the screen: http://www.yiiframework.com/wiki/58/sql-logging-and-profiling-in-firebug-yii-1-1/ . See if there is anything executed after the view is rendered.
One reason that this may look confusing, is that it may not be the "rendering" that is slow. It may be that loading models and relations are slow, but by default they are lazy loaded. This means the DB won't be queried until the code that asks for them is hit, which is often in the view.
This might explain why the rendering is slow. So like others said, you need to enable logging, either in the page or log to firebug. You can then check for any slow queries or components.
I have controller PlayerController and actions inside: View, Info, List.
So on urls "/Player/View" i get result with default Layout.
I want to get result with different Layout on request "/External/View".
How can i achieve this?
Although you can override the layout from the controller as has been suggested in another answer, in my opinion this means the controllers are getting just too involved in determining what the UI will be. Best to leave this purely to the Views to decide.
The closest to what you're asking is to do this in your current "~/Views/_ViewStart.cshtml":
#{
if(Context.Request.Path.StartsWith("/External", StringComparison.OrdinalIgnoreCase))
Layout = "~/Views/_ExternalLayout.cshtml";
else
Layout = "~/Views/_Layout.cshtml";
}
Where "~/Views/_ExternalLayout.cshtml" is your alternative layout.
Might want to check the leading "/" is correct on there, I can't remember if it is.
If you put this in the existing _ViewStart, then any view that is being rendering in response to a url starting with "/External" will use this new layout, otherwise the 'normal' one will be used.
Another approach is to use the routing table to add a route value that can be used here to make a layout decision; but I've gone for this approach to keep it simple.
You can specify which layout should be used when returning a view inside your 'ExternalController' controller action.
return View("View", "~/Views/Shared/_AnotherLayout.cshtml")
I have a partial view that I have included on my _Layout.cshtml. It simply has a javascript function that changes an image based on the state of my system. I don't need to reload any data, I don't need to go to the code of the controller for anything, I simply need to reload that partial view.
I tried many of the examples that I found here but couldn't get any of them to work. I felt as if they were too complex for what I was doing anyway. Any guidance would be appreciated.
Thanks,
Steve
If the partial is loaded into the layout directly then there's no straightforward way to refresh it, because it's basically a part of the complete rendered page.
Your best bet is to render the partial using $.load or whatever equivalent you have available by hitting a controller method and rendering the result into a container (like a div). You would have to do this within a script that is loaded with the layout itself, by observing document.ready or something like that. Once you have that in place then it's trivial to keep reloading or refreshing the contents by hitting the controller method as many times as you need. For example in jQuery:
$(document).ready(function () {
RefreshPartial();
window.setInterval(RefreshPartial, 10000);
});
function RefreshPartial() {
$('#container').load('/some/controller/endpoint', {parameters});
}
This will call the controller method, and set the inner contents of the element identified with #container. You can call RefreshPartial as many times as you want.
Partial views only exist on the server. The only way to "refresh" the partial is to go back to the server to get it again.
Obviously, you must be doing something in the partial that needs refreshing. Whatever that is, should be callable from javascript to do the refresh.