Change order pagination options dojo - pagination

I make a table with dojo script, but it should see the diferent order of pagination options as that: 1. the page navigation choices, 2. page length menu and, 3. current position display.
I need help with that, how can I change that?
http://dojotoolkit.org/reference-guide/1.10/_images/pagination_ui_overview.bmp

In order to customize/modify an existing dojo widget you will need to manipulate the dom.
In this specific case you should use selectors like dojo/dom and dojo/query to select the portions of the grid you wish to move and then use dojo/dom-construct to place them in the correct location.
domConstruct.place(pageNavigation, positionDisplay, "replace");
Here is a jsfiddle which demonstrates a portion of what you are trying to accomplish and is a good starting point http://jsfiddle.net/kagant15/u6edz0b9/

Related

Adding position to nodes in view results

In Drupal 8 I have a view that shows nodes in the result. What I need is to know the order that each node has in the results list. In other words: if my node template only shows titles of those nodes.
What i need to get is something like:
1 | The title of one node
2 | The title of some other node
etc.
I was thinking of making an override of the views-view-unformatted.html.twig. There, I can work with the loop, but how can I have the index of the loop in the node templates?
Don't really think you have to override anything here. You can create a new view mode for your node, e.g. teaser and manage its display using Display Suite.
Afterwards you can select rendered entity to show in your view and the corresponding view mode.
just play with the sort criteria of your view
it is all configurable in the back-office
/admin/structure/views/view/name_of_our_view
IMHO loop in Twig is good solution, but in order to add numbers to your node titles you can change format to HTML List.
In format section choose HTML List, save, then click on Settings and choose "Ordered List"
The result should be similar to this:

changing styleclass and disableoutputtag on panels within a facet using themes

I am not an expert on themes but i would like to know if it is possible to accomplish that:
Once i pull a panel into a facet i am hiding the panel by disabling the output tag and setting a special css class only for the designer client.
Has somebody tried to do that automatically in themes by checking if the panel is in a facet(Maybe ask for the key: property)?
I have tried to change the panel but i dont know how to set a certain style class based on a property of the panel.
To my best knowledge: A theme styles content rendered, not attributes that define if content gets rendered or not.
You have 2 options you could use:
create your own little extension library with controls you want to use everywhere. Add one 'containerPlaceholder' (or whatever you would call it) that doesn't render any own output, but only it's children.
use a snippet you simply paste into your source code.
don't use a panel or div, but add your custom controls to the callbacks. Makes your XPage more readable (that's what I do)
Hope that helps

Dynamically add / remove editable area to custom control embedded in XPage

Okay... this is a little difficult to explain but I will try my best.
In Custom Control while adding properties in Property Definition we can set "Allow multiple instances" which allows us to add multiple instances of that property when the control is embedded in XPage.
Similarly, I need to know whether it is possible to add (and remove) Editable Areas in a custom control when it is embedded in XPage? What I plan is that I would have a repeat control inside my custom control and I would be able to put the contents in each editable area in every loop of that repeat.
Is this the right way to go about or am I looking at this problem incorrectly? Any solution not involving editable areas is also welcome :)
Update 4 Apr 2013:
A use case context I am looking for is a simple carousel where contents of each screen in carousel can have different contents. These contents would be put into each (dynamically added) editable area. The contents can be very different from each other with one screen containing only text, other only image and another both image and text.
Look at the table walker example in the 26 original exercises. It does mostly what you are looking for (conceptually). You won't need multiple editable areas. Whatever is inside the repeat gets repeated.
What you want to do is to give the control a custom property "boolean editMode" so you can render that one line to be edited - if that's the UI pattern you want to follow.
You also could consider a dojo table with Ajax which allows for a familiar spreadsheet UI

Change the action when clicking on a list item

I would like to change the destination URL when clicking on a list item / item title so it will no send me to view the item but will send me to a different URL base on the item.
I am not looking to replace the Links list but to use the list title as URL query filter.
Thanks
You will need to do it using the custom Page / Customize the View Page in the SharePoint Designed. Please refer to this article on how you can achieve it using the SPGridView control
I'm not totally clear on what you'd like to do (maybe screenshot mock ups would help?), but here's some general advice.
If you want to change the behaviour of a control then investigate the properties of the control as kusek has suggested. If the properties don't do what you need then try overriding the control to change what is rendered.
If the above doesn't work out or you want to change how these links render no matter where they appear on the page, then you need to look at a page-level solution. The most common are jQuery that can dynamically replace the URLs with JavaScript, or an HTTP module which is much more low level and will actually alter the HTML rendered to the page.
Hope this helps.

Prototype menu

Does anyone know of a good javascript menu using the prototype library.
I need to produce a list of links available for each row of a HTML table as a hover/click dropdown menu.
Constraints
The list of links is the same for every row, however, a link needs to post an id param unique to the row.
The table is in a scroll pane, so the menu needs to know if if should render itself on the other side of the associated HTML element (e.g. TD) if necessary for visiblity.
I've found some a nice plugin for the JQuery library, but don't currently use JQuery and would like to avoid adding it if possible. I am already using prototype 1.6.
The author of the blog post below has used prototype to create a drop-down JS menu. I don't think it fits the bill for everything you're looking for, but it should give you a starting point.
http://www.blog.highub.com/javascript/javascript-library/prototype-drop-down-menu/

Resources