Formly Form loading hanging site performance - angular-formly

I have implemented complex custom wrapper.
If the FORM contain 10+ custom wrapper it is hanging HTML UI page for some seconds.
For example when ng-if is true, 5+ seconds HTML hanged.
<form [formGroup]="form" *ngIf="showForm && fields && model">
<formly-form [model]="model" [fields]="fields" [options]="options" [form]="form"
(modelChange)="onModelChange($event)"></formly-form>
</form>
Is there any Event when the FORM loading is completed?
Can we run it in web worker?

Related

How do I load a local html file using webview

I am building an electron app where I am loading an html file using this code in development:
<webview id="foo" src="/src/documents/example.html" style="display:inline-flex; width:100%; height:550px"></webview>
This works well in development but once the app is packaged it shows a blank page.I have researched around and it seems using __dirname might fix the issue.
I am still very new to electron and can't figure out how to reach this path (src="/src/documents/) using __dirname.
Any help will be highly appreciated.
I thought I would share the solution I found around this.Basically ,you need to create a route for the page you want to load like this:
{
path:'/example',
name:'example',
component: require('#/components/example').default
},
If you are using electron-vue,make sure the page extension is ".vue" and enclose the page content like this:
<template>
<html>
**Put the page content in here**
</html>
</template>
In my case,I wanted to go to the page by clicking on a button,so i used Vue-router like this:
<button type="button" class="btn btn-light"><a id="home"><router-link :to="{ name: 'example' }"> Button text </router-link></a>
</button>
Et voila!

Netlify form submissions are blank

When I submit my Netlify form the server responds with a 200 status and I get the 'thank you' response page. However, when I check the form submission in the Netlify admin, they are all blank. I've inspected my xhr requests and the data shows in the 'params' section of the browser dev tools.
Disclaimer: I work for Netlify.
When our service stores blank submissions, it has not received any fields from the submission which were defined in the html version of the form with the same name parameter in its definition as the submission.
To start off with, it's useful to know that our service requires a plain html version of your form, with a name parameter as well as the netlify or data-netlify=true parameter; this is what prepares your site to accept form submissions at all, so you had that set up right already; if you didn't, you'd get a 404 when POSTing.
Once you have this in a deploy and we parse it correctly, you'll see the form name in your site settings dashboard on the 'Forms' tab. Note that we ALSO pull all the field names we'll save and show to you in notifications or the dashboard from this file and only this file, so make sure you give each form field all a name as well, in that html file.
If you see the form in your dashboard, yet get a blank submission when you are sure data was POSTed, this probably has one of three causes:
Netlify did not correctly process your field names from the html version of your form. The service will only properly handle the fields which we see in that html version at deploy time.
Netlify does matching by field name at submission time, so make sure that what your site sends to us then matches up between with your deployed html copy of the form. This happens automatically for pure html (no JS) forms since you are POSTing from the file which is the canonical "definition" of your form fields; however for javascript forms you need to take care that the names match up. Put another way, you cannot later add new fields dynamically in javascript and send them (Netlify will accept all fields, as you have seen; but will not store them or notify you about ones that were not processed at deploy time!)
One more quirk that could get in the way: having multiple copies of a form with the same name in your deploy. Only one will be processed, so if you happen to have an errant <form name=test netlify></form> in another html file (or even the same one!) - it could be the one that we process rather than the other form also named test. So, make sure that you only send a single html definition of your form. Note that some frameworks like gatsby render your jsx down into html before deploy, meaning that if you have a plain html file form definition in your deploy - it could be processed instead of the copy gatsby built.
This blog post describes a successful form built in a react app: https://www.netlify.com/blog/2017/07/20/how-to-integrate-netlifys-form-handling-in-a-react-app/
I missed the "name" attribute in input field.
Every input in the form must have a "name" attribute. Something like <input name="email" ...> or <textarea name="message" ...> is what you need.
Don't miss the "name" attribute for both parent and child layers
<form name="contact" method="POST" data-netlify="true">
<input type="text" placeholder="name" class="box" name="name">
<input type="email" placeholder="email" class="box" name="email">
<input type="text" placeholder="project" class="box" name="project">
<textarea name="message" id="" cols="30" rows="10" class="box message" placeholder="message"></textarea>
<div class="field">
<div data-netlify-recaptcha="true"></div>
</div>
<button type="submit" class="btn"> send <i class="fas fa-paper-plane"></i> </button>
</form>

Programmatically exclude ID of component to update (render/execute)

having some problems with developing custom components in JSF. I am building a component which wraps some javascript generated charts (javascript appends SVG elements to specified div). They have some animations by the time they render. When some part of chart is changed, there is made modification for only part of the chart by calling some .js scripts (whole chart is not rendered again). So, the rendered component looks some like this:
<div> <--- master container
<span id="clientId" />
<script> .js script for chart generation </script>
<div id="chart">
<svg>...</svg> <--- generated by script
</div>
</div>
When is ajax render invoked with ID of this component, there is only span updated (so chart won't rerender). I catch the call, generate some modification script and return them to the client. Everything is ok.
The problem: when is updated some other component or container which holds this component with chart, the div "chart" is rerendered. Is there any server side way, how to exclude component to be updated?
Thanks

sharepoint 2013 script editor webpart works in snippet preview but not on site

Good Evening. I am new to SharePoint 2013 and would like to put a basic web part on my site that is just a form to allow my users to do a google web search from our intranet page and the search results would open in a new tab or window.
I have the script inserted into a script editor web part, when Im in the edit snippet window the preview below my code appears and works as tested, but when I save the web part to my page when I try to search the page just refreshes and nothing is passed to google.
Here is the code in my script web part:
<script language="JavaScript" type="text/javascript">
function search_google(){
window.open("http://www.google.com/search?q="+document.search.query.value);
}
</script>
<form name="search">
<input type="text" name="query" value="">
<input type="submit" value="Search Google" onClick="search_google()">
</form>
Any help would be greatly appreciated.
I know this is an old post, but to those that stumble across it: the reason for the page refreshing behaviour is because of the input type of "submit" on the "Search Google" input element. Submit always causes a page refresh in SharePoint (causing your onClick event handler to be ignored) UNLESS the page is in edit mode.
An input type of "button" should give you the desired behaviour in either page mode.
HTH, Bruce

How can I split the django-haystack search form and the results

I want to have the search form of django-haystack on the base.html template of my blog but the results on a different template page how can I do that ?
Structure the form to submit the data to the correct URL,
<form action="/search/?q=">
<input type="text" name="q" id="id_q">
<button type="submit">Go</button>
</form>
So that code would live on the base.html page, and than submissions to it would post to the default '/search' page, the full search bar/options and results. I have this code in use on a pinax site with the default haystack install and it works.

Resources