Can we call watch expliciltly in the controller?
Requirements:
Currently there are two angular tree structured checkboxes. one is carriergorup and another one is modes. I'm retrieving mode values based on carriergroup list. whenever the carrier group list is updated automatically modes list is updated for this i used watch.
current functionality is like.
Whenever the carriergroup list is updated then only modes list is updated. Suppose there is no change in the carrier group list, but I want to make a call for watch explicitly. Is this possible?
$scope.$watch(
'carrierGroups',
function(carrierGroups) {
alert("in carrier List");
$scope.selectedCarrierList = [];
$scope.isAllChecked = true;
for (var i = 0; i < $scope.carrierGroups.length; i++) {
/*if($scope.carrierGroups[i].checked){
cntGroupChecked = cntGroupChecked + 1;
}*/
for (var j = 0; j < $scope.carrierGroups[i].categories.length; j++) {
if ($scope.carrierGroups[i].categories[j].checked) {
$scope.selectedCarrierList
.push($scope.carrierGroups[i].categories[j]);
}else{
$scope.carrierGroups[i].checked = false;
$scope.isAllChecked = false;
}
}
}
alert("$scope.isModesWatch"+$scope.isModesWatch);
if($scope.isModesWatch){
$scope.modesList = DashboardsDataService.getModesData($scope.selectedCarrierList);
}else{
alert("$scope.filterModesList-->"+JSON.stringify($scope.filterModesList));
$scope.modesList = $scope.filterModesList;
$scope.isModesWatch = true;
}
},
true);
Like below, you can do this..
var myCustomFun = function(carrierGroups) {
alert("in carrier List");
$scope.selectedCarrierList = [];
$scope.isAllChecked = true;
for (var i = 0; i < $scope.carrierGroups.length; i++) {
/*if($scope.carrierGroups[i].checked){
cntGroupChecked = cntGroupChecked + 1;
}*/
for (var j = 0; j < $scope.carrierGroups[i].categories.length; j++) {
if ($scope.carrierGroups[i].categories[j].checked) {
$scope.selectedCarrierList
.push($scope.carrierGroups[i].categories[j]);
}else{
$scope.carrierGroups[i].checked = false;
$scope.isAllChecked = false;
}
}
}
alert("$scope.isModesWatch"+$scope.isModesWatch);
if($scope.isModesWatch){
$scope.modesList = DashboardsDataService.getModesData($scope.selectedCarrierList);
}else{
alert("$scope.filterModesList-->"+JSON.stringify($scope.filterModesList));
$scope.modesList = $scope.filterModesList;
$scope.isModesWatch = true;
}
}
$scope.$watch('carrierGroups',myCustomFun,true);
Now where you want to call custom watch function, you can simply call your function.
myCustomFun(param);
Related
I know there are a few of these questions already on here but I've tried and none of them work unfortunately.
Any help would be much appreciated! All I want is to be able to collapse the other panels when another is opened.
Here is my current js script:
var acc = document.getElementsByClassName("accordion");
var i;
for (i = 0; i < acc.length; i++) {
acc[i].addEventListener("click", function() {
this.classList.toggle("active1");
var panel = this.nextElementSibling;
if (panel.style.maxHeight){
panel.style.maxHeight = null;
} else {
panel.style.maxHeight = panel.scrollHeight + "px";
}
});
}
Without more details I cannot be sure that this would work, but including a loop through all your accordions and doing the opposite of how you open them should do the trick. If you want more help, an example of the CSS and HTML would be necessary.
var acc = document.getElementsByClassName("accordion");
var i;
for (i = 0; i < acc.length; i++) {
acc[i].addEventListener("click", function() {
for (i = 0; i < acc.length; i++) {
acc[i].classList.remove('active1');
var panel = acc[i].nextElementSibling;
if (panel.style.maxHeight){
panel.style.maxHeight = panel.scrollHeight + "px";
} else {
panel.style.maxHeight = null;
}
}
this.classList.add("active1");
var panel = this.nextElementSibling;
if (panel.style.maxHeight){
panel.style.maxHeight = null;
} else {
panel.style.maxHeight = panel.scrollHeight + "px";
}
});
}
I have an api 'rest/latest/testruns/16543558' the id is test run ids. I want to update a call with different ids in one shot . I have tried with $promise.all(). Its working fine if I give an individual ID but if I give more than one id its giving error
With single ID Working FINE :
var ids = ['16611544']; //'16611345','16611347'
$scope.updateTestRun = function(data) {
data.showedit = true;
$scope.label = 'Save';
var updateform = {};
var updateArr = [];
for (var i = 0; i < data.length; i++) {
var testrunid = data[i].data.data.id;
var updatedata = data[i].data.data.fields;
updateform['fields'] = data[i].data.data.fields;
updateform.fields['duration'] = 1000;
delete updateform.fields['executionDate'];
for (var j = 0; j < data[i].data.data.fields.testRunSteps.length; j++) {
data[i].data.data.fields.testRunSteps[j].status = data[i].data.data.fields.testRunStatus;
}
updateArr.push($http.put("rest/latest/testruns/" + testrunid, updateform))
j = 0;
$scope.loader = true;
}
}
u can use $q.all to send multiple request on one shot
var fullArray = [];
for (var i = 0; i < data.length; i++) {
var testrunid = data[i].data.data.id;
var updatedata = data[i].data.data.fields;
updateform['fields'] = data[i].data.data.fields;
updateform.fields['duration'] = 1000;
delete updateform.fields['executionDate'];
for (var j = 0; j < data[i].data.data.fields.testRunSteps.length; j++) {
data[i].data.data.fields.testRunSteps[j].status = data[i].data.data.fields.testRunStatus;
}
j = 0;
$scope.loader = true;
// push all request to array
fullArray.push($http.put("rest/latest/testruns/" + testrunid, updateform))
}
$q.all(fullArray).then(function(values) {
//resoponse
});
I have a piece of code to select/deselect all Dojo checkboxes using a single master checkbox (which acts as a toggle) that works fine on firefox but doesn't on IE8. I tried hard to find the issue but was clueless, can anybody help. Im attaching the code below:
<script type="text/javascript">
dojo.require("dojo.parser");
dojo.ready(function() {
var checkboxes = [];
dojo.query('#waferCheck_cb input[type=checkbox]').forEach(function(node, index, arr){
checkboxes.push(arr[index].id);
var handle = dojo.connect(dijit.byId(arr[index].id), "onchange", function(evt){
var cbClicked = evt.target.id;
var cbStatus = dijit.byId(cbClicked).get("checked");
setCBSelection(checkboxes,cbClicked,cbStatus );
dojo.disconnect(handle);
});
});
});
function setCBSelection(checkboxes,cb_Clicked, cb_Status) {
var len = checkboxes.length;
if(len > 0) {
// get index of the checkbox clicked
var cb_pos = 0;
for(var i = 0; i < len; i++) {
if(cb_Clicked == checkboxes[i]) {
cb_pos = i;
break;
}
}
// If Select All checkbox clicked, set the other checboxes accordingly
if(cb_pos == 0) {
for(var i = 1; i < len; i++) {
dijit.byId(checkboxes[i]).set("checked", cb_Status);
}
} else {
// If any other checkbox is clicked, set the Select All accordingly
var allCBSameStatus = true;
for(var i = 1; i < len; i++) {
var curCBStatus = dijit.byId(checkboxes[i]).get("checked");
if(curCBStatus != cb_Status) {
allCBSameStatus = false;
break;
};
}
if(allCBSameStatus){
dijit.byId(checkboxes[0]).set("checked", cb_Status)
}else{
if(cb_Status == false) {
dijit.byId(checkboxes[0]).set("checked", cb_Status)
}
}
}
}
}
</script>
I believe IE8 doesn't like missing semicolons. I see 2 lines that are missing semicolons.
dijit.byId(checkboxes[0]).set("checked", cb_Status)
Have you tried to define function setCBSelection(...) before dojo.ready(..) (see below)? Maybe this helps as it is used before it was defined? If that doesn't help, it may be useful if you post some kind of error-message IE might throw...
dojo.require("dojo.parser");
function setCBSelection(checkboxes,cb_Clicked, cb_Status) {
var len = checkboxes.length;
if(len > 0) {
// get index of the checkbox clicked
var cb_pos = 0;
for(var i = 0; i < len; i++) {
if(cb_Clicked == checkboxes[i]) {
cb_pos = i;
break;
}
}
// If Select All checkbox clicked, set the other checboxes accordingly
if(cb_pos === 0) {
for(i = 1; i < len; i++) {
dijit.byId(checkboxes[i]).set("checked", cb_Status);
}
} else {
// If any other checkbox is clicked, set the Select All accordingly
var allCBSameStatus = true;
for(i = 1; i < len; i++) {
var curCBStatus = dijit.byId(checkboxes[i]).get("checked");
if(curCBStatus != cb_Status) {
allCBSameStatus = false;
break;
}
}
if(allCBSameStatus){
dijit.byId(checkboxes[0]).set("checked", cb_Status);
}else{
if(cb_Status === false) {
dijit.byId(checkboxes[0]).set("checked", cb_Status);
}
}
}
}
}
dojo.ready(function() {
var checkboxes = [];
dojo.query('#waferCheck_cb input[type=checkbox]').forEach(function(node, index, arr){
checkboxes.push(arr[index].id);
var handle = dojo.connect(dijit.byId(arr[index].id), "onchange", function(evt){
var cbClicked = evt.target.id;
var cbStatus = dijit.byId(cbClicked).get("checked");
setCBSelection(checkboxes,cbClicked,cbStatus );
dojo.disconnect(handle);
});
});
});
Btw: you should always use === to compare with 0 or false... You can use jsFiddle to let JSLint check your code which detacts many issues one doesn't see in the first place. Hope i could help you.
I have 3 MC on stage which are all alpha=0
var mcArray:Array = [mc1,mc2,mc3];
for (var j:int = 0; j < mcArray.length; j++)
{
mcArray[j].alpha = 0;
}
I have one button which once I click then it will make 1 of the MC become alpha=1
revealBtn.buttonMode = true;
revealBtn.useHandCursor = false;
revealBtn.addEventListener(MouseEvent.CLICK, revealClick);
function revealClick(event:MouseEvent):void
{
for (var j:int = 0; j < mcArray.length; j++)
{
mcArray[j].alpha = 1;
}
}
But with the script above it will makes all 3 MC become alpha=1.
I know that this can achieve by using below code:
if(mc1.alpha!=1){
mc1.alpha=1
}
if(mc2.alpha!=1){
mc2.alpha=1
}
if(mc3.alpha!=1){
mc3.alpha=1
}
this code will give what I want to achieve but if there is more than 3 MC the lines of script will be longer.
revealBtn.buttonMode = true;
revealBtn.addEventListener(MouseEvent.CLICK, revealClick);
var mcArray:Array = [mc0,mc1,mc2];
function revealClick(event:MouseEvent):void
{
for(var i:uint = 0; i<mcArray.length; i++){
if(this['mc'+i].alpha !== 1){
this['mc'+i].alpha = 1;
break;
}
}
}
No that if statement would still turn all three to alpha 1.
Which of the three do you want to set to alpha = 1 when the click is made?
You could use something like this to set alpha = 1 on the first mc in the array which does NOT have alpha = 1
function revealClick(event:MouseEvent):void {
for (var j:int = 0; j < mcArray.length; j++){
if ( mcArray[j].alpha != 1 ){
mcArray[j].alpha = 1;
return;
}
}
}
Just use a counter.
var cnt : int = -1;
function revealClick(event:MouseEvent):void
{
if(++cnt < mcArray.length) mcArray[cnt].alpha = 1;
}
I've 3 movieclip on stage which is mc1,mc2,mc3
at first they are alpha=0
What I want is when i click on revealBtn, 1 of them will show up as alpha=1.
But with my code below, sometimes I need to click about 5 times or more only can make all those mc show up.
Is there any solution for what I wanted? I've try splice but it's still not working well.
var mcArray:Array = [mc1,mc2,mc3];
for (var j:int = 0; j < mcArray.length; j++)
{
mcArray[j].alpha = 0;
}
revealBtn.buttonMode = true;
revealBtn.useHandCursor = false;
revealBtn.addEventListener(MouseEvent.CLICK, revealClick);
function revealClick(event:MouseEvent):void
{
var i:Number = Math.floor(Math.random() * mcArray.length);
var movieClipToEdit:MovieClip = mcArray[i] as MovieClip;
movieClipToEdit.alpha = 1;
}
Here's one of the many possible solutions. It destroys the initial array though. If you don't want to change the initial array, the rest depends on what you actually want to achieve.
var invisibleList:Array = [mc1,mc2,mc3];
for (var j:int = 0; j < invisibleList.length; j++)
{
invisibleList[j].alpha = 0;
}
revealBtn.buttonMode = true;
revealBtn.useHandCursor = false;
revealBtn.addEventListener(MouseEvent.CLICK, revealClick);
function revealClick(event:MouseEvent):void
{
if (invisibleList.length == 0) {
return;
}
var i:Number = Math.floor(Math.random() * invisibleList.length);
var movieClipToEdit:MovieClip = invisibleList[i] as MovieClip;
invisibleList.splice(i, 1);
movieClipToEdit.alpha = 1;
}
Make a second array to use as your selection source. Every time you pick an item, Splice it from the second array. Also, since all your items are MovieClips you should use a Vector instead.
var mcVector:Vector.<MovieClip> = [mc1,mc2,mc3];
var vector2:Vector.<MovieClip> = mcVector.Slice(0); // This just copies the Vector
for (var j:int = 0; j < mcVector.length; j++)
{
mcVector[j].alpha = 0;
}
revealBtn.buttonMode = true;
revealBtn.useHandCursor = false;
revealBtn.addEventListener(MouseEvent.CLICK, revealClick);
function revealClick(event:MouseEvent):void
{
var i:Number = Math.floor(Math.random() * mcVector.length);
// Retrieves and deletes the item in one step:
var movieClipToEdit:MovieClip = vector2.Splice(i, 1);
movieClipToEdit.alpha = 1;
}