Using angular-ui and tinymce - tinymce

I'm trying to use the angular-ui tinymce directive. I used Nuget to get the angular-ui (v 0.4.0), tinymce.jquery (v 4.0.6), and tinymce (v 4.0.6)packages. I added the ui directive to my angular module and referenced the following scripts (in order) on my page:
<script src="Scripts/jquery-1.10.2.js"></script>
<script src="Scripts/tinymce/tinymce.min.js"></script>
<script src="Scripts/tinymce/jquery.tinymce.min.js"></script>
<script src="lib/angular/angular.min.js"></script>
<script src="Scripts/angular-ui.min.js"></script>
When I navigate to the partial that contains the textarea that I decorated with ui-tinymce ng-model="tinymce", I can see the error (angular.min.js) listed in my title in Chrome's javaScript console.
I've searched the web and tried suggestions such as changing the listing of the script references, but nothing I've tried works. Am I missing a key component, do I have incorrect references (or out of order), or something else? I've come accross some fiddles, but most are broken or down. I haven't yet seen one that gives a working demo that I can use.
EDIT: Ok, now I'm getting the error: "Cannot call method 'Add' of undefined" at angular-ui.min. I didn't change anything in the code, so it's possible that the original error message was from a previous attempt?

The error you are receving is occurring from a version mismatch between tiny-mce (4.0.6) and the angular-ui (0.40) package.
Looking at the api for 4.x for tinyMCE onSetContent() does not exist and has been replaced with .on()
It looks like ed.onSetContent() exists in TinyMCE 3.x.
With that being said if you replace the tinymce package with a 3.x version everything should now play nicely together.
Installed Packages
<?xml version="1.0" encoding="utf-8"?>
<packages>
<package id="Angular.UI" version="0.4" targetFramework="net45" />
<package id="angularjs" version="1.0.7" targetFramework="net45" />
<package id="jQuery" version="1.9.1" targetFramework="net45" />
<package id="Select2.js" version="3.2.1" targetFramework="net45" />
<package id="TinyMCE" version="3.5.8" targetFramework="net45" />
<package id="TinyMCE.JQuery" version="3.5.8" targetFramework="net45" />
</packages>
Once the packages are installed you can get it all wired up with the following view:
<body ng-app="MyApp">
<textarea ui-tinymce="" ng-model="tinymce"></textarea>
{{tinymce}}
<script src="Scripts/jquery-1.9.1.min.js"></script>
<script src="Scripts/angular.js"></script>
<script src="Scripts/angular-ui.js"></script>
<script src="Scripts/tinymce/tiny_mce.js"></script>
<script src="Scripts/tinymce/jquery.tinymce.js"></script>
<script>
var myApp = angular.module("MyApp", ["ui"])
</script>
</body>
Working application on github

Related

Cannot find "/dist/styles/ag-grid.css" in ag-grid-community

My AG Grid application is now failing to load styles from https://unpkg.com/ag-grid-community/dist/styles/ag-grid.css with the error:
Cannot find "/dist/styles/ag-grid.css" in ag-grid-community#29.0.0
This used to work before the v29 release.
The v29 Changelog describes why this dist folder has been deleted and the styles have been moved to a new location.
To resolve please follow the instructions from the official docs as the styles are now in a new location.
<!-- old path -->
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/ag-grid-community#28.0.0/dist/styles/ag-grid.css" />
<!-- new path -->
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/ag-grid-community#29.0.0/styles/ag-grid.css" />

Umbraco CMS problem: The type 'IEnumerable<>' is defined in an assembly that is not referenced

I Just started using Umbraco CMS v.9 and when I try to see the page I just created it shows an error.
Code
#using Umbraco.Cms.Web.Common.PublishedModels;
#inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage<ContentModels.HomePage>
#using ContentModels = Umbraco.Cms.Web.Common.PublishedModels;
#{
Layout = null;
}
<!DOCTYPE>
<html>
<head>
#Model.Name
</head>
<body>
<div>
#Model.Check
</div>
<div>
</div>
</body>
<footer>
</footer>
</html>
Error:
The type 'IEnumerable' is defined in an assembly that is not referenced. You
must add a reference to assembly 'System.Private.CoreLib, Version=5.0.0.0, Culture=neutral, PublicKeyToken=7cec85d7bea7798e'
I've been searching the solution for a while. I came across a lot of other people who have encountered similar (my assumption) problems. I tried to add to web.config something like:
<compilation debug="true" targetFramework="4.5">
<assemblies>
<add assembly="System.Private.CoreLib, Version=5.0.0.0, Culture=neutral, PublicKeyToken=7cec85d7bea7798e"/>
</assemblies>
</compilation>
but any time I rerun, the file web.config get overwritten with the original code deleting the lines I wrote. (this thing is really upsetting me)
How this thing can be fixed?
Thanks
I don't think it is v9 you are using if you have a web.config. V9 does not have a web.config file as it is written in .Net Core. Settings are in appsettings.json.
I think you have v8.
Also I think the issue you are facing can happen if your view / class / code is not referencing System.Collections.Generic
Place the following using statement at the top of the page wherever you are referencing IEnumerable
using System.Collections.Generic;

How to Use Plugins with PhoneGap Build 3.x?

I am writing a PhoneGap Build 3.x program, and cannot figure out how to properly configure my config.xml and index.html files to access any of the plugins. Here is my config.xml file:
<?xml version="1.0" encoding="UTF-8"?>
<widget xmlns = "http://www.w3.org/ns/widgets"
xmlns:gap = "http://phonegap.com/ns/1.0"
id = "org.kirsches.PGB"
version = "1.0.0">
<name>PhoneGap Build Test</name>
<description>PhoneGap Build Test</description>
<author href="http://www.kirsches.org" email="mitch#kirsches.org">
Mitch Kirsch
</author>
<preference name="phonegap-version" value="3.1.0" />
<preference name="orientation" value="default" />
<preference name="target-device" value="universal" />
<preference name="fullscreen" value="false" />
<preference name="android-minSdkVersion" value="7" />
<gap:platform name="android" />
<gap:plugin name="org.apache.cordova.device" />
<icon src="icon.png" />
</widget>
and here is my index.html file:
<!DOCTYPE html>
<html>
<head>
<title>PhoneGap Build Test</title>
<script src="cordova.js"></script>
<script src="phonegap.js"></script>
<script >
document.addEventListener('deviceready',
onDeviceReady,
false);
function onDeviceReady() {
alert("using PhoneGap 3.1.0");
alert("model = " + device.model);
}
</script>
</head>
<body>
<h2>PhoneGap Build Test</h2>
</body>
</html>
The "using PhoneGap 3.1.0" alert fires, then the application hangs on my Android device. Am I incorrect in assuming that I don't need to set up an AndroidManifest.xml file, since I am using PhoneGap Build (it is my understanding that PhoneGap Build generates the AndroidManifest.xml file from my config.xml file)? Or, am I missing something in my config.xml file (it is my understanding that the feature tag is no longer used by PhoneGap 3.x)?
Thank you to anyone who can show me my error in the above two files.
The only odd thing is the fact you include phonegap.js AND cordova.js. Pick one, it doesn't matter, as PhoneGap Build simply injects the correct file for you (as long as you have one of those tags). So in case you have: don't include the actual files.
Hope this makes a difference..
Eddy
Two things had to be changed in my code:
As Eddy correctly pointed out, I just needed phonegap.js or cordova.js (but, this was not causing my hanging problem).
I had to delete (uninstall) my app on my Android device and then re-install it via my bar code reader app (I use QR Droid). I have enabled debugging and hydration on my app (since I am in the early stages of development), and I am guessing that a prior hydration operation must have corrupted something in my app. The hanging problem occurred on two different Android devices, with the interesting scenario of the app simultaneously working correctly on Android device # 1 (since I had already done the delete and re-install on it) and not working on Android device # 2 (since I had not yet done the delete on re-install on it).
Two lessons I learned from this are:
You can't count on the hydration process to work all of the time!
Unless you are in the habit of changing the name of your application each time that you upload it to PhoneGap Build, clicking on the "Install" or the "APK" buttons or the bar code on the PhoneGap Build web page will bring down the most recent version that has been stored in Amazon S3, which might not be the most recent version that you uploaded to PhoneGap Build!
Mitch

GWT grails plugin ERROR resource.ResourceMeta - Resource not found: %nocache.js

I'm having trouble using the GWT-Grails plugin. I tried to follow this example exactly, but I end up having this error:
| Error 2012-10-28 00:25:49,567 [http-bio-8080-exec-2] ERROR resource.ResourceMeta - Resource not found: /gwt/g3wt.Application/g3wt.Application.nocache.js
I get this error after I enter these commands: ( I am simply following this guide here )
>grails create-app g3wt
>cd g3wt
>grails install-plugin gwt
>grails create-gwt-module g3wt.Application
>grails create-gwt-page main/index.gsp g3wt.Application
>grails run-app
>grails run-gwt-client
this is the index.gsp code (which is autogenerated anyway):
<html>
<head>
<!-- Integrate with Sitemesh layouts -->
<meta name="layout" content="main" />
<!-- -->
<!-- Any title is fine -->
<!-- -->
<title>Example title (change this!)</title>
<!-- -->
<!-- This script loads your compiled module. -->
<!-- If you add any GWT meta tags, they must -->
<!-- be added before this line. -->
<!-- -->
<script type="text/javascript" src="${resource(dir: 'gwt/g3wt.Application', file: 'g3wt.Application.nocache.js')}"></script>
</head>
<!-- -->
<!-- The body can have arbitrary html, or -->
<!-- you can leave the body empty if you want -->
<!-- to create a completely dynamic ui -->
<!-- -->
<body>
<!-- OPTIONAL: include this if you want history support -->
<iframe id="__gwt_historyFrame" style="width:0;height:0;border:0"></iframe>
<!-- Add the rest of the page here, or leave it -->
<!-- blank for a completely dynamic interface. -->
</body>
</html>
I understand that the nocache.js cannot be found, so I thought I could try to see where exactly it is. However, using the eclipse search function, it shows that the file is not created at all. Although there is a file named application.js.
Why is the nocache.js not created, and how do I fix this? I've been stumped for a while now, and it's frustrating.
I'm using gwt plugin 0.7.1 and grails 2.1.1, with eclipse 4.2 and a Linux machine.
I was having the same problem and found the answer here.
buildconfig.groovy is in the conf folder. Just comment out the plugin where the runtime is ":resouces..."
Okay, so I got the error to disappear by first running
grails> compile-gwt-modules
Now a different problem occurs. The front-end gwt codes I made, aren't displayed.
You can add in you Confing.groovy:
grails.resources.adhoc.excludes = ['**/gwt/**']
This will solve the problem. But if you use plugin version 0.8 this issue should be resolved.

error jsp 154 java.lang.classnotfound

i am developing a portlet struts 2 ejb3
i configured project ejb and in the portlet project i confugured the action class and struts.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<package namespace="/view" extends="struts-portlet-default" name="view">
<!-- If no class attribute is specified the framework will assume success and
render the result index.jsp -->
<!-- If no name value for the result node is specified the success value is the default -->
<action name="index">
<result>/html/view/index.jsp</result>
</action>
<action name="create" method="ajouterOUmodifier" class="com.esprit.action.AdressAction">
<result name="success" type="redirect">index</result>
<result name="input">/html/view/ajoutAdress.jsp</result>
</action>
</package>
</struts>
and the jsp file
<%# page contentType="text/html; charset=UTF-8"%>
<%# taglib prefix="s" uri="/struts-tags"%>
<%# taglib prefix="sx" uri="/struts-dojo-tags" %>
<html>
<head>
<link href="<s:url value="/resources/main.css"/>" rel="stylesheet" type="text/css"/>
</head>
<body>
<s:form action="create" method="post">
<s:textfield name="adress.nom" label="Firstname"/>
<s:textfield name="adress.prenom" label="Lastname"/>
<s:submit value="ok" />
</s:form>
</body>
</html>
but when i execute the project an error is display:
ERROR [jsp:154] java.lang.ClassNotFoundException: com.esprit.metier.AdressDao from BaseClassLoader#33b2c7a8{VFSClassLoaderPolicy#1e52011c{name=vfsfile:/D:/android/jboss-5.1.0.GA/server/default/deploy/DepartmentWEB-portlet.war/ domain=ClassLoaderDomain#69ac5f83{name=vfsfile:/D:/android/jboss-5.1.0.GA/server/default/deploy/DepartmentWEB-portlet.war/ parentPolicy=AFTER_BUT_JAVA_BEFORE parent=ClassLoaderDomain#5183a17c{DefaultDomain}} roots=[MemoryContextHandler#432465105[path= context=vfsmemory://5c4o13m-e9nqdk-h49ogxti-1-h49ohbp5-2a
can you help me ?
The ClassNotFound condition can result from two issues:
The class that the classloader complains about is not on the classpath
The class that the classloader complains about references another class that cannot be loaded for some reason (e.g. it's not on the classpath or references something else that is not...)
So: Check your classpath: Is com.esprit.metier.AdressDao on there? Its superclasses (the whole hierarchy) and all interfaces it implements? All members and referenced classes (see method signatures as well).
Further, if this really is a portlet's jsp, it shouldn't contain <html>, <head> and <body> as this is the business of the portal to add these to the page. You'll also probably need to include your css either in the theme or in liferay-portlet.xml in the <header-css> section (but this shouldn't influence your class-not-found experiences, it's just general portal advice)