What is 'data-widgetvar' attribute defined in <div> of xhtml Primefaces page - primefaces

In xhtml Primefaces page, I search to get a widget's reference that represents a specific DialogFrameWork widget.
The problem is that this widget is generated dynamically using some Java code on J2EE JSF server and is not defined directly in xhtml file.
The only solution I see is to inspect the DOM after DialogFrameWork has been loaded.
Primefaces seems to generate a element in DOM.
Using JQuery, I can find this element.
In this element there exist 2 custom attributes that are
data-widgetvar
data-pfdlgcid
What are these attributes ?
Can I use them to get PrimeFaces widget ?
How ?

data-widgetvar attribute of DialogFrameWork widget represent a reference and can be used to get widget variable.
example:
jQuery(".ui-dialog.ui-overlay-visible",window.parent.document)
.each
(function(nIndex)
{
var sWidgetName = $(this).attr('data-widgetvar');
var wgDialog = window.parent.PF(sWidgetName);
wgDialog.hide();
});

Related

Angular 8 get value from input by have only id

Is it possible by using angular 8 with typescript to get value from input by know only id of this element?
You can simple add this code in your .ts file inside the block where you want value of input from id
(<HTMLInputElement>document.getElementById("unitPrice")).value;
your best bet would be
#ViewChild("dataBlock") block: ElementRef;
clearContent() {
this.block.nativeElement.innerHTML = "";
}
as the angular way because in ng app it is never meant to be work in browser
you can run Angular in a web worker which doesn't have direct access
to the DOM
but if you are firm on id method then you can definitely use classic javascript methods document.getElementById

Can Polymer extend Electron's webview component?

In Electron (Atom-Shell), I'm trying to use Polymer 0.5 to extend Electron's webview tag (to add some custom attributes while retaining all of webview's methods). But I'm getting a NotSupportedError when I try to use my custom component. Is there a way to make this work?
Here's how I'm extending the webview:
<polymer-element name="my-webview" extends="webview">
<script>
Polymer({
// I'll add some custom attributes later
});
</script>
</polymer-element>
But when I try to use my-webview (either of these ways):
<my-webview src="http://example.com"></my-webview>
<webview is="my-webview" src="http://example.com"></webview>
...I get this error:
Uncaught NotSupportedError: Failed to execute 'registerElement' on
'Document': Registration failed for type 'my-webview'. The tag name
specified in 'extends' is a custom element name. Use inheritance
instead.
Now, it's true that Electron's webview is indeed a custom element. But Polymer happily extends other custom elements, right?
It seems like one problem might be that "webview" doesn't have a '-' in its name, so Polymer's findTypeExtension doesn't realize it's a custom element.
Is there any way to work around this and convince Polymer that webview needs to be extended through inheritance, like other custom elements?

Can an AngularJS controller link a scope variable in it to an HTML file, the variable then being referenced to render the HTML file?

I see examples that show directives rendering an HTML file in lieu of the directive. Or controllers rendering an HTML snippet as a scope variable, written directly between single quotation marks - like
$scope.items = '<ol><li>an item></li> <li>another item</li></ol>'
(this does not work well for me because I have other single quotation marks in the middle of my HTML snippet that seem to stop the HTML snippet from rendering properly.)
Here is something I tried that did not work:
Controller code:
innerapp.controller('ResourcesController', function($scope, $sce, $http) {
$scope.template = 'employeelists.html';
});
HTML code:
<div ng-controller="ResourcesController">
<div ng-bind-html-unsafe="template"></div>
</div>
I have 'employeelists.html' in my app/assets/templates folder. I am using AngularJS with Rails, and this setup already lets me call the file like this:
div ng-include="'employeelists.html'"></div>
But I want the controller, instead of ng-include, to render the HTML file.
Basically, I am working on functionality such that if I select an item on the HTML page (under this AngularJS controller), a function in the controller gets called that updates the scope variable (that's linked to a template file) with another template file.
First, please keep in mind DOM manipulation should allways be left to directives, not controllers. Second, I would highly recommend you looked into views using ui-router. This could easily accomplish what you want to do. Here is an example of simple view changing:
https://angular-ui.github.io/ui-router/sample/#/
Also, someone already found a way to input code to the ng-include directive so you could update it:
angular - update directive template on click
However, do read the answer above how he also recommends you use $stateProvider (ui-routers state configurator) since it would be a much easier approach to what you are trying to do.
I hope this helps

How to parse a Razor template with partials from a custom folder?

I have two cshtml-files in the same subfolder of Views. One of the templates is meant to include the other template. I tried to accomplish that as follows:
Main template:
<html>
<head></head>
<body>
#Html.Partial("~/Views/Pdfs/Header");
</body>
</html>
The error I get is
Unable to compile template. The name 'Html' does not exist in current context.
What am I supposed to do additionally?
As commented by Erik there is no Html in RazorEngine (see the linked answer), however you can use #Include("mytemplate") instead.
If you want to be compatible with the #Html.Partial() syntax for some reason you can extend the RazorEngine syntax like this.
Basically what you want to do is provide your own class inheriting from TemplateBase<T> (or ITemplate to be exact) and then set it either via configuration or the #Inherit MyBaseClass<MyModel> syntax. In this case you could just call the Include method from your Partial method within the Html helper class.
Been annoyed by this for a long time. Wrote all the infrastructure classes to just get this working like you'd expect in MVC, without all the MVC burden:
var razor = RazorHelper.O;
var html = razor.RenderFromMvc(#"Views\RazorEngine\TestEmail.cshtml", vm);
https://github.com/b9chris/RazorEngineComplete

How do I load HTML from a string and have AngularJS bindings work

I have an angular project that will be loading external HTML from a string variable into a div that currently has a controller scoped to it.
The HTML that I will be loading from the var will have angular bindings in the html. Once loaded the bindings don't seem to work. I'm wondering how I get angular to recognize the new HTML and parse the bindings so that content renders properly.
Right now the HTML loads but I end up seeing things like {{myvar}} render as text and not render the scoped variables.
You need to do manually what angular does automatically inside ng-view directive.
Something like along those lines should do the trick:
var html = '...';
var linker = $compile(html); // compile html
var element = linker($scope, function () { // remember to pass correct scope here
}); // link compiled html with scope
$('.target-div').append(element);
Output to your element like this:
<p ng-bind-html="myvar.name"></p>