(Man oh man, thank you for the speedy response!) On Dec 19, 2013 1:04 AM, "Mauro Servienti" <[email protected]> wrote:
> We started from that and build a brand new one from scratch with support > for promises and tags-input. > It is not perfect at all and misses some features I've not yet found time > to add. > The source is here: http://radical.codeplex.com > > There is also a small sample app > > .m > > Sent from my Amazing Yellow Lumia, typos are guaranteed ;-) > ------------------------------ > From: Lowell Bander <[email protected]> > Sent: 19/12/2013 09.48 > To: [email protected] > Cc: [email protected] > Subject: [AngularJS] Re: Twitter bootstrap typeahead selection does not > update model > > any chance this has been u[dated? let me know! :D > > On Tuesday, February 19, 2013 12:28:44 PM UTC-8, Mike Brennan wrote: >> >> I used a combination of things from this thread to work out a solution >> for what I needed. In my case, I wanted the typeahead field to have the ID >> value of the item stored on the model as well. IE, I had a table and >> wanted people to perform application name lookups, but store the ID for >> that application on a different model field. I'm only posting to help >> anyone else who might be looking into this type of behavior. I didn't use >> the angular-ui directive as I didn't want the field to behave like a >> dropdown if you were tabbing across fields. >> >> This is the HTML: >> >> <tr ng-repeat="item in related_data.decrease" ng-class="{warning: >> item._action}"> >> <td> >> <input placeholder="account..." type="text" ng-model="item.account" >> typeahead="accountTypeaheadFunction()" parent="item" >> key-field="application_id" key-field-target="accountID" >> class="typeahead-query"> >> </td> >> </tr> >> >> This is the JS code in your controller: [note that I have a custom >> entity service, so you'd stick whatever you want in there to get the >> data...] >> >> $scope.accountTypeaheadFunction = function() { >> return { >> source: function (query, process, event) { >> $q.all([ >> Entity['applications'].query({application_name: '%' + query + '%'}).$q >> ]).then(function(results) { >> objects = []; >> map = {}; >> if( results[0].data.rows ) { >> $.each(results[0].data.rows, function (i, accountData) { >> map[accountData.application_name] = accountData; >> objects.push(accountData.application_name); >> }); >> } >> process(objects); >> }); >> } >> } >> }; >> >> >> Directive: >> configModule.directive('typeahead', function($q, Entity) { >> return { >> restrict: 'A', >> require: 'ngModel', >> link: function(scope, element, attrs, model) { >> >> // Defaults for all type aheads >> var defaults = { >> updater: function (item ) { >> return item; >> }, >> matcher: function (item) { >> if (item.toLowerCase().indexOf(this.query.trim().toLowerCase()) != -1) { >> return true; >> } >> }, >> sorter: function (items) { >> return items.sort(); >> }, >> highlighter: function (item) { >> var regex = new RegExp( '(' + this.query + ')', 'gi' ); >> return item.replace( regex, "<strong>$1</strong>" ); >> } >> }; >> // merge the defaults with the passed in source data function >> var combinedData = $.extend({}, defaults, scope.$eval(attrs.typeahead)); >> element.typeahead( combinedData); >> >> element.on('change', function() { >> if( attrs.hasOwnProperty('parent') ) { >> parent = scope.$eval(attrs.parent); >> if( map[element.val()] ) { >> parent[ attrs.keyFieldTarget ] = map[element.val()][ attrs.keyField ]; >> } else { >> parent[ attrs.keyFieldTarget ] = ""; >> } >> } >> // Update the model/view >> scope.$apply(function() { >> model.$setViewValue(element.val()); >> }); >> >> }); >> } >> }; >> }); >> >> >> >> >> -- > You received this message because you are subscribed to the Google Groups > "AngularJS" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To post to this group, send email to [email protected]. > Visit this group at http://groups.google.com/group/angular. > For more options, visit https://groups.google.com/groups/opt_out. > > -- > You received this message because you are subscribed to the Google Groups > "AngularJS" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To post to this group, send email to [email protected]. > Visit this group at http://groups.google.com/group/angular. > For more options, visit https://groups.google.com/groups/opt_out. > -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
