I have this bit if code on my .cshtml page.
<a href='~/AudioFiles/#item.dateOfCall.ToShortDateString()_Store_Call.mp3'
class="btn btn-xs green tooltips" target="_blank" data-container="body"
data-placement="top" data-original-title="Play">
<i class="fa fa-play"></i>
</a>
I need to change the date to be 2014-02-19
instead of 2014/02/19
Current the link breaks because it is trying to go to 2014/02/19 which is invalid in windows file naming.
You could format the date like so:
<a href='~/AudioFiles/#item.dateOfCall.ToString("yyyy-MM-dd")_Store_Call.mp3'
class="btn btn-xs green tooltips" target="_blank" data-container="body"
data-placement="top" data-original-title="Play">
<i class="fa fa-play"></i>
</a>
For a full list of options check this page out http://msdn.microsoft.com/en-us/library/8kb3ddd4(v=vs.110).aspx
Related
I have downloaded a template for my app. I have to replace the menu links of this template with my project url links.
Code block of the menu link in template page::
<a href="#" class="list-group-item d-inline-block collapsed" data-parent="#sidebar">
<i class="fa fa-film"></i> <span class="d-none d-md-inline">
Item 2
</span>
</a>
I have to use this with::
#Html.ActionLink("Program", "Index", "karyakramModels")
I tried with the code ::
<a href="#" class="list-group-item d-inline-block collapsed" data-parent="#sidebar">
<i class="fa fa-film"></i> <span class="d-none d-md-inline">
#Html.ActionLink("Program", "Index", "karyakramModels")
</span>
</a>
I am not getting the CSS design with this code. Thank You!!!
As you have icon () inside the anchor tag, I would suggest #Url.Action() to use
<a href="#Url.Action('actionName', 'controllerName')" class="list-group-item d-inline-block collapsed" data-parent="#sidebar">
<i class="fa fa-film"></i> <span class="d-none d-md-inline">
Program
</span>
</a>
I am not able to display Arabic characters inside chosen drop down list, any body can help me please?
can you provide more info or snippet of your code?
there is actually no reason for HTML to complain about Arabic or any other language, it will just show what you input.
check this fiddle for example:
`<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
Display
<span class="caret"></span>
</button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
<li>السلام</li>
<li>عليكم</li>
<li class="divider"></li>
<li>كيف</li>
<li>الحال؟</li>
</ul>
</div>`
http://jsfiddle.net/n4xfcvsw/100/
I have a table with sliders (part of a form) in one column and a button (link to other page)
<button onclick="location.href='/main';">
<i class="icon icon-078-settings icon--s2" aria-hidden="true"></i>
</button>
Instead of opening the page, the button just submits the form. Any way I can fix this without breaking the table or the form?
Why don't just use anchor tag
<a href='/main'>
<i class="icon icon-078-settings icon--s2" aria-hidden="true"></i>
</a>
or
# If you are using erb
<%= link_to '/main' do %>
<i class="icon icon-078-settings icon--s2" aria-hidden="true"></i>
<% end %>
try below code:
<a href='/main' class="btn btn-primary">
<i class="icon icon-078-settings icon--s2" aria-hidden="true"></i>
</a>
If you used bootstrap css then you can add classes btn and btn-paimary which makes button.
Instead of opening the page, the button just submits the form.
Yes! Buttons are meant to perform actions that effects on front-end or back-end, they are not meant for navigation. You should use links(a.k.a anchors) to perform navigation.
<a href='/main'>
<i class="icon icon-078-settings icon--s2" aria-hidden="true"></i>
</a>
I have an angular 2 application that uses bootstrap 3.3.7 and jquery 1.12.4. The code is as follows:
<div class="btn-group">
<button type="button" class="btn dropdown-toggle"
title="More actions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
>
<span class="sr-only">More actions</span>
<i class="fa fa-ellipsis-v fa-lg" ></i>
</button>
<ul class="dropdown-menu dropdown-menu-right menu" role="menu">
<li>
<button *ngIf="itemViewModel.IsCopy !== true" type="button" class="btn dropdown-button" (click)="Copy($event)" title="Copy"
>
<i class="fa fa-files-o" (click)="Copy($event)"></i>
Copy
</button>
</li>
<li>
<button type="button" class="btn dropdown-button" (click)="Move($event)" title="Move">
<i class="fa fa-arrows" (click)="Move($event)"></i>
Move
</button>
</li>
<li>
<button *ngIf="itemViewModel.IsShare !== true" type="button" class="btn dropdown-button" (click)="Share($event)" title="Share">
<i class="fa fa-share " (click)="Share($event)"></i>
Share
</button>
</li>
<li>
<button type="button" class="btn dropdown-button" (click)="removeItem($event)" title="Delete">
<i class="fa fa-trash" (click)="removeItem($event)"></i>
Delete
</button>
</li>
</ul>
</div>
The dropdown menu appears fine. But clicking on the individual buttons in the list is not invoking the associated event handler. This issue is occurring on Safari browser on iOS and Chrome on Android. However, it works perfectly on Edge and Chrome on the laptop/desktop.
I have tried various solutions provided for earlier versions of Bootstrap on stackoverflow and github, but they aren't working.
How do I get this to work?
I resolved this issue by using the dropdown from ng2-bootstrap --> https://github.com/valor-software/ng2-bootstrap
I'm trying add an icon with using awesome font.
I used bootstrap button type and it's working fine.But when i would like to add a social icon using tag it does not seem.How can i do that ?
<div id="socialLoginList">
<p>
#foreach (AuthenticationDescription p in loginProviders)
{
<button type="submit" class="btn btn-lg btn-social btn-#p.AuthenticationType.ToLower()" id="btn-socialID" name="provider" value="#p.AuthenticationType" title="Log in using your #p.Caption account"><i class="fa fa-#p.AuthenticationType"></i>#p.AuthenticationType</button><br /><br />
}
</p>
</div>
Simply do a ToLower here:
<i class="fa fa-#p.AuthenticationType.ToLower()">
Font awesome icons are all lower case, so it should pick them up if you do a ToLower. Remember that HTML class names are case-sensitive.
E.g.
<i class="fa fa-google"></i>
<i class="fa fa-facebook"></i>