I have an Archetype (1.12.4.0) with one of its properties as an Umbraco 7.4.3 Grid datatype.
Within the razor view that uses the Archetype within its model, I'm using the following, which renders all the HTML markup, but no actual content within each part of the grid:
#Html.Partial("Grid/bootstrap3", fieldset.GetValue<object>("grid"))
When looking at the json/dynamic object that's getting passed into grid/bootstrap3.cshtml, there are several properties missing from the sections/rows/areas/controls/editor node. The bootstrap3.cshtml and base.cshtml views rely upon the "view" property being present on the editor node, but all I've got is the "alias" property. Is the Archetype not saving the grid json properly??
Here's an "editor" node from a page that uses the Umbraco 7 grid directly (not within an Archetype):
sections/rows/areas/controls...
"editor": {
"name": "Rich text editor",
"alias": "rte",
"view": "rte",
"render": null,
"icon": "icon-article",
"config": {}
}
But the data from the grid nested in the Archetype is:
"editor":{
"alias":"rte"
},
As you can see, all the properties besides "alias" is missing in the Json data in the database.
Any suggestions??
Related
I java a similar nested json arrayobj, It may be from 1..X (not limited)
[{"id":"25","son": [
{"id":"26", "son": [
{"id":"28","son":[],"message":"my message 1","creationDate":"2016-05-26"},
{"id":"27","son":[],"message":"my message 2","creationDate":"2016-05-26"}
],
"message":"my message 3","creationDate":"2016-05-26"}
],"message":"my message 4","creationDate":"2016-05-26"}
]
I nedd to display it using Kendo, I am using listviewm but it just list the firt item, not the son tag items.
I am trying to implement a forum control. Can you suggest a way to do it?. Thank you in advance.
As far as I know, you won't be able to achieve what you want using a kendo listview because it wasn't designed to display hierarchical data (or nested data).
However, kendo do have other widgets that you can use to what you want to do. I think the TreeList is probably the one you are looking for. In order to use that widget, you will have to modify the data from a nested format to a id / parendId format. Using the sample data you provided, you should reformat the data like this:
var data = [
{ id:25,parentId: null, message:"my message 4",creationDate:"2016-05-26" },
{ id:26, parentId:25, message: "my message 3", creationDate:"2016-05-26"},
{ id:28, parentId:26, message":"my message 1",creationDate:"2016-05-26"},
{ id:27, parentId:26, message:"my message 2", creationDate:"2016-05-26"}
]
Depending on your need, you may also use a TreeView but this widget isn't designed to display multiple fields by default. You can also use a grid with a custom detail template but that required extra code to handle the detail grid template initialization.
I am facing problem for rendering the anchor by using the glass mapper in sitecore mvc.
This is the code I have used to render the link:
#RenderLink(promoWidget, x => promoWidget.Link, new System.Collections.Specialized.NameValueCollection { { "target", promoWidget.Link.Target },{"class",promoWidget.Link.Class}}, true, contents: promoWidget.Link.Text)
But when from sitecore we select the link and click on insert anchor I put the text and anchor text. When I display this link by using above code it will render link this:
product
It is showing 2 times product#product. I want to display only once #product.
How can I do this?
Appreciate the help
Thanks,
Amol
My software allows people to upload images to a "Files" section on my site. I want to allow users to insert those images into a CKEditor 4 instance but I want to control where those images are hosted.
Instead of inserting the following:
<img src="http://domain.com/image.jpg" />
I want it to insert:
<img src="[file:12345678]" />
I can then use PHP to control what URL will be displayed on the website.
The issue is, in the WYSIWYG view of CKEditor, it shows as the image could not be found. Is there anyway I can create a plugin that replaces the [file:12345678] with the image code when in WYSIWYG view but in source view it reverts back to [file:12345678]?
Kind of like how the BBCode plugin works. When you go to source view you see:
The [b]brown fox[/b] jumped over the log
But the editor view you see:
The brown fox jumped over the log
I tried to work out the code from the BBCode plugin but the BBCode parsers seems to be something built-in.
I found the following code but it only applies to the source view. I can't seem to find out if there is a similar function of the WYSIWYG view.
editor.dataProcessor.htmlFilter.addRules(
{
elements :
{
img : function( element )
{
// I can get the src of any image and then replace it.
element.attributes.src
}
}
});
Thanks for any advice you can give ;)
There are two type of filters in htmlDataProcessor (which is the default data processor) - htmlFilter which is used to filter HTML format, so the format used "inside" editor while editing; and dataFilter which is used to filter data format, so the format used "outside" editor - the one you see in source mode or when you call editor.getData(). Those names can be confusing, but it helps when you remember that "data" is outside (because editor.getData()).
So I guess that when loading data to editor (transforming data to HTML) you want to replace [file:\d+] URLs with addresses from some hash and when getting data back (transforming HTML to data) you want to make the opposite transformation.
Therefore you need to extend both filters - htmlFilter and dataFilter. This is how the dataFilter may look:
editor.dataProcessor.dataFilter.addRules( {
elements: {
img: function( el ) {
el.attributes.src = fileIdToUrlHash[ el.attributes.src ];
}
}
} );
Similar operation you have to do in the htmlFilter.
I'm using CKEditor in my Rails app (via the 'ckeditor' gem).
I've customized the toolbar as below. As you can see, I only want the minimum amount of features.
[
{ name: 'basicstyles', items : [ 'Bold','Underline' ] },
{ name: 'paragraph', items : [ 'NumberedList','BulletedList' ] },
{ name: 'links', items : [ 'Link' ] },
{ name: 'insert', items : [ 'Smiley','SpecialChar' ] },
{ name: 'colors', items : [ 'TextColor' ] },
];
This works fine, but the buttons provide much more functionality than I need.
For example, the Link button triggers a popup that allows the user to choose details like link type and target. I want to restrict my users to exactly one kind of link. (ie. when they click the link button, all they need to do is enter the link, and they see no options and have no decisions to make.)
For Text Color, I just want two or three colors, instead of the 50+ that are provided.
How can I make these changes?
Would appreciate it if you could provide input, or point me to some resources. Thanks!
To make these changes, you'll need to rewrite the desired plugins in order to customize their funcionality.
You can find further info about it here: http://docs.ckeditor.com/#!/guide/plugin_sdk_intro
In order not to break compatibility with newer versions, I suggest you to create new plugins based in the ones you want to modify instead of doing that directly in their source code.
You can try the Advanced Content Filter that we introduced in CKEditor 4.1. Based on content rules which you can define editor data is filtered and the same happens to UI - only "allowed" buttons and fields in dialogs are displayed. It all happens automatically, so the result may not be perfect, but we have really positive feedback about this feature.
Check the ACF sample and release note.
I have built the tree view using third party javascript plugins. I have also use the web templates for my asp.net MVC 3 application. And use Layout view linking to lot of css and javascript.In my category view I want to display the tree view. But the due to script of layout view the tree view is interrupted and not displaying properly. When I put Layout = Null, it shows properly. How can I set priority to the link of script and css link for displaying tree view properly
Take a look at ClientDependancyMvc NuGet package.
It allows to set priority to clientside resources like this:
Html.RequiresCss("Bootstrap/bootstrap.min.css", "Content", 2);
Html.RequiresCss("Bootstrap/bootstrap-responsive.min.css", "Content", 3);
Html.RequiresJs("jquery/1.7.1/jquery.min.js", "googleCDN", 1);
Html.RequiresJs("jqueryui/1.8.18/jquery-ui.min.js", "googleCDN", 2);
Where the last parameter is priority of inserting element into page. More info here.