Range Query Example

[manateeit]

I am new to Elasticsearch as well as to ElasticUI. I have read the documentation on the range query and I am trying to add that to my application. I am stuck the correct syntax for the ejs. I tried to get to the website and it comes back with a forbidden. http://docs.fullscale.co/elasticjs/ is a suspended domain now.

I am trying to get the user to input two numbers, and then query a range in between those numbers. When I run this nothing happens. Before adding this to the page, it already uses singleselects and they work just fine .

Do i have the syntax correct? If so, is there something else i have to add to the page to make it take effect when the users enters the data like a submit button or something?

Here is my code:

<div class="row">
        <div class="col-md-4">
            <label>MeltRange Low</label>
        </div>
        <div class="col-md-4">
            <input type="number" eui-query="ejs.RangeQuery().field('material.mr1').gte(meltRangeLowInput)" ng-model="meltRangeLowInput"/>
        </div>
    </div>
    <div class="row">
        <div class="col-md-4">
            <label>MeltRange High</label>
        </div>
        <div class="col-md-4">
            <input type="number" eui-query="ejs.RangeQuery().field('material.mr1').lte(meltRangeHighInput)"
                   ng-model="meltRangeHighInput"/>
        </div>
    </div>
...

[manateeit]

I figured this out myself for anyone else that wants to know.

I had the syntax wrong and i didn't enable the query. Obviously there are several ways to do this, but this is how i solved it.

<div style="padding-top: 25px; padding-bottom: 25px;" class="row">
        <div class="col-md-2">
            <label>MeltRange Low</label>
        </div>
        <div class="col-md-1">
            <input class="control-label" type="number"  ng-model="meltRangeLowInput"/>
        </div>
        <div class=" col-md-3 col-md-push-2">
            <label>MeltRange High</label>
        </div>
        <div class="col-md-1 col-md-push-1">
            <input class="control-label" type="number"  ng-model="meltRangeHighInput"/>
        </div>
        <div style="padding-left: 25px" class="col-md-3 right">
            <div ng-click='query.enabled =! query.enabled'
                 eui-query="ejs.RangeQuery('material.mr1').gte(meltRangeLowInput).lte(meltRangeHighInput)" eui-enabled="true"
                 class="col-md-12">
                <button  class="btn btn-sm" ng-click="resetMeltRange()"> Reset</button>
            </div>
        </div>
    </div>

[YousefED]

Good to hear. We should be moving awayfrom elastic.js as it's not supported anymore

[manateeit]

what is the replacement?

[YousefED]

We should add support for regular ES JSON sytax

[molchwien]

Above solution actually replaces the current search query. For anyone still interested – here's my solution which adds the range as a filter.

<md-datepicker` md-max-date="(dateDbB)" md-placeholder="From date" ng-model="dateDbA"></md-datepicker>
<md-datepicker md-min-date="(dateDbA)" md-placeholder="To date" ng-model="dateDbB"></md-datepicker>
<div ng-click='filter.enabled =! filter.enabled' eui-filter="ejs.RangeFilter('timestamp_ms.date').gte(dateDbA).lte(dateDbB)" eui-enabled="filter.enabled=true"></div>