Form.io AngularJS Setting 'options' - angularjs

I am using form.io (angular JS) to create a form using a JSON object. Also using the 'wizard' mode.
This works well, but i just cant seem to understand how to set the options for the form.
Specifically the breadcrumbSettings.clickable setting, which i need to set to false.
I am creating the form in the HTML like this:
<formio form="formCtrl.formio" submission="submission" ></formio>
I tried setting the 'options' param in the html/JS/accessing the form object. Nothing works.
And i cant find a relevant example for setting the options object using angular js.
Anyone out there knows how to achieve this?
Thanks,
Guy

As per the documentation you have to pass formio-options attribute to the above formtag.
Documentation link: https://github.com/formio/ngFormio/wiki/Formio-Directive
example: <formio src="currentForm" formio-options="{skipQueue: true}"></formio>
You would have to pass json of options applicable to formio here in formio tag.
Here some more link from documentation from official repository: https://github.com/formio/help.form.io/blob/49f570dab40edc87234cc06f4dd833aa7aa03561/_paragraphs/developer/offline/offlineapi.md#request-options

Related

Bootstrap Typeahead Async - multiple values

Im trying to implement Bootstrap Typeahead in my AngularJS project and I came across an issue with values.
Im loading the content via $http from my Django API server. For now, I can lookup for any item I want and display it's name, but what I need is to display "title" but return "id" via ng-model back to the controller.
Do you have any working example of doing this?
http://pastebin.com/xtype9J4
I'm assuming you are using https://angular-ui.github.io/bootstrap/#/typeahead, so I'd suggest having a look at the last example.
Looking at the DOM, your code could look something like this:
uib-typeahead="company as company.name for company in getCompanies($viewValue)"
This pretty much contains exactly what you need. Additionally, take a look at https://docs.angularjs.org/api/ng/directive/select and https://docs.angularjs.org/api/ng/directive/ngOptions for further examples, as AngularUI has a similar (if not identical) approach.

React-select select menu list support html tag

I'm wondering if it's possible to enable html-tag support in react-select.
I'm using promise callback function to inject list of suggestion, and have added <em>tag into the results..
But there's no way to tell react-select consider it as html tag.
How to do that ?
You'll want to use the optionRenderer property for this, and define a custom method that returns your element. This can contain html.
See example of this in react-select documentation.
You should handle this as a string, and use Dangerously Set innerHTML to display it in your component.

Is $dirty, $pristine in AngularJS be used in forms only?

I am new to AngularJs and I know that I can use $dirty , $pristine, $ error in form validation. However is it necessary to explicitly create a form in
<form>..</form>
to use these properties ?
Hi since you are new to Angualar js nothing is better to start from the maker itself. As Sathish said AngularJsDocumentation is very good.
To answer your question is Yes you have to create a form explicitly because these are the properties of the form.
To understand the form better you can go to this link http://mrbool.com/the-concepts-of-angularjs-forms/29117
is it necessary to explicitly create a form
The answer to that is no.
While using a form tag is very helpful for creating sets of input tags to process as a whole (usually by sending to a server) it is not necessary for angular's purposes.
You can easily use the ng-form directive as an attribute on other tag types (not just form).
From the source code you can see that if you are using the form tag or ng-form as Element, Attribute or Class you will get the same behavior
restrict: isNgForm ? 'EAC' : 'E'
link

Manually set selectedObject in Angucomplete

how can we do that?
The problem is that ng-model is hard coded to searchStr and selectedObject is readonly.
Is there similar component for autocomplete for angular JS. Angucomplete is great because it can be connected with JSON response.
Solution
use angcomplete-alt, it has a lot of extra features and "initial-value" attribute.
Angucomplete is a component, in this you can set Initial value.
Please check below links for it.
http://ghiden.github.io/angucomplete-alt/
https://github.com/darylrowland/angucomplete

How to use AngularJS directive for WURFL img-wit with ng-src?

http://www.scientiamobile.com/page/angularwit
Want to be able to do something like this:
<img-wit ng-src="{{trustSrc(profile.pic)}}" w="100"/>
The picture isn't rendering however, although the blank space is sized correctly. Is it possible to use angular directive version of img-wit with ng-src?
UPDATE:
Determined the easiest way to use img-wit is not to implement angularjs directive at all. Instead, just append appropriate img-wit link prefix inside controller.
Support to ngSrc directive has been added in the 0.9.1 version: https://github.com/WURFL/angular-wurfl-image-tailor/releases/tag/0.9.1.
Syntax like the follow is now supported:
<img-wit ng-src="{{myUrl}}"></img-wit>
where {{myUrl}} is the url of the trusted image to load.
Please check https://github.com/WURFL/angular-wurfl-image-tailor#how-to-use-it for further details.
Disclaimer: I work for ScientiaMobile

Resources