YousefED / ElasticUI

AngularJS directives for Elasticsearch
http://www.elasticui.com
Other
526 stars 138 forks source link

Range widget #73

Open henninga opened 8 years ago

henninga commented 8 years ago

Hi

I'm struggling with creating a date range widget. I found this jsfiddle, http://jsfiddle.net/6cn7y/, but I'm quite new to angular and feel lost.

Could you perhaps point me in the right direction?

Perwein commented 7 years ago

Hi henniga,

just google datepicker for jquery.

add jquery to your code and this function: $(function() { $(".datepicker").datepicker({ showOn: "button", buttonImage: "http://icons.iconarchive.com/icons/paomedia/small-n-flat/1024/calendar-icon.png", buttonImageOnly: true, changeYear: true, changeMonth: true, changeDay: true, dateFormat: 'yy-mm-dd' }) });

and than add this two input fields:

`

                        </div>
                        <div class="col-md-2">
                            <input style="display:none;" class="control-label datepicker" type="Date" ng-model="highInput" />
                        </div>
                        <div class="col-md-2">
                            <div ng-click='query.enabled =! query.enabled' eui-query="ejs.RangeQuery('Created_at').gte(lowInput).lte(highInput)" eui-enabled="true" class="col-md-12 ifchecked">
                                <input type="checkbox" ng-click="eui-enabled='false'" />
                            </div>
                        </div>`

hope I was able to help!