ng-view not getting updated when there is ng-grid inside it - angularjs

Please take a look at following plunker http://plnkr.co/edit/34JedA
It is a simple app with a ng-grid. What I need to do is navigate to the edit page when the edit button is clicked. What happens is instead of going to the edit page columns in the grid get messed up. Could anyone please explain why it is happening and what I could do to correct it.

There seems to be a problem with the ng-grid version you are using, I changed to the latest version I found and it worked.
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/ng-grid/2.0.8/ng-grid.debug.js"></script>
Example: http://plnkr.co/edit/5myA2K?p=preview

Do not include file with following header.
/***********************************************
* ng-grid JavaScript Library
* Compiled At: 04/22/2014 16:27
***********************************************/
instead of this, please add
/***********************************************
* ng-grid JavaScript Library
* Compiled At: 04/07/2014 16:55
***********************************************/

Related

React-fiber (drei) ScrollControls prevent<Html> from scrolling

I've noticed in V9 of drei there is a bug when combing the <Html> elment with <ScrollControls>.
I just want bind text to a 3D element but the ScrollControll makes the text scroll out of the view: CodeSandBox Example
It works fine in v8: CodeSandBox Example
I fixed this in this PR https://github.com/pmndrs/drei/pull/1126 we just have to wait until they approve it. But you can just patch the library yourself using https://www.npmjs.com/package/patch-package, it should be easy as it is just one line change.
Edit: Now that I think about it, you could probably fix it also by sending gl.domElement.parentNode as the portal prop.

Having trouble with implementation

I have spent 2 hours + on the lightbox. I have checked paths to CSS and Javascript. I have used both the included jquery and Google's imported JQuery.
When I click an image it opens a new window with that image larger on a white background. I want it to overlay the current page with <> and x.
You can see an example: http://demopbdesignsource.tierstrategies.com/a.aspx
Thanks
Looking at your code on your page I do not see where you are calling the lightbox.js script - that needs to be called right before the body close tag.
Also lightbox help states : If you already use jQuery on your page, make sure it is loaded before lightbox.js. - ◦Include the Javascript at the bottom of your page before the closing /body tag:
I used the lightbox-plus-jquery.js and called that just before the close of the body tag and it worked. I called the lightbox-plus-jquery.js just before the close of the body tag because it has both jquery and lightbox combined.
I am still working on the page and I am just using html not .net but the lightbox would work the same. If you look at my source you will see the script call right before /body tag.
http://just-in.com/recycledDresser/index.htm
Hope this helps.
Debra W.
You need to call the Lightbox script.
Something like
Placing it in the line before the line works for me.
Both
http://demopbdesignsource.tierstrategies.com/X/LightBox.css
and
http://demopbdesignsource.tierstrategies.com/X/LightBox.js
cannot be found.
The link provided in the question is giving 404 right now.
but I think you just need to follow the steps given at
http://lokeshdhakar.com/projects/lightbox2/
to set up lightbox.
you may have missed either of the following :
Include the CSS at the top of your page in your <head> tag:
<link href="path/to/lightbox.css" rel="stylesheet">
Include the Javascript at the bottom of your page before the closing </body> tag:
<script src="path/to/lightbox.js"></script>

Why keyboard accessibility doesn't work for Bootstrap dropdown?

I am trying to make the Bootstrap dropdown keyboard accessible in my page. But I don't know why keydown/up doesn't work. Please see the my jsfiddle demo
And I also have some questions on Bootstrap accessibility. Please help to review it.
According the Issue 931. It seems the keyboard accessibility wasn't added until v3.0.0-rc1. Right?
Why missing href in the anchor element would disable keyup/down accessibility for dropdown?
The problem lies in the following source code of bootstrap's dropdown.js that is using to find index of focused element:
var index = $items.index($items.filter(':focus'))
the problem is that the $items.filter(':focus') don't returns correct element and in this case index will be -1 each time.
I don't know how jQuery's :focus exactly works but this problem can be solved with the following code: var index = $items.index($(document.activeElement)). But anywhere it's not good thing to change something in source code of 3rd-party library.

How to write the Angular js codes in jsfiddle?

I learn the Angularjs these days, then I using the online fiddle.net to write the angular.js codes. At first because the jsfiddle need't write the html tag. so I don't know where I should put the "ng-app" command. The link that I share doesn't work, are you get the same question?
http://jsfiddle.net/liminjun88/Jh9K7/
function CartController($scope){
$scope.items=[
{title:'Paint pots',quantity:8,price:3.95},
{title:'Polka dots',quantity:17,price:12.95},
{title:'Pebbles',quantity:5,price:6.95}
];
$scope.remove=function(index){
$scope.items.splice(index,1);
}
}
click on frmaework and extensions; and choose instead of domready to No Wrap - in
You have it right, you just need to change when your script gets run, from the second dropdown in the upper left.
Here's the modified fiddle
No wrap - in <head>
You need to use AngularJS with option No wrap - in <body>
Here is the fixed JSFiddle: http://jsfiddle.net/tomepejo/mrX4L/

Error when using x-editable with BS3

I want to make a simple use of the plugin x-editable, following step by step what's to do in the official doc.
It actualy worked fine when I was on Bootstrap 2, though, it doesn't work anymore on BS3 (even if I updated everything to the latest version etc.).
So when I click on the link to trigger the editable popover, I got this error in firebug :
TypeError: this.$element.data(...) is undefined
[...]/Bootstrap3/js/bootstrap-editable.js
Line 154
Which is actually this line :
this.$element.data('popover').tip().addClass('editable-popover');
Btw, I'm using CakePHP, all the plugins (js and CSS) are declared etc...
So I'm running out of idea, if someone knows about it, would be cool !
Thanks !
EDIT : Problem solved, just had to reload the cache... Old script was still in it so there was compatibility problems.
Did you download the latest Bootstrap 3 ready version from: http://vitalets.github.io/x-editable/assets/zip/bootstrap3-editable-1.5.0.zip
I didn't find any problem following the steps from http://vitalets.github.io/x-editable/docs.html. See: http://jsfiddle.net/xaRbU/
Note the examples use jquery-2.0.3 (the fiddle above works with 1.9.1). Since jQuery 2 doesn't support IE8 Bootstrap requires the newest 1.x version of jQuery, see also: Updating Bootstrap to version 3 - what do I have to do?
Code used:
html:
<div class="container">
<div class="row">
superuser
</div>
</div>
javascript:
$(document).ready(function() {
$('#username').editable();
});
css:
/* create some space cause the popup shows on the top of the element */
body{padding-top:100px;}

Resources