I would like to do different button when there is null(no image) in the database. But, it shows two buttons instead of one button only. Can you guys help me? I tried at the frontend only. If there are solutions to do at the backend, please share some codes.
This is the codes that I've tried at the frontend.
<a href="#" id="ImageButton2" class="btn btn-success" visible='<%# If(IsDBNull(Eval("ImagePic")), True, False)%>'>No Image</a>
Actual Image </td>
The html anchor tag doesn't have an attribute visible. You either meant to use a server side control like asp:HyperLink which does have a Visible property an will render the appropriate html, or you need to set the visibility by CSS style on your client side html, for example by controlling the display property:
<a ... style='display: <%# If(IsDBNull(Eval("ImagePic")), "inline", "none")%>'>No Image</a>
Related
Angular Material is awesome for creating colour-themed sites. As well is the usual palettes, you can create dynamic themes without SCSS, using directives like...
md-colors="{background:'primary'}"
...to set the theme colour of any element. With a few lines of code like this, you can easily change the colour of your whole site, or set it dynamically from data:
.config(function($mdThemingProvider) {
var color = 'pink';
$mdThemingProvider.theme('dark')
.primaryPalette(color)
.dark()
;
My site has a few custom elements which require hover states, and the ideal thing would be to have these light up in the accent colour or primary colour. But is there a way to apply md-colors or similar to a hover state?
My conventional hover states look like this in CSS, of course :
.post a:hover{
background-color:#f00;
}
Here is a codepen set up for you to play with : https://codepen.io/anon/pen/PJRzOQ
In case anyone is desperate to use md-colors as a hover state, its not possible according to the docs. But I created a work-around by setting the background color with md-colors, and hiding it behind another element. The hover state then makes the top layer transparent, so it appears to be a dynamically set hover state!
You can see an example here:
https://codepen.io/anon/pen/oGqPeE
the html layout looks like this :
<ul ng-if="link" md-theme="myTheme">
<li ng-repeat="linkObj in link" md-colors="{background:'primary'}">
<a ng-href="{{linkObj.link_url}}" target="_blank" md-colors="{background:'accent'}"> <span ng-bind="linkObj.link_title" md-colors="{color:'accent'}"></span>
</a>
</li>
</ul>
In my Angular app I have a button where I apply a CSS style depending on the $index from the ng-repeat.
However whats happening is on page load the buttons style appears as the default (which is class button) for a second before applying the actual style I want (which is customColour{{$index}}).
<button type="button" ng-click="superAction($index)"
class="small button customColour{{$index}}">
</button>
I have confirmed that it must be down to the delay in getting the $index value having spent the last 4 hours playing around with the CSS files (ensuring things like my custom style appears at the top of my css file etc).
So any ideas/suggestions I can try would be appreciated.
I define a spinner, when the page need to do some thing for example bring some data from database i want to show it, and when its done i want to hide this spinner, so i decide to define some thing like this in Layout.cshtml :
<div id="SpinnerDiv" ng-show="showSpinner">
<div id="AllContent">
<!--I put all of my contents here-->
<div>
</div>
but there is a problem in this method, when i put ng-show to False it will hide it's child too, so its not the right way, anyone one can help how can i implement a spinner ?
Your spinner should be managed by adding/removing a specific css class to <div id="AllContent">
I am trying to get a popup window that displays a view on top of my main view. I basically want to use the idea that many project management applications use, such as VersionOne and JIRA. In JIRA, under an epic, there is a "Create issue in epic" feature that gives you a popup window that is essentially a form. I am just trying to get the popup window (same size, displays data) to work with AngularJS.
A snippet from my main view where I am linking to the detailed view. I assume the magic will happen in the <a> tag.:
<h6 data-toggle="popover" data-placement="top" data-content="commands">
<a href="partials/instance-view.html">
{{instance.name}}
</a>
</h6>
The secondary view is just displayed in the instance-view.html file. I don't think the <h6> tag is messing anything up, but I could be wrong. Also, I know that since I am trying to display a link inside a popover tag, the popover won't work. I can always fix that later.
Assume you are using bootstrap?
If so, have you tried using the bootstrap popover plug-in inside your tag rather than your ?
i.e. ...
<h6>
{{instance.name}}
</h6>
Modals should be used for what is trying to be achieved. In particular, Bootstrap Modals.
I am trying to use hover to show dropdown / popover and use data-container="self" to make the dropdown / popover stay appear when mouse moved to it. This method works on Google Chrome but not on Firefox.
Example Code:
<button type="button" data-placement="right" data-trigger="hover | click" data-delay="300" bs-dropdown="dropdown" data-container="self">Click to toggle dropdown</button>
How can I get it works on firefox?
I never heard of the self keyword as the container parameter in angular-strap. Where does it come from?
Anyway, here, container is useful if you want to append the dropdown to another element. Since it does not seem to be your case, simply do not provide data-container, and the dropdown will be appended to the element itself.
EDIT:
Okay, so, I tried, and saw the problem you are describing. You could try the solution given here (https://stackoverflow.com/a/21293850/4506790): add a specific class to your button, and give it in data-container.
<button type="button"
class="dropdown-btn"
data-placement="right"
data-trigger="hover"
data-delay="300"
bs-dropdown="dropdown"
data-container=".dropdown-btn">
Hover to toggle dropdown
</button>