Dojo.toJson() method return "null" string - dojox.grid

Here we convert dijit.form.TextBox to json format using dojo.toJson. Without any input it returns "null" which we expect to be "".
Source code are as follows:
//aspx code
<input id="name" data-dojo-type="dijit.form.TextBox" data-dojo-props="name:'name'" />
<button id="submitButton" data-dojo-type="dijit.form.Button" type="button">
submit</button>
//js code
define("views/Test", [
"dojo",
"dojo/parser",
"dijit/form/Form",
"dijit/form/TextBox",
"dijit/form/Button"
], function () {
dojo.declare("views.Test", null, {
onSubmitClick: function () {
var jsonData = dojo.toJson(dijit.byId("name").get("value")); // here: dijit.byId("name").get("value") is "" and jsonData is ""null""
},
startup: function () {
dojo.connect(dijit.byId("submitButton"), "onClick", this, this.onSubmitClick);
}
});
return views.Test;
});
is there any difference between the following two? since the result is not the same at all
dojo.toJson("") // returns """"
dojo.toJson(dijit.byId("XXX").get("value")) //returns ""null""
Environment Info: IE 8
Dojo Version: 1.7

The output is not ""null"" the extreme first and extreme last quotes are placed by console.log these are "null" and ""
and Yes "" is an empty string which is a string object and is different from null.

Related

Getting and Inserting array of objects from checkboxes ReactJS

I am having a trouble where an array of Objects are returning [Object object]. What could be the missing fix to get the value of product from the mapped targeted values.
this is my sample array.
const product = [{food:'BREAD',price: 6}]
this is where I map the values and get the targeted value.
<Form >
{product.map((item, index) => (
<div key={index} className="mb-3">
<Form.Check
input value={[item]}
id={[item.food]}
type="checkbox"
label={`${item.food}`}
onClick={handleChangeCheckbox('PRODUCTS')}
/>
</div>
))}
</Form>
this handles the e.target.value from checked checkboxes.
const handleChangeCheckbox = input => event => {
var value = event.target.value;
var isChecked = event.target.checked;
setChecked(current =>
current.map(obj => {
if (obj.option === input) {
if(isChecked){
return {...obj, chosen: [...obj.chosen, value ] };
}else{
var newArr = obj.chosen;
var index = newArr.indexOf(event.target.value);
newArr.splice(index, 1); // 2nd parameter means remove one item only
return {...obj, chosen: newArr};
}
}
return obj;
}),
);
console.log(checked);
}
finally, this is where I am having problems. Chosen is returning [Object object]console.log(checked).
const [checked, setChecked] = useState([
{ option: 'PRODUCTS',
chosen: [],
}
]);
What do I insert inside chosen:[] to read the following arrays. Im expecting to see
0:
food: 'bread'
price: '6'
Thank you so much for helping me!
Html input value prop is a string, and it's change event target value is also string.
Here you are passing an object to the value prop, which will be stringified as [Object object].
Instead, update your change handler to take item instead of event.
const handleChangeCheckbox = (input) => (value) => {
setChecked((current) => {
// Value is checked if it exists in the current chosen array
const isChecked = current.chosen.find((item) => item.food === value.food) !== undefined;
// Remove it from state
if (isChecked) {
return {
...current,
chosen: current.chosen.filter((item) => item.food === value.food),
};
}
// Add it to state
return {
...current,
chosen: [...current, value],
};
});
};
Then update your input element onChange handler, to call your handler with the item itself, instead of the event.
onClick={() => handleChangeCheckbox('PRODUCTS', item)}
I don't know what the props for your component Form.Check are. But, I would expect an input type="checkbox" to have a checked prop.
A checkbox is checked if the item is in the chosen state array.
<Form>
{product.map((item, index) => (
<div key={item.food} className="mb-3">
<Form.Check
type="checkbox"
id={item.food}
label={item.food}
checked={checked.chosen.find((chosen) => chosen.food === item.food) !== undefined}
onClick={() => handleChangeCheckbox('PRODUCTS', item)}
/>
</div>
))}
</Form>
Hmm, don't you need to inline your handleChangeCheckbox function? As otherwise it's just getting executed. So instead onClick={handleChangeCheckbox('PRODUCTS')} do onClick={(event) => handleChangeCheckbox('PRODUCTS', event)}.
Then your handleChangeCheckbox function will start handleChangeCheckbox = (input, event) => {...}

Vue3/Jest - Line break problem during a test

I tried to simulate a mouseover in my test, but i have a problem when i use .contain in an expect. The test doesn't pass because of the page render.
Here the result of the test:
Expected substring: "<div id=\"title\"><!--v-if--></div>"
Received string: "<div id=\"title\">
<!--v-if-->
</div>"
Here my code:
describe('mouse event', function() {
test('over change', async (done) => {
const Component = defineComponent({
template: '<div id="title" #mouseover="hoveredIcon"><span v-if="hovered">Hello World</span></div>',
data() {
return {
hovered: false,
}
},
methods: {
hoveredIcon() {
this.hovered = true
},
}
})
const wrapper = mount(Component)
expect(wrapper.html()).toContain('"<div id=\"title\"><!--v-if--></div>"')
wrapper.find("#title").trigger("mouseover");
wrapper.vm.$nextTick( () => {
expect(wrapper.html()).toContain('<div id=\"title\"><span>Hello World!</span></div>')
done();
});
})
})
How can i get the received string on a single line? Or how to made the expect part in few line to match perfectly?
expect(wrapper.html()).toContain('<div id="title"><!--v-if--></div>')
to
expect(wrapper.html()).toContain('<div id="title">
<!--v-if-->
</div>')
Any better solutions?
Thanks for your help
One solution found was to use directly \n directly in the value expected.
expect(wrapper.html()).toContain('\n \n')

How to change React text area value

I have a list that takes values from server and i want that whenever an item of the list gets clicked it will change a textarea text to the appropriate variable on the list,
I am getting the user using redux:
function ProfilePage() {
const dispatch = useDispatch();
const authObj = useSelector(state => state.auth);
const { user, token, expiredAt } = authObj;
I am generating the list like this:
<ul className="SentencesList">
{
user.approvedPatterns.map((el, i) => (
<div key={i}>
<li>{el.name || ''}</li>
<hr className="profilePageSentenceListHr" />
</div>
))
}
</ul>
And what i want is that when a li on the list get clicked i will take the appropriate value in the JSON object and show i
<textarea rows="5" cols="60" className="centerPageLargeInputBox" type="text" />
The JSON list looks like that:
const userList = [
{
_id: "1",
username: "****",
password: "*",
approvedPatterns:[
{
"name":"title 1",
"text":"some text"
},
{
"name":"title 2",
"text":"some text1"
},
{
"name":"title 3",
"text":"some text 2"
}
]
}
]
How can i accomplish that?
I am really lost.
I have created the demo here: https://stackblitz.com/edit/react-f5q3n8?file=src/App.js
So when anyone clicks on the li, the textarea will show the value of that li's text property.

IE automation - Excel Vba can't save value when click save button

I am trying to do IE Automation through Excel VBA code.
I have a web page which has cells to add value. I need to change values in these cells by code vba excel
example:
Now cells in webpage has value : "11_now test"
My code vba excel:
ie.Document.getelementbyid("mx7125[R:0"]").Value = "Good" ' value i want to set
When run vba , webpage show value at cell is "Good" but when i click save button, the value at cell is "11_now_test"
HTML code is as below:
<input aria-labelledby="" id="mx7125[R:0]" class="fld text tt" ctype="textbox" li="mx7126[R:0]" db="mx5134" maxlength="200" style=";width:300px;" ontr='true' async='1' ae="setvalue" type="text" title="Remark: 11_now_test" value="11_now_test" ov="11_now_test" work="1" fldInfo='{"length":"200","inttype":"0"}'/></div><div aria-live="polite" id="mx7126[R:0]_holder" class="bc"><img sf="1" aria-hidden="true" active="0" ctype="image" alt="" src="../webclient/skins/skins-20171010-1330/tivoli09/images/blank.gif" source="blank" imgtype=".gif" style="display:inline;margin:0px;" border="0" lc="mx7125[R:0]" align="absmiddle" width='0px' height='26px' id="mx7126[R:0]" title=""/></div></td>
* More information*
Dear bros
when i press F12 to inspector on webpage. If click to change value on webpage, html code at this time is:
<input aria-labelledby="" id="mx7125[R:0]" class="fld text tt" ctype="textbox" li="mx7126[R:0]" db="mx5134" maxlength="200" style=";width:300px;" ontr="true" async="1" ae="setvalue" type="text" title="Remark: 11 Nov test" value="11 Nov test" ov="11 Nov test" work="1" fldinfo="{"length":"200","inttype":"0"}" originalvalue="11 Nov test" prekeyvalue="good" stoptcclick="true" keydown="false" changed_by_user="true" changed="true">
When type value " Good" to input cell on webpage ,prekeyvalue ="Good" and keydown will turn "True" then keydown back to "false"
* Javascrip at input cell *
when click to change value at input cell i found javascrip :
function tb_(eventOrComponent)
{
eventOrComponent = (eventOrComponent) ? eventOrComponent : ((window.event) ? window.event : "");
var eventType = eventOrComponent.type;
var textbox = this;
if(undef(eventType) || eventType=="text") {
eventType = "init";
textbox = eventOrComponent;
}
if(DESIGNMODE)
return;
var ro = textbox.readOnly;
var exc=(textbox.getAttribute("exc")=="1");
switch(eventType)
{
case "init":
setPromptValue(textbox.id);
break;
case "mousedown":
if(getFocusId()==this.id)
this.setAttribute("stoptcclick","true");
break;
case "mouseup":
if (isIE() && !hasFocus(this))
{
this.focus();
}
if (isBidiEnabled)
{
adjustCaret(eventOrComponent, this);
}
break;
case "blur":
input_onblur(eventOrComponent,this);
if (isBidiEnabled)
input_bidi_onblur(eventOrComponent, this);
break;
case "change":
if(!ro)
input_changed(eventOrComponent,this);
break;
case "click":
if(overError(eventOrComponent,this))
showFieldError(eventOrComponent,this,true);
var liclick=this.getAttribute("liclick");
var li=this.getAttribute("li");
if(li!="" && liclick=="1")
{
frontEndEvent(getElement(li),'click');
}
if(this.getAttribute("stoptcclick")=="true")
{
eventOrComponent.cancelBubble=true;
}
this.setAttribute("stoptcclick","false");
break;
case "focus":
input_onfocus(eventOrComponent,this);
if (isBidiEnabled)
input_bidi_onfocus(eventOrComponent, this);
this.select();
this.setAttribute("prekeyvalue",this.value);
break;
case "keydown":
this.setAttribute("keydown","true");
if(!ro)
{
lastKeyPress = eventOrComponent.keyCode;
if(eventOrComponent.ctrlKey && hasKeyCode(eventOrComponent,'KEYCODE_SPACEBAR')) {
stopBubble(eventOrComponent);
eventOrComponent.cancelBubble=true;
eventOrComponent.returnValue=false;
break;
}
if(isBidiEnabled)
processBackspaceDelete(eventOrComponent,this);
if(hasKeyCode(eventOrComponent, 'KEYCODE_DELETE') || hasKeyCode(eventOrComponent, 'KEYCODE_BACKSPACE'))
{
getHiddenForm().elements.namedItem("changedcomponentvalue").value = this.value;
}
if((hasKeyCode(eventOrComponent, 'KEYCODE_TAB') || hasKeyCode(eventOrComponent, 'KEYCODE_ESC')))
{
var taMatch = dojo.attr(this, "ta_match");
if(taMatch) {
if(taMatch.toLowerCase().indexOf(this.value.toLowerCase()) == 0)
{
console.log("tamatch="+taMatch);
this.value = taMatch;
input_keydown(eventOrComponent, this);
dojo.attr(this, {"prekeyvalue" : ""});
input_forceChanged(this);
inputchanged = false;
return; // don't want to do input_keydown again so preKeyValue will work
}
}
if(this.getAttribute("PopupType"))
{
var popup = dijit.byId(dojohelper.getPopupId(this));
if (popup)
{
dojohelper.closePickerPopup(popup);
if(hasKeyCode(eventOrComponent, 'KEYCODE_ESC'))
{
if (eventOrComponent.preventDefault)
{
eventOrComponent.preventDefault();
}
else
{
eventOrComponent.returnValue = false;
}
return;
}
}
}
}
input_keydown(eventOrComponent,this);
datespin(eventOrComponent,this);
}
else if(hasKeyCode(eventOrComponent,'KEYCODE_ENTER') || (hasKeyCode(eventOrComponent,'KEYCODE_DOWN_ARROW') && this.getAttribute("liclick")))
{
var lbId = this.getAttribute("li");
frontEndEvent(getElement(lbId), 'click');
}
else if(hasKeyCode(eventOrComponent,KEYCODE_BACKSPACE))
{
eventOrComponent.cancelBubble=true;
eventOrComponent.returnValue=false;
}
break;
case "keypress":
if(!ro)
{
lastKeyPress = eventOrComponent.keyCode;
if(eventOrComponent.ctrlKey==false && hasKeyCode(eventOrComponent,'KEYCODE_ENTER'))
{
var db = this.getAttribute("db");
if(db && db!="")
{
input_forceChanged(this);
sendClick(db);
// IV32363 - When default button is a new row button, then we must set focus on
// the button or the value in text box will be copied to the new row
if (db)
{
window.setTimeout("focusElement(document.getElementById('"+db+"'))", 10);
}
}
}
}
break;
case "keyup":
var keyDown = this.getAttribute("keydown");
this.setAttribute("keydown","false");
if(eventOrComponent.ctrlKey && hasKeyCode(eventOrComponent,'KEYCODE_SPACEBAR'))
{
if(showFieldError(eventOrComponent,this,true))
{
return;
}
else
{
menus.typeAhead(this,0);
}
}
if(!ro)
{
if(isBidiEnabled)
processBidiKeys(eventOrComponent,this);
numericcheck(eventOrComponent,this);
var min = this.getAttribute("min");
var max = this.getAttribute("max");
if(min && max && min!="NONE" || max!="NONE")
{
if(min!="NONE" && parseInt(this.value)<parseInt(min))
{
this.value=min;
getHiddenForm().elements.namedItem("changedcomponentvalue").value = this.value;
this.select();
return false;
}
if(max!="NONE" && parseInt(this.value)>parseInt(max))
{
this.value=max;
getHiddenForm().elements.namedItem("changedcomponentvalue").value = this.value;
this.select();
return false;
}
}
var defaultButton = false;
if(eventOrComponent.ctrlKey==false && hasKeyCode(eventOrComponent,'KEYCODE_ENTER'))
{
var db = this.getAttribute("db");
if(db && db!="")
{
defaultButton=true;
}
}
input_changed(eventOrComponent,this);
}
else
{
setFocusId(eventOrComponent,this);
}
if(showFieldHelp(eventOrComponent, this))
{
return;
}
if(keyDown=="true" && hasKeyCode(eventOrComponent, 'KEYCODE_ENTER') && !eventOrComponent.ctrlKey && !eventOrComponent.altKey)
{
menus.typeAhead(this,0);
return;
}
if(!hasKeyCode(eventOrComponent, 'KEYCODE_ENTER|KEYCODE_SHIFT|KEYCODE_CTRL|KEYCODE_ESC|KEYCODE_ALT|KEYCODE_TAB|KEYCODE_END|KEYCODE_HOME|KEYCODE_RIGHT_ARROW|KEYCODE_LEFT_ARROW')
&& !eventOrComponent.ctrlKey && !eventOrComponent.altKey)
{
menus.typeAhead(this,0);
}
break;
case "mousemove":
overError(eventOrComponent,this);
break;
case "drop":
input_onfocus(eventOrComponent,this);
if (isBidiEnabled)
{
input_bidi_onfocus(eventOrComponent, this);
}
this.select();
if(!ro)
{
this.setAttribute("prekeyvalue",this.value);
}
case "cut":
case "paste":
if(!ro)
{
var fldInfo = this.getAttribute("fldInfo");
if(fldInfo)
{
fldInfo = dojo.fromJson(fldInfo);
if(!fldInfo.query || fldInfo.query!=true)
{
setButtonEnabled(saveButton,true);
}
}
window.setTimeout("inputchanged=true;input_forceChanged(dojo.byId('"+this.id+"'));", 20);
}
break;
}
}
* HIDDEN FORM *
Dear #Zhi Lv - MSFT ! i tried sendkeys method but not success! i found the same problem at this link. Extractly that i want to change value in maximo website, has hiddenform but at that linked they use javascript, don't use IE automation vba excel.When i inspect at input cells and type document.getelementbyid("hiddenform") , found this hiddenform:
<form aria-hidden="true" id="hiddenform" name="hiddenform" method="POST" action="http://maximo.mysite.com/maximo/ui/maximo.jsp" style="padding:3px;">
<input type="text" size="45" name="event" id="event" title="event type"><br>
<input type="text" size="45" name="targetid" id="targetid" title="target id"><br>
<input type="hidden" size="45" name="value" id="value" value=""><!-- this must be type hidden to support \n in the value -->
<input type="text" size="45" name="changedcomponentid" id="changedcomponentid" title="changed component id"><br>
<input type="text" size="45" name="vischangedcomponentvalue" id="vischangedcomponentvalue" title="changed component value"><br>
<input type="hidden" name="changedcomponentvalue" value="">
<input type="text" size="45" name="currentfocus" id="currentfocus" title="focus id"><br>
<input name="scrollleftpos" id="scrollleftpos" size="45" title="Scroll Left"><br>
<input name="scrolltoppos" id="scrolltoppos" size="45" title="Scroll Top"><br>
<input type="text" size="45" name="uisessionid" id="uisessionid" value="4770" class="fld_ro" readonly="readonly" title="ui session id"><br>
<input type="text" size="45" name="csrftokenholder" id="csrftokenholder" value="ocvdjoiuq2ht8detn26pkjeekg" title="CSRF Token" readonly="readonly" class="fld_ro"><br>
</form>
thanks!!!
How do you get the input text value when click the save button? I have created a sample using the following code, it works well on my side. Please refer to it.
IE.Document.getelementbyid("mx7125[R:0]").Value = "Good"
And web page resource as below (using javascript script get the value document.getElementById('mx7125[R:0]').value):
<div>
<input aria-labelledby="" id="mx7125[R:0]" class="fld text tt" ctype="textbox" li="mx7126[R:0]"
db="mx5134" maxlength="200" style="width:300px;" ontr='true' async='1' ae="setvalue" type="text"
title="Remark: 11_now_test" value="11_now_test" ov="11_now_test" work="1" fldInfo='{"length":"200","inttype":"0"}' />
</div>
<div aria-live="polite" id="mx7126[R:0]_holder" class="bc">
<img sf="1" aria-hidden="true" active="0" ctype="image" alt="" src="../webclient/skins/skins-20171010-1330/tivoli09/images/blank.gif" source="blank" imgtype=".gif"
style="display:inline;margin:0px;" border="0" lc="mx7125[R:0]" align="absmiddle" width='0px' height='26px' id="mx7126[R:0]" title="" /></div>
<input id="btnSubmit" type="button" value="Submit" onclick="Javascript: alert(document.getElementById('mx7125[R:0]').value);" />
If still not working, please post the related code about the save button.
I'am sure there are events to the input fields. Like onChange(), onFocus(), onBlur() and/ or others. You can find out it if you press F12 on the tab with the opened page. Track through the tree of the DOM Inspector. In the row with your code snippet will be a button with the caption "event" at end of line. With a click on the button you can see which events there are.
In the past it was possible to trigger an event with fireEvent(). Another way is dispatchEvent() with some other methods like initEvent().
The words between [] are "outdated" ;-)
[What ever I tryed in the past, nothing worked. So I can't tell how you can solve your problem but I' am sure it is an event problem.]
This link shows you how it should work:
Vba, HTMLSelect: FireEvent OnChange or DispatchEvent
The words between [[]] are not relevant for IE11
[[Another more modern way is *addEventListener()*. But I don't know with which method the IE11 is working:
EventTarget.addEventListener()
The problem for me with *addEventListener()* is, the IE has not eventTarget() Constructer (see browser compatibility table at the bottom of the page):
EventTarget()]]
Edit 1:
In IE11 it works with dispatchEvent() and the other relevant things. You must place all commands in an own method. Two examples:
For onChange() use:
Private Sub Event_onChange(htmlDocument As Object, htmlElementWithEvent As Object)
Dim Event_onChange As Object
htmlElementWithEvent.Focus
Set Event_onChange = htmlDocument.createEvent("HTMLEvents")
Event_onChange.initEvent "change", True, False
htmlElementWithEvent.dispatchEvent Event_onChange
End Sub
For onKeyDown() use :
Private Sub Event_onKeyDown(htmlDocument As Object, htmlElementWithEvent As Object)
Dim Event_onKeyDown As Object
htmlElementWithEvent.Focus
Set Event_onKeyDown = htmlDocument.createEvent("HTMLEvents")
Event_onKeyDown.initEvent "onkeydown", True, False
htmlElementWithEvent.dispatchEvent Event_onKeyDown
End Sub
I know that now because we disscuss this right now in a german forum. The solution with the own sub() is from the user Anton (not involved in the discussion). With Antons sub() I figure out right now how the German Post will let a macro insert adresses in an order blank.
The german discussion:
Webformular (DHL) ausfüllen
Or after one week in the archive:
Webformular (DHL) ausfüllen (archive thread)
Edit 2:
I think you must trigger the onKeyDown event. Try the following:
Dim nodeInput As Object
Set nodeInput = ie.Document.getelementbyid("mx7125[R:0]")
Call TriggerEvent(ie.Document, nodeInput, "onKeyDown")
nodeInput.Value = "Good"
Here is the function to trigger an event like QHarr wrote in the comments with the event type as third function parameter:
Private Sub TriggerEvent(htmlDocument As Object, htmlElementWithEvent As Object, eventType As String)
Dim theEvent As Object
htmlElementWithEvent.Focus
Set theEvent = htmlDocument.createEvent("HTMLEvents")
theEvent.initEvent eventType, True, False
htmlElementWithEvent.dispatchEvent theEvent
End Sub
In the above linked german forum the Deutsche Post form works now with this function. But it is necessary to put in all values two times.
We don't know anything about your page. The url seems to be a secret. If you need more help we need more infos.

How can I pass External date filters Inside the Embedded HTML Page

How can I pass External date filters(Like start and end date), inside the custom HTML Page so that report gets rendered when I pass those values and clicks on submit I have the below HTML Page which gives a embedded report but I am trying to work those input box's how can I do this?
Is this possible or still present inside the ideas tab? Please guide my on it as How should I achieve this?
My HTML Code:-
<html>
<body>
<h2>PowerBI Embedded Report</h2>
<form action="/action_page.php">
<input type="text" name="sdate" placeholder="Start Date"><br>
<input type="text" name="edate" placeholder="End Date"><br>
<input type="submit" value="Submit">
</form>
<script type="text/javascript">
window.onload = function () {
var models = window['powerbi-client'].models;
var embedConfiguration = {
type: 'report',
accessToken: 'H4sIAAAAAAAEAC2Wx8rGDHaD7-XfOuDeArNw7717Z7_uvbeQe88XZvaCA8-RhP7nHzt7hzkr_vnvf0wUrmKBLexiTDSgmbSBLCFMqVC6-C2i2HSVSJG9OiWtTMjFe-ozi5tfZwsJuH3jRKiWsWGkrJ8kTbfMnVzTj4OKVV9RRz7RZpAwcm40K-EEJQtxbTXppsVoOEkOSnS_vLLEuOgmXJVLj4Z-mVWAoP93FnZcFOOtt5qIhUr68Ey7OjCNk9kjWIJuF8XvESV5RlTJrqiIQtVCcgDiEb6EZby7zRKpFpnIK4_icXPfZt60foH2YSNBtQHYQHrcyRxfpC3FbPcJAwu4H4TQVbtU9FxatuKrgxj7wIgscp_S4lV0XD6zRZ4sXnvbMjhKCFzNVVBFK3Z_3GXY-2idfi7HrvPNC2H1ZnaK-spl4-ZBAuZkahc_n4VMyc9TXfrH41G0YMZ8jA4gPpXGD_A2INi7u4ryh2dTI7IGQLcGVJ5d5XE-vCah0-A992s4Z79skvXXUDmrrsFOQtMAaL38AxqJyYujTXRPVXcW1Lp5UbeqbHGo1214b0TanpkhAdVL9DKEcRwYorfZQuSYqBfifFNzEcaDEj7plWpfEsIjLUPKYCgKpTj8XUiXgPnbbh9aQcZj9A8bXVVJ7T66yq0w6yBK4Y4bbgAUdBsvQEAlwnbhlnfHJFQpEbfnI2ai27xv7wCbJQmPk1RjKAuNW4kyInXvyrlDqEGdWTXIBYrsNWRQzW4VHYaUwTVc2pJ1ca4REmG1XqEgUIqbVY5ZKp0qsiRlSlH_gJiKbOuSDwF-QB7rz1uqc0aB3SJYy1-a8aB7WAnikHqm_1RI2mUvd-P1jLAMNgUIED93o4J1VMNzrPxCZCf2sVMxVxKRG7JmpcW2Z6F-TUlNQXijBdfjIedowwqqvZxxrjHX1xadvDBfG8jvYw_7PDjNBmjXiuI15sW0p-Plb8FS7FY-6vP6bPpMX2xnUWdMF_MFpfEeRRFshol_oHYd5LUSN5FOKicqD46h_kXUPRjPjCbjpD9b3G2lQ2IDEDtHCcd98HyycVCoj1CWd2FHtJMl3y47dZtejF6L9csgg4yJXL_91EQ9nh51IQzVRNTH1CK71jH-IXKkyaMfDrS0xL_lJ4s-bgPr6Uc82FjDdxcCa1sz-Vu_2-iKCEGlN0kJ-GRsgqT2oF_fDQ3WH-xY8-LpISOWs63iuCQ85_o6-l1aY-tjOnyfNIhZzSQuFk7k1bNdLQYIvBae4aBEoGLuMeLzibLWgXL8UoIfgrAJdWPqI1AQs4w1StLipBo6UtvtAqVU6YSqrV8PoLL3zWY5po7RbmibofrbcFH3c5r-U1cS-PqnK9e7p1g9xr4iouek8_m7ZBsYdOcm9fNPnjbRjB1fystufOkjdG8TCAK3SYziSLWejh8mFWg8dhDQfBu8aAKXKxxgO5XOSwLIabNBpvyA_UpKMk_vUWLt4YYkT1HHqbvXW9bxWak6gtCgu5jRCt0tZAcBBge1H1iYip9ZGonoVKjql50clPxVD5JD5UCcUcsfJygcCRC8lc_nJpJpYykXltkwQdg29Ayaw4z9mTcrVMOUlUECcz_x5I99NUwpVwHOxkYlaD37Yo1M1OcMC4DoBnQZQXOXj_6nB1bvsCUK_IGX9FLn0zAM2fvGnAVGDpnMVKA_s_QkHuP-kS1Jh6i95Qi2Ef-fU3KWUJdTgvqrsM_yUubWGyMmY1v7NZ9ghRzn1fVzIAgooVqc4Ioi-SNYTyJNe-rm8uNE204qSw18D_74YIdLncOKQCiztDsRVR3SoaGkZCRKcvJvOiyixD7bI8EKuViPe3oaCS6X9MmlwRFgIPn2AzG5_DPP44wRMsLMlazx3MRWy7x0RFKnPXl_8XJmxtn0GXhkJk6n6Vx3YJeIzgPWvGn9bMn-fhA_HPO4XB-QwBQHZmRfpT7RMtfnSNFy_mnyJMs64j0KnnPRNOU_qFPTseR3VOK5nNFcwrMEAG37QgLcBeKLDfHeKzRY3nkif93uIaaXfdm1c2sicAPO6i6OQVpNppoU9_uv3t5X82YX0qFquk1Mhh1cckAjq9HVAl5DG0G9CQ4i0WOEwvbmgqIPXZdKbjaXctwnuS11dGl_sfxtSCR9oi7Ov9LS-de__vmvf7jtXY5ZK9-_maCHuhkdZADin0C4F0AXWt7AnERSEfneiU5xz_3M3pwPObY0x1WEezH2b_iL6FJiCHuX8hpqqOt74FCd00p7KK8e-d3iy-svelX5oJ8_R8HPKlHSELHCEP_y06NU0wsZM7V-oJxb3rttIOjlKy3VqZw5IFiUitUKYECjTEH2cKCicPt57De29lKSi0LGjoFAQbj2wQu8HZ8jh1MLAda_OwarS8bYACiFKT6fmJ0JpHnT0nLFWqIQN6xHvCZOTm4Y_4Hxj03_1oQZcmDgSZs1Iqz9ANESlLYkDtOMjMvrzrBC8c1qCLmWa4nJI4ldKIp7oPwrdrTGEuaiYi8WODETWCqq_QfzuzTlpoR_lMXoMToQpp6Y75VyYpir6Zx_q7y2nrLj3Mo_WVn8mGR68N4UIbiemwf7WzE5BXNkUiFc0_ayqynxmcbVT7SERI5Q7ew7GfPXom9z0GZBvgVFY8Jl2wBy1oJx5dh7O1yBNZU7yvURaM7GCqJSl99qZOUo04LrPfGcsuEND9SDykxfvpQFbPel7RBlFgsdLdOz-YhcqxHKtEEYZcIfMLDpI9h1b7Dx8TQ5bLr-2nkfhfPgzHXHd2goAFT1B6Uhf0zWcvUUkZ43_5w5ZfaFyfm9dO7k7COMT5sbuZguvkNLdHMwS6qVWXKjBktgbmbyzE2u3lAmMwN88YDl-mCCz5upiqPkCGSOu7Lmi0Q5YP1m98f3h06UeweqzeumWVB1_Yf5f_8PAgjN0hoLAAA=',
id: 'cd0cbb78-41ca-4db1-b739-e982f59694a2',
tokenType: models.TokenType.Embed,
embedUrl: 'https://app.powerbi.com/reportEmbed?reportId=cd0cbb78-41ca-4db1-b739-e982f59694a2&groupId=a78aa4c1-fa2f-4e4d-b21e-3d47bb89618e'
};
var report;
var $reportContainer = $('#reportContainer');
report= powerbi.embed($reportContainer.get(0), embedConfiguration);
var Filter1 = {
$schema: "http://powerbi.com/product/schema#advanced",
target: {
table: "reporting_validation_agg_group",
column: "aggregation_end_date_local_1"
},
logicalOperator: "AND",
conditions: [
{
operator: "LessThanOrEqual",
value: "12/20/2017"
}
]
}
var Filter2 = {
$schema: "http://powerbi.com/product/schema#advanced",
target: {
table: "reporting_validation_agg_group",
column: "aggregation_end_date_local_1"
},
logicalOperator: "AND",
conditions: [
{
operator: "GreaterThan",
value: "12/10/2017"
}
]
}
report.on('loaded', event => {
report.getFilters()
.then(filters => {
filters.push(Filter1);
filters.push(Filter2);
return report.setFilters(filters);
});
});
}
function reloadreport(){
var $reportContainer = $('#reportContainer');
powerbi.embedNew($reportContainer.get(0), embedConfiguration);
};
</script>
<script src="jquery.js"></script>
<script src="es6-promise.js"></script>
<script src="powerbi.js"></script>
<div id="reportContainer"></div>
</body>
</html>
See if this solution helps you too:
https://community.powerbi.com/t5/Desktop/Power-BI-JavaScript-filter-between-2-dates/td-p/312204
Basically, you define an ADVANCED filter with the 'AND' operator referring to the intersection of the 2 dates.
You would, however, need to parse your input text (or datepicker) to the format required by the filter..
Please note that you can define the filters as part of the loadConfig by using the property filters: [filter1, filter2] as well..

Resources