mcnull / angular-form-gen Goto Github PK
View Code? Open in Web Editor NEWDesign Bootstrap based form schemas for AngularJS in a drag and drop WYSIWYG environment.
License: MIT License
Design Bootstrap based form schemas for AngularJS in a drag and drop WYSIWYG environment.
License: MIT License
It´s not working with angular 1.3.6.
I got this error with chrome inspector :
Error: [$parse:syntax] Syntax Error: Token '/' not a primary expression at column 1 of the expression [//] starting at [//].
http://errors.angularjs.org/1.3.6/$parse/syntax?p0=%2F&p1=not%20a%20primary%20expression&p2=1&p3=%2F%2F&p4=%2F%2F
at http://localhost:3000/bower_components/angular/angular.js:63:12
at Parser.throwError (http://localhost:3000/bower_components/angular/angular.js:11964:11)
at Parser.primary (http://localhost:3000/bower_components/angular/angular.js:11942:12)
at Parser.unary (http://localhost:3000/bower_components/angular/angular.js:12224:19)
at Parser.multiplicative (http://localhost:3000/bower_components/angular/angular.js:12207:21)
at Parser.additive (http://localhost:3000/bower_components/angular/angular.js:12198:21)
at Parser.relational (http://localhost:3000/bower_components/angular/angular.js:12189:21)
at Parser.equality (http://localhost:3000/bower_components/angular/angular.js:12180:21)
at Parser.logicalAND (http://localhost:3000/bower_components/angular/angular.js:12171:21)
at Parser.logicalOR (http://localhost:3000/bower_components/angular/angular.js:12162:21) <textarea class="form-control ng-pristine ng-untouched ng-valid ng-scope" fg-field-input="" fg-placeholder="field.schema.placeholder" ng-model="form.data[field.schema.name]" id="{{ field.$_id }}" title="{{ field.schema.tooltip }}" tabindex="{{ tabIndex }}" ng-required="field.schema.validation.required" ng-minlength="{{ field.schema.validation.minlength }}" ng-maxlength="{{ field.schema.validation.maxlength }}" ng-pattern="/{{ field.schema.validation.pattern }}/">
Hi,
I am facing an issue with form-gen while trying to apply an existing schema.
I had stored the schema in my database to use it dynamically, but when I apply it doesn't work.
The scenario is:
I have used fg-tabs to show both Schema Editor and Preview.
When page loads and the schema is applied it doesn't work, but as soon as I switch the tab to Preview and come back to Editor it works and the form is rendered with my stored schema.
Please help me out to solve the issue, I checked everything and don't see anything missing or incorrect, the schema is also valid one that's why it works when the tab is switched. I hope there is no dependency with tabs, and it can also work isolated without tabs.
Please let me know if more information is needed, I can provide my implementation as well.
regards,
Rashid Ali
Senior developer
I'm using this angular extension module to allow users to add tabs, delete tabs and modify tab titles which where the problem relies to create something like a form wizard creation tool. Using ng-repeat and tracking an object by $index would properly apply the location of tabs in order, however, the title of the tab does not change but retrieves the name of the last indexed object property name.
The tabs start like this:
When pressing add new tab, this goes to a function and applies a new object to the array but the name does not change:
The section of the html file:
<div ng-repeat="schema in myForm.schema track by $index">
<div fg-tabs-pane="{{schema.name}}">
the ng-repeat picks up the new object from the scope as it has been changed and correctly applies the new tab, however, the name change does not seem to apply when inputting the object name within the fg-tabs-pane.
Hi every one,
i need to Add field to Palette edit schema !!
How i can do it !!!?
please ...
thanks for any help :)
$templateCache.put('angular-form-gen/edit/canvas/field/properties/properties.ng.html'
You have :
<div class="fg-field-properties">
<div novalidate="" ng-form="fieldPropertiesForm" <---- not closed, also missing closing tag
<div class="" fg-tabs="property.tabs">
<div ng-include="renderInfo.propertiesTemplateUrl"></div>
<div fg-tabs-pane="Debug" order="1000" auto-active="false">
<div data-jsonify="field"></div>
</div>
</div>
</div>
I assume it should be:
<div class="fg-field-properties">
<div novalidate="" ng-form="fieldPropertiesForm">
<div class="" fg-tabs="property.tabs">
<div ng-include="renderInfo.propertiesTemplateUrl"></div>
<div fg-tabs-pane="Debug" order="1000" auto-active="false">
<div data-jsonify="field"></div>
</div>
</div>
</div>
</div>
All my fields have 0 bottom margin and are directly on top of each other, like when you don't wrap your fields in bootstrap form-groups.
Any ideas? Thanks!
I have created many templates and controls.the Angular-form-gen.js is growing heavily.How to split them into two physical files and use it in the project?
Hi,
I would like to create an input link to the model "profil.name" but in the editor it's not allowed to have a dot in field's name.
why it is so? and how can I bypass this limitation
Thanks
How to add more customize property like initial value from another field or calculate initial value from the value of another fields value based on formula and if valve is changed in siblings fields Initial Value should re-calculated on blur or onchange. how to achieve this functionality ? i have attached an image too.
Is there any way where we can when we click a button on third tab, it shoud go to second tab
Wondering if there is a way to make the Field -> Name in the designer field properties a dropdown that can be populated with a predefined list of fields in a database table or make at the least make it readonly?
I'm having problems using the editor directive. I get the following errors:
Syntax Error: Token '/' not a primary expression at column 1 of the expression [//] starting at [//].
When I change the schema in the controller on certain action(say on Button click), the form rendered doesn't get updated. Shows the form for the old schema value
Hi is there a example on how to extend your angular-form-gen? I wanted to add capabilities to upload files tag?
Thanks
Mo
HI.
I have created a custom control using bootstrap datepicker.Iam able to display calender and save the value in DB.Iam able to get the value from the DB also.But iam not able to bind the date value from Database to datepicker
The source file (https://github.com/McNull/angular-form-gen/blob/master/src/angular-form-gen/angular-form-gen.js)
has a reference to add function at line 55. Do anyone know how to call this function while using the the generated form?
hi i want to use a custom directive(ngdialog ) in my preview page..
i want to inject the custom directive module as below
fg.controller('fgSchemaController', function ($scope, fgUtils, $rootScope, $filter, $controller, $http, ngDialog) {
var myApp = angular.module('myApp', ['fg', 'ngSanitize', 'markdown']);
var myData;
myApp.controller('MyController', function ($scope, mySchema, formService) {
formService.GetCountyForm('', '').then(function (d) {
myData = d.data[0].FormSchema;
schema = myData;
//alert(myData); Contains json from database
});
$scope.myForm = {
schema: myData
};
$scope.init = function (value) {
alert(myData);
$scope.testInput = myData;
}
});
myApp.value('mySchema',myData);
myApp.factory('formService', function ($http) {
var fac = {};
fac.GetCountyForm = function (stateCode, countyName) {
//alert($(".select4 :selected").text() + " " + countyName);
//replacing statecode with statename
return $http({
url: '/data/GetFormSchema',
method: 'POST',
data: JSON.stringify({stateCode: stateCode, countyName: countyName }),
headers: { 'content-type': 'application/json' }
});
}
return fac;
});
My Html looks like
<!-- Magic ends here -->
</fieldset>
@*<div ng-include="'form-status.html'"></div>*@
<div>
<button type="submit"
class="btn btn-primary"
ng-class="{ disabled: previewForm.$invalid }">
Submit
</button>
</div>
</form>
</div>
I am getting the json from database, but somehow not getting loaded for the form, I must be missing something, can you help me out with this? Thanks
Hi,
How can i add custom attributes into the fields and also i need to add div field. Could you please help me to do this.
Can you please create a add on for type-ahead? Thanks
This is not an issue in form gen, but any idea on how to convert the form genererated (with data) to pdf?
I have used this awesome repository extensively in our Project. We are moving to Angular 4, Is there any plan to upgrade it to Angular 4
is this maintained ?? as i see a lot of unanswered issues and no support for newer versions of angular and some bugs and no updates for 2 yers
can any one explain how to add dynamic css to the fields or field properties
Hello,
I would like to validate field value with http call.
Any idea ?
Thanks !!
Philippe
Well this is by far the best angular form building script i've seen (and i did some intensive research on that...)
Problem is - i cant find out how to use the source code (i need to tweak it somehow and if i use the distribution library all the templates are bundled in...)
So if someone is willing to help me out (it can be a paid job if necessary) - please contact me at:
[email protected]
How do I show the form in view format so users can view the submitted form data?
I am trying to go through your demo but I keep getting errors any help will be appreciated?
Thanks
Mo
How could I go about creating a "quick input", for example "FullName", that if the user dragged it over there would be two text boxes, one for first and last name?
Is it possible to have a kind of row that could contain 2 or 3 or N inputs inside it? Does form-gen have the concept of rows?
Here are the changes I made to upgrade to 1.3.13:
I. Change the interpolateFn property:
//1.3.13
var parts = interpolateFn.expressions;
//1.2.x
//var parts = interpolateFn.parts;
Per the docs:
$interpolate: due to 88c2193c, the function returned by $interpolate no longer has a .parts array set on it. Instead it has two arrays:
.expressions, -> an array of the expressions in the interpolated text. The expressions are parsed with $parse, with an extra layer converting them to strings when computed
.separators, -> an array of strings representing the separations between interpolations in the text. This array is always 1 item longer than the .expressions array for easy merging with it
II. Change the $templateCache's ng-pattern:
$templateCache.put
....
// 1.2.x
ng-pattern=\"/{{ field.schema.validation.pattern }}/\"
// 1.3.13
pattern="{{ field.schema.validation.pattern }}"
....
Note: I have not upgraded the code to reflect the new $validator for 1.3 form validation.
Hope this helps.
When initially loading a form with a Number field then the value of this field is not shown, while other fields do show their data. However after editing the field, the corresponding property is updated meaning the binding should be ok.
Currently the Framework is supporting each control per row and column.
I want to create a form with 3 controls in single row
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.