md-autocomplete about angular-schema-form-material HOT 6 OPEN

Added basic functionality in fbf7bfc

from angular-schema-form-material.

Not sure if something changed, but I had to double escape the single quotes in md-items in the autocomplete.html file.

md-items="item in evalExpr('this[\\''+form.optionFilter+'\\'](\\''+searchText+'\\')')"

from angular-schema-form-material.

@brianpkelley it may have, which version of MD did you run with?

from angular-schema-form-material.

Angular 1.5.6
Angular Material 1.0.9
Angular Schema Form 0.8.13
Angular Schema Form Material current Develop branch

I also commented on #11 not sure if it notified you.

from angular-schema-form-material.

Disclaimer

Sorry for spamming code everywhere, I'd love to pull down a fresh copy but just don't have the time right now. Rushing to get a project out the door for work, so I'm posting these as notes for anyone with time or for when I get time to issue clean PR's

In the same vein as #18, md-autocomplete (and other fields that are of type object) pass null to the validator when empty. I may be wrong, and this is intended behavior, but this should be set to undefined like on empty strings, numbers etc.

    // Object fields (material - autocomplete ) will give a null value when we're looking for an object or undefined
    if (schema.type === 'object' && value === null) {
       value = undefined;
    }

I know this is still a work in progress, but I needed to make a few changes to the md-autocopmlete template to work with errors. Because the md-autocomplete directive creates it's own md-input-container sf-messages needs to be moved from the container div to the inner md-autocomplete as well as an option for md-required-match

    if ( args.form.schema.requireMatch ) {
        mdAutocompleteFrag.setAttribute('md-require-match', true);
    }

<div class="form-group {{::form.htmlClass ? form.htmlClass : 'flex-100'}} schema-form-select " sf-layout>
  <md-autocomplete flex
    sf-messages
    ng-class="{'has-error': hasError(), 'has-success': hasSuccess(), 'has-feedback': form.feedback !== false}"
    ng-disabled="form.readonly"
    ng-model="$$value$$"
    sf-autocomplete
    sf-field-model="replaceAll"
    sf-changed-auto-complete="form"
    schema-validate="form"
    md-selected-item="$$value$$"
    md-search-text="searchText"
    md-selected-item-change="'todo';"
    md-items="item in evalExpr('this[\\''+form.optionFilter+'\\'](\\''+searchText+'\\')')"
    md-item-text="item.name"
    md-floating-label="{{::form.title}}"
    md-menu-class="autocomplete-custom-template"
    >
    <md-item-template>
      <span md-highlight-text="searchText">{{item.name}}</span>
    </md-item-template>
    <md-not-found>
      No matches found
    </md-not-found>
  </md-autocomplete>
</div>

from angular-schema-form-material.

Thanks @brianpkelley back from holiday so I'll try to sort it out soon, yes autocomplete was the least finished of all the components, really hacked together for my own project at the time.

from angular-schema-form-material.