Develop Reference

Getting error while including AngularJS multiple chosen directive

I'm getting the following error while implementing the AngularJS chosen directive.
Error:
TypeError: a.map is not a function
at nh.q.writeValue (angularjslatest.js:307)
at Object.e.$render (angularjslatest.js:328)
at angularjslatest.js:310
at angularjslatest.js:146
at m.$digest (angularjslatest.js:147)
at m.$apply (angularjslatest.js:150)
at l (angularjslatest.js:102)
at XMLHttpRequest.s.onload (angularjslatest.js:108)
I'm explaining my code below:
<select chosen
multiple
class="form-control oditek-form"
name="category"
id="category"
ng-model="category"
ng-options="s.value as s.name for s in listOfCategory">
</select>
My controller code is given below.
$scope.listOfCategory = [{
name: 'Select Category',
value: ''
}];
$scope.category = $scope.listOfCategory[0];
var fileURL = '';
var url1 = '../service/admin/vechile/service/service.php?action=getAllCategoryData';
var method = 'GET';
var data1 = '';
DataService.connectToServerSideScript(method, url1, data1).then(function(response) {
if (response.length > 0) {
angular.forEach(response, function(obj) {
var cdata = {
'name': obj.category_name,
'value': obj.id
};
$scope.listOfCategory.push(cdata);
})
}
}, function(error) {
});
Here I'm getting all the data but those error is coming in browser console. Here I need to clear those error.

You need to setup your selected model as an array:
$scope.category = angular.isDefined($scope.listOfCategory[0]) ?
[$scope.listOfCategory[0]] : [];
Please note that this also fixes the following error message:
Error: TypeError: a.forEach is not a function

I was facing a same kind of 'chosen multiple select' related problem, which was getting 3 times same error. Error log is like below. The solution may help others.
TypeError: a.map is not a function
at mh.q.writeValue (angular.js:30513)
at e.$render (angular.js:33327)
at Object.c.$render (angular-chosen.min.js:7)
at angular.js:29306
at m.$digest (angular.js:18253)
at b.$apply (angular.js:18531)
at HTMLButtonElement. (angular.js:27346)
at HTMLButtonElement.dispatch (jquery.min.js:3)
at HTMLButtonElement.q.handle (jquery.min.js:3)
To bypass the issue, I have maintained 2 variables, one for a model variable and other for a saving variable. e.g.
In controller,
$scope.x = {
draftVar: []
};
$scope.save = function(){
$scope.x.savingVar = $scope.x.draftVar.join(',');
save();
}
<select ng-model="x.draftVar" chosen multiple chosen-updater ng-options="xx.id as xx.name for xx in XXs">
<option value=""></option>
</select>

Angular select with ngModel gives me [$rootScope:inprog] error

I am not very good with angular, but i know some basics. Now, I have access points and want to assign them to a building. I can select this building with a <select>. I have written a simple controller, but it wont work. What am I making wrong, i cant find a solution.
Edit 1:
I can see the option fields (they are 3). But after I select one of these, my browser console throws the exception
Edit 2: Plunkr -> https://plnkr.co/edit/EIPs8yVlTSaYQ0EuZLTb (i hope, this url works) .. When you click on "Neuer Access-Point" the error will occur, after you select something on "Gebäude"
Select field
<select ng-model="$ctrl.input.building">
<option ng-repeat="building in $ctrl.buildings" ng-value="building.id" ng-bind="building.name"></option>
</select>
Controller
(function () {
function createController(Building) {
var ctrl = this;
ctrl.buildings = null;
ctrl.input = {
host: '',
desc: '',
web: '',
building: ''
};
ctrl.$onInit = function () {
Building.getAll().then(function (res) {
if (res.status >= 200 && res.status < 300) {
ctrl.buildings = res.data;
}
});
};
}
angular.module('app').controller('CreateController', createController)
})();
Error
angular.js:14791 Error: [$rootScope:inprog] http://errors.angularjs.org/1.6.8/$rootScope/inprog?p0=%24apply
at angular.js:88
at p (angular.js:18897)
at m.$digest (angular.js:18319)
at m.$apply (angular.js:18640)
at Object.$$debounceViewValueCommit (angular.js:29394)
at Object.$setViewValue (angular.js:29372)
at angular.js:33596
at m.$eval (angular.js:18533)
at m.$apply (angular.js:18632)
at HTMLSelectElement.<anonymous> (angular.js:33595)

Here is the issue with your code.
<div id="wrapper" ng-app="accessPoints" ng-controller="RootController **as $root**">
Change it to simply
ng-controller="RootController as anythingButNot$root"
or even just ng-controller="RootController"
Declaring any controller as $root is creating mess for you. $root is the root level controller of your application. Inside your html if you declare any controller as $root, it tries to overwrite $root, creating trouble with digest cycle, hence you are getting the error.
Link to updated plunk => https://plnkr.co/edit/UcJHVmekMqWMXJBnv2Cu?p=preview

django-admin-bootstrapped messing with DateField, TimeField and PointField

I've just added django-admin-bootstrapped to my project. Almost everything is fine.
Actually there are two little bug whitch i'm wondering how to resolve.
The first one is about DateField and TimeField : There is no date/time picker when i'm under django-admin-bootstrapped. When i check the source code, there is no generated source code about the two picker. When i deactivate django-admin-bootstrapped, here is what is missing :
Next to the DateField :
<span class="datetimeshortcuts">
Today |
<a href="javascript:DateTimeShortcuts.openCalendar(0);"
id="calendarlink0"><img src="/static/admin/img/icon_calendar.gif" alt="Calendar">
</a></span>
Next to the TimeField :
<span class="datetimeshortcuts">
Now |
<a href="javascript:DateTimeShortcuts.openClock(1);"
id="clocklink1"><img src="/static/admin/img/icon_clock.gif" alt="Clock">
</a></span>
The second one is about a PointField (i'm working with postGis), without django-admin-bootstrapped, my field is fine, but when it's bootstrapped, i have an error onto OpenLayer.js :
OpenLayers.js:679 Uncaught TypeError: Cannot read property 'w' of null
So, two questions (using django 1.8 and django-admin-bootstrapped):
1- How to recover a date/time picker in the admin interface ?
2- How to recover my PointField map picker in the admin interface ?
Thank's all of you. (Here the same issue (1) on github : https://github.com/django-admin-bootstrapped/django-admin-bootstrapped/issues/168 but there is only external workarround (and i prefer a nativ one))
EDIT : From my sitepackage : ./django/contrib/gis/admin/options.py
I've directly changed the line who call OpenLayer.js to OpenLayer.debug.js to provide you more information.
In OpenLayer.debug.js line 40008 is the source of the error :
setMap: function(map) {
OpenLayers.Layer.prototype.setMap.apply(this, arguments);
if (!this.renderer) {
this.map.removeLayer(this);
} else {
this.renderer.map = this.map;
var newSize = this.map.getSize();
40008-> newSize.w = newSize.w * this.ratio;
newSize.h = newSize.h * this.ratio;
this.renderer.setSize(newSize);
}
},
Here the entire JS traceback on OpenLayer.debug.js + index of GeoDjango:
Uncaught TypeError: Cannot read property 'w' of null ==> OpenLayers.debug.js:40008
newSize.w = newSize.w * this.ratio;
OpenLayers.Layer.Vector.OpenLayers.Class.setMap ==> OpenLayers.debug.js:8349
layer.setMap(this);
OpenLayers.Map.OpenLayers.Class.addLayer ==> (index):614
geodjango_gps_point.map.addLayer(geodjango_gps_point.layers.vector);
geodjango_gps_point.init ==> (index):677 (anonymous function)
<script type="text/javascript">geodjango_gps_point.init();</script>

Two problems were describ and sorry for the poor lisibility. So here some answers :
1 - The DateField and Timefield seems to be issued and this will be fix :
Fix 168 (last update 3 days ago)
2 - My PointField show up correctly after adding this options to settings.py :
DAB_FIELD_RENDERER = 'django_admin_bootstrapped.renderers.BootstrapFieldRenderer'
Thank's all

Meteor template isn't rendering properly

I'm building a notifications page, where the user can see which posts have comments, and I want to display the date of each post, but it's not working.
Here is the code:
<template name="notification">
<li>Someone commented your post, {{postDate}} </li>
</template>
Template.notification.helpers({
notificationPostPath: function() {
return Router.routes.PostPage.path({_id: this.postId});
},
post: function () {
return Post.findOne({_id: this.postId});
},
postDate: function() {
return moment(post.submitted).format('dddd, MMMM Do');
}
});
The console prints this: Exception from Deps recompute: ReferenceError: post is not defined.
Thanks in advance

I assume the error is being flagged on the following line:
return moment(post.submitted).format('dddd, MMMM Do');
Note that you can't refer to helpers from within other helpers like that (and anyway, post is a function) - you need too add another line at the start of the postDate helper like this:
var post = Post.findOne({_id: this.postId});

KendoUI grid for ASP.net MVC

I have a requirement of a search page in which I am using KendoUI grid to display the search result.
I have a textbox and button and if text is entered and on click event of button I hace to display the grid with the list of users matching to search result.
I am using ASP.net MVC and KENDOUI grid.
My View:
The search box and button:
<div id="SearchSection">
<input type="text" id="txtSearch" class="k-textbox"/>
<button class="k-button"id="btnSearch" style="width:150px">Search</button>
</div>
The KendoUI grid
<div id="ADUserSection">
<div id="ADSearchedUser">
List of users in Active directory:
<div id="ADuserGrid">
#(Html.Kendo().Grid<ADUser>()
.Name("kADUser")
.Columns(columns =>
{
columns.Bound(p => p.UserLoginName);
columns.Bound(p => p.UserDisplayName);
})
.AutoBind(false)
.DataSource(ds =>
{
ds.Ajax()
.Read(read =>
{
read.Action("GetADUser", "ManageUsers")
.Data("AdditionalData");
});
})
)
)
</div>
</div>
My JavaScript Function:
<script>
$(document).ready(function () {
$("#ADUserSection").fadeOut(0);
$("#AvailableUserRoleSection").fadeIn()
});
var enterTest
$("#btnSearch").click(function () {
debugger;
enterTest = $("#txtSearch").val().trim();
if (enterTest == "") {
$("#ADUserSection").fadeOut();
}
else {
AdditionalData();
$("#ADUserSection").fadeIn();
var grid = $("kADUser").data("kendoGrid").dataSource.read({ searchText: enterTest });
//**Breaks at this Point**//
}
});
function AdditionalData() {
//$("#ADuserGrid").empty();
$("#ADuserGrid").fadeIn();
return {
searchText: enterTest
}
}
My Controller Action
public JsonResult GetADUser([DataSourceRequest] DataSourceRequest request, string searchText)
{
viewmodel.searchedADUser = model.GetUserFromAD(searchText);
return Json(viewmodel.searchedADUser.ToList().ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}
On the button click event in javascript when I attach the grid to event I get the error the datasource read is not recognised.
Exact error is:
JavaScript runtime error: Unable to get property 'dataSource' of undefined or null reference
Please help me in that. any idea please share or if I am doing anything wrong in my above code please point out.
I am very new to KendoUi and MVC so please elaborate n yur explanation.
I got the above problem becosue of missing # before the grid name.
But Now I habe one more issue, even though I am follwing all the proper step.
In my above AdditionalData javascript function my parameter is not getting set set in the paaremeter
function AdditionalData() {
//$("#ADuserGrid").empty();
$("#ADuserGrid").fadeIn();
return {
searchText: enterTest
}
}
This searchText is not getting set even tough I am getting value in enterTest.
Any help will be of very great use. I am really stuck in this.

You're trying to access your grid with:
var grid = $("kADUser").data("kendoGrid");
$("kADUser") won't find any elements, because it's looking for a kADUser tag, and the .data() of an empty jQuery set is null.
As a result, when you try to access grid.dataSource, grid is "undefined or null" (which is what the error is telling you).
You should be using an id selector:
var grid = $("#kADUser").data("kendoGrid");
In general, I'd suggest to avoid compound statements and keep it at one statement per line. This will make debugging much easier.