I have an issue someone here might help to solve... I have currently an ActionBar which looks like this:
If you touch the magnifier, this is what is shown:
And if you touch the back arrow, the action bar should be like it was at first, but something weird happens to the magnifier...
I'm currently showing / hiding the ActionItems with the visibility attribute, but I don't know why this misalignment is happening when I show them again.
The actual code is something like this:
<ActionBar
class="action-bar"
title="{{ actionBarTitle }}"
[ngClass]="{
'action-bar-search-bar-visible' : showSearch
}"
>
<!-- Android menu button -->
<NavigationButton
(tap)="toggleDrawer()"
[visibility]="showSearch ? 'collapse' : 'visible'"
*ngIf="isAndroid"
class="action-bar-item"
icon="res://menu_icon_white"
></NavigationButton>
<!-- iOS menu button -->
<ActionItem
(tap)="toggleDrawer()"
[visibility]="showSearch ? 'collapse' : 'visible'"
*ngIf="isiOS &&"
class="action-bar-item action-bar-item-menu-icon"
ios.position="left"
><Image src="res://menu_icon_white"></Image></ActionItem>
<!-- Search bar toggle -->
<ActionItem
(tap)="toggleSearch()"
[visibility]="showSearch ? 'collapse' : 'visible'"
android.position="popup"
class="action-bar-item action-bar-item-menu-icon"
ios.position="right"
><Image src="res://ic_search"></Image></ActionItem>
<!-- Search bar -->
<search-bar-custom
*ngIf="showSearch"
(on-search-hide)="toggleSearch()"
></search-bar-custom>
</ActionBar>
You are using visibility to show/hide the action items,
Use the same technique to show or hide the search bar, instead of *ngIf.
Also try setting android.position="right" for the search bar icon.
Related
How to tap in to the click event of the "+" expand "-" collapse click events.
Clicking on the row triggers the "cellClickHandler($event)", I need it to be able to handle detail click as an event also.
<kendo-grid
[data]="mainData"
(cellClick)="cellClickHandler($event)"
>
<kendo-grid-column>
// column stuff
</kendo-grid-column>
<kendo-grid-column>
// more column stuff
</kendo-grid-column>
<ng-template kendoGridDetailTemplate>
<table>
// stuff
</table>
</ng-template>
</kendo-grid>
You can utilize the detailCollapse and detailExpand events from the kendo-grid component.
Example (Plunker)
<kendo-grid
...
(detailCollapse)="collapseHandler($event)"
(detailExpand)="expandHandler($event)"
>
...
</kendo-grid>
Detailed information on all available events can be found in the Grid API section.
Change side menu background color and add an icon in side menu in ionic3. I tried to change side menu background color but it didn't change and where I have added icon in the side menu.
well you just have to add "ion-icon" tag before your menu text just like this
<ion-content id="mysidemnu">
<ion-list >
<button ion-item *ngFor="let p of pages" (click)="openPage(p)">
<ion-icon ios="ios-alert" md="md-alert"></ion-icon> {{p.title}}
</button>
</ion-list>
</ion-content>
and as for the background color, you just have to give an id to the "ion-content" and give the case to the success file just like this
#mysidemnu
{
background-color: red;
}
I have 3 TextBoxes
<asp:TextBox ID="txtTitle" runat="server" class="txtFields" title="Title" />
<asp:TextBox ID="txtName" runat="server" class="txtFields" title="Name" />
<asp:TextBox ID="txtDescription" runat="server" class="txtFields" title="Description" />
I'm using the watermark plugin on these 3 TextBoxes:
jQuery('.txtFields').watermark();
This is the plugin:
http://code.google.com/p/jquery-watermark/
jQuery('.txtFields').watermark();
Uses the Title Attribute of the TextBox to Show the Watermark but the problem is that this also Generates ToolTips which is something I do Not want, is there anyway to disable the tooltips without removing the title attribute?
Or is there anyway to use custom attributes with this plugin? By that I mean making the plugin use another attribute instead of the title attribute.
Thank you.
Looks like watermark will allow you to specify any text to display in there, so you're not stuck with the title. Any attribute that you could select with jQuery you could use as the watermark value. The problem with that is there are no other attributes you could add in there and still have nice compliant code. Best bet is to give them a value, assign a variable that value, unset it and add watermark. Something like:
$('input').each(function() {
var wmark = $(this).val();
$(this).val('');
$(this).watermark(wmark);
});
Try adding UseAccessibleHeader = false
like this:
<asp:TextBox ID="txtTitle" runat="server" class="txtFields" title="Title" UseAccessibleHeader = false />
I am working with Ext.Net1.0. and I am working with Grid Panel with grouping
In that I had set Group Command I want to hide Group Command..
<ext:ImageCommandColumn Width="110">
<GroupCommands>
<ext:GroupImageCommand CommandName="Delete" Icon="Delete" Text="Delete" RightAlign="true">
<ToolTip Text="Delete" />
</ext:GroupImageCommand>
<ext:GroupImageCommand CommandName="Edit" Icon="TableEdit" Text="Edit" RightAlign="true">
<ToolTip Text="Edit" />
</ext:GroupImageCommand>
</GroupCommands>
</ext:ImageCommandColumn>
How can I get GroupCommand??
You can look in this thread http://forums.ext.net/showthread.php?11425-CLOSED-Reach-Command-coloumn-at-run-time-with-javascript&p=46416&viewfull=1#post46416
Done with in ext:ImageCommandColumn and In prepareGroupCommand Function we can get Command Name through(command.command).
Guys i have a serious problem, like in the image below , the styles menu is not showing for html rich editor in sharepoint 2010, i included the *.css file and the PrefixStyleSheet
any help ? :(
Did yor read http://msdn.microsoft.com/en-us/library/ms551040.aspx and especially the first section which specifies how to set the PrefixStyleSheet-property of the RTE-control? If you then add css-classes with the specified stylesheet-prefix in your css, they should show up in the Styles or Markup Styles section depending on the context of the editing.
Have you done the above steps?
If you set PrefixStyleSheet to, for example "Test", your css should look like this to have a H1 show up in the Markup Styles section:
H1.TestElement-H1
{
-ms-name: "Heading 1";
}
and markup:
<PublishingWebControls:RichHtmlField id="Content" PrefixStyleSheet="Test" FieldName="PublishingPageContent" runat="server" />
Get a copy of corev4.css and do a search for ms-rte. Keep searching untill you get to a bit that looks like this:
H1.ms-rteElement-H1 {
-ms-name: "Heading 1"
}
.ms-rteElement-H1 {
FONT-SIZE: 2em; FONT-WEIGHT: normal
}
Use the supplied values to build your own styles and Markups.
Assuming your prefix is PrefixStyleSheet="myPrefex"
Markup Styles seem to require 2 css entries each. So if you wanted a markup style called "HEADING ONE!!!FTW" that was 2em bold you would have:
H1.myPrefexElement-H1 {
-ms-name: "HEADING ONE!!!FTW";
}
.myPrefexElement-H1 {
FONT-SIZE: 2em; FONT-WEIGHT: bold;
}
Markup styles are applied to existing HTML tags, so it appears the logic behind rolling your own is to overload the HTML tag with your own class name and give it a label, then flesh out your class with the actual css goodness.
Items in the STYLES drop down seem to only require a single line:
.myPrefexStyle-Bold {
-ms-name: "Bold Bits";
font-weight:bold;
}
But besure to include the -ms-name attribute as this determines the text that appears in the drop down (If you dont have this attribute you end up with blanks)
PS: Dont forget to include your own css stylesheet in the master or layout or page. I ended up putting in my master page with: <SharePoint:CssRegistration ID="CssRegistration2" Name="<% $SPUrl:~SiteCollection/Style Library/MyCustomMarkup.css %>" After="corev4.css" runat="server"/>
[offtopic]Ive only just started with sharepoint, but boy is it a dogs breakfast behind the scenes! The horror, the horror![/offtopic]
To use a custom style prefix you must set both PrefixStyleSheet and Stylesheet property:
<PublishingWebControls:RichHtmlField AllowFontsMenu="True" FieldName="Page Content" runat="server" PrefixStyleSheet="custom-rte" Stylesheet="<% $SPUrl:~sitecollection/Style Library/custom_rte.css %>"/>
Remember that doing this you will overwrite all dropdowns, colors and other options in RTE, so if you want to only change the Styles dropdown you still must to copy all the default rules.