Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Validation does not work. #31

Open
eash-veera opened this issue Jun 28, 2016 · 5 comments
Open

Validation does not work. #31

eash-veera opened this issue Jun 28, 2016 · 5 comments

Comments

@eash-veera
Copy link

Validation API does not function.

@iposton
Copy link

iposton commented Jun 30, 2016

I had the same problem. try adding name="files" to the directive. like this.

<form name="testForm">
  <lf-ng-md-file-input name="files" lf-maxcount="10" lf-filesize="1MB"></lf-ng-md-file-input>

the name="files" is used in the form error validation call.

<div ng-messages="testForm.files.$error" style="color:red;">

testForm is the name of the form <form name="testForm"> and files is the name of the directive inside the form. Chained together with $error

@eash-veera
Copy link
Author

eash-veera commented Jul 4, 2016

I tried this, but it does not work.
This is how the mark up look like, what am i missing ?

<lf-ng-md-file-input style="margin-bottom:50px;" name="files" lf-files="projectImage" lf-required lf-browse-label="Upload Image" lf-placeholder="Pick Image" lf-remove-label="Remove" lf-drag-and-drop-label="Drag and drop your project image here !" drag preview></lf-ng-md-file-input>
                                    <div ng-messages="projectDetails.files.$error" style="color:red;">
                                        <div ng-message="required">Please upload a project image.</div>
                                        <div ng-message="filesize">Image size too large.</div>
                                        <div ng-message="mimetype">This file is not accepted.</div>
                                    </div>

@iposton
Copy link

iposton commented Jul 4, 2016

<form name="testForm" layout="column" ng-submit="onSubmit()">
      <lf-ng-md-file-input name="files" lf-files="files05" lf-browse-label="Search" lf-remove-label="Delete" lf-drag-and-drop-label="Drag and Drop here!" lf-maxcount="1" lf-filesize="1MB" lf-totalsize="5MB" drag preview progress multiple type="file" fileread="" accept=".xls,.xlsx,.ods" multiple="false"></lf-ng-md-file-input>
      <div ng-messages="testForm.files.$error" style="color:red;">
          <div ng-message="maxcount">Too many files.</div>
          <div ng-message="filesize">File size too large.</div>
          <div ng-message="totalsize">Total size too large.</div>
          <div ng-message="mimetype">Mimetype error.</div>
      </div>

 <md-button class="md-raised md-button md-ink-ripple md-accent" type="submit" ng-disabled="testForm.$invalid">Submit</md-button> 
  </form>

make sure your form has a name to. and add the angular-messages module to your app.
In index.html

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.1/angular-messages.js"></script>

app.js

angular.module('myApp', [
    "lfNgMdFileInput",
    "ngMessages"
])

@mariusstaicu
Copy link

The upload does not update $dirty or $pristine or $touched fields for element. This way you're forced to show errros all the time on page, not only on submit or change.

@smurfyuen
Copy link

Any update on the set $pristine thing?????

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants