Is there a way to know when the DOM of a partial view is ready after it is inserted into the DOM of your web page? - dom

I'm writing an application using Knockout. I have subviews I'm inserting via jQuery's append() function. I'm using the text plugin for RequireJS to dynamically retrieve the HTML, then I'm using append() to attach it to an element in my web page:
$("#parentElement").append(theHTML);
After that, I need to bind "theHTML" to my ViewModel:
ko.applyBindings(myViewModel, $("#subViewElement")[0]);
It seems like the jQuery onDomReady() function is only used in the initial loading of the web page. Is there a way to make sure the DOM in "theHTML" is ready before calling "applyBindings" on it?

Related

Typo3: Extbase extension: How can view be reloaded every 20 seconds?

I have an Extbase extension starting some background activities. To monitor the overall progress, there is a view displaying current state. How can this view be reloaded, say every 10-15 seconds? The best thing was to reload only this part of the page.
Use AJAX. To get the result of a specific action instead of the whole page, you can use the extension typoscript_rendering - it's made for this exact purpose.
To use it, you need to do something along these lines:
Create a controller action that renders the output you want to use for reloading.
In the fluid template where you want to reload the output, render the URL to use for rendering that output using the ViewHelper helhum:uri.ajaxAction from the above-mentioned extension. Put it into some data-attribute or something.
Fetch the content at that URL using AJAX - if you need adapt parameters for each call, it's probably best to do POST requests. You need to implement this manually - TYPO3 does not come with prebuilt JS for this.

symfony custom form type with assets

I've created a custom form type in symfony2. This formtype has it's own template and this is working fine.
The form type also needs some javascript on the clientside to work nicely.
I would like to add this javascript to the page using the same template I use to render the widget. It's a bit more of a hassle to do this manually.
I could add the javascript manually on each page, but it would be nice if that just happened automatically.
I can't add the javascript just before or after the element itself, as it has a dependency to jquery which is only loaded at the bottom of the body.
I tried using a block which is defined in the "main template" (it is named block_javascript) to add the custom javascripts to the footer of the page, but it seems the rendering of forms works a little different and the block is not available.
I'm using assetic to prepare and return assets.
Is there a way I can use blocks from the main template being rendered when rendering a form widget?
I don't think yet about all the consequences or if it's doable, but here an idea that can solve your problem: use the event dispatcher.
an event for assets addition
a service that hold a list of assets to use and subscribe to above event
a Twig extension that use above service to make assets accessible in the template
trigger the event in the buildView() function of your form type with right parameters
use the Twig extension in your layout template
It theorically should work.

Render a partial view with sailsjs

I have a div which displays edit button on hover.
But I don't know how display a partial view representing an edit form in this div only instead of the show view.
I haven't no backbone or client-side js framework plugged in my sailsjs app, I didn't manage to understand how it works, not enough documentation about backbone or angular + sails for me.
Could you help me for rendering this partial view please ?
Thanks by advance,
Cyril
Sails uses ejs-locals in its view rendering code, so in your views you can do:
<%- partial ('foo.ejs') %>
to render a partial located at /views/foo.ejs. All of your locals will be sent to the partial automatically.
One thing to note: partials are rendered synchronously, so they will block Sails from serving more requests until they're done loading. We're considering replacing the code for loading partials to make it asynchronous, but for now it's something to keep in mind while developing your app, especially if you anticipate a large number of connections.

Can I add an element to a RepeatingView without refreshing the latter?

Let's say that I have a RepeatingView with complex elements (for example containing applets). I want to add (or delete) a new element to RepeatingView with ajax, but I don't want to refresh all the elements, because it would cause applets to reload, which I obviously don't want.
I am using wicket 1.4.18
Adding to target only the element that I want to add, does not work, I get:
Component with id (...) was not found while trying to perform markup update. Make sure you called component.setOutputMarkupId(true) on the component whose markup you are trying to update
Take a look at the approach suggested in this Wicket in Action article: Repainting only newly-created repeater items via ajax
The problem when you want to add a new element via AJAX is that there's no root markup tag for the newly added item for Wicket to repaint it.
Quoting the article:
The trick is to give Wicket a tag to repaint via Ajax which can be
accomplished by doing the following:
create the markup tag to represent the new item
add it to the right place in the markup
have Wicket repaint it via Ajax
The code in the article basically prepends some javascript in the ajax submit button's callback that actually creates the markup with the appropriate id for Wicket to be able to replace the element later, when you add it to the AjaxRequestTarget.

Creating reusable widgets

I`m using asp.net mvc 2.0 and trying to create reusable web site parts, that can be added at any page dynamically.
The problem I have is how to load a partial view with all related js and data? Ive tried the following ways to do that:
Use partial view and put all the js into it. In main view use render partial. But to initialize partial view I need to add model to current action method model to be able to make RenderPartial("MyPartialView", Model.PartialViewModel).
Also I do not have a place to put additional data I need to fill my form(like drop down lists values, some predefined values etc).
Use RenderAction, but it seems it have same problems as RenderPartial, except for I do not need to add anything to any other model.
Any other oprions are greatly appreciated.
As I understand it, RenderAction performs the full pipeline on the action, then renders the result - so what is rendered is the same as what you'd see if you'd browsed to the action.
I've used RenderAction to render 'widgets' throughout a site, but in my view they should be independent of the page rendering them, otherwise they're not really widgets and should be part of the rendering page's code instead. For instance, if there's a log in form, you will always take the user to a page that can process the information, no matter what page they are currently on, so this makes for a good widget. Other ways I've used it is to show a shopping basket or advertising. Neither of which are dependent on the page being shown.
Hope this helps a little!