I have an ASP.NET AJAX autocomplete extender with CompletionListCssClass=autocomplete_completionListElement :
.autocomplete_completionListElement
{
width:500px;
margin : 0px!important;
background-color : inherit;
color : windowtext;
border : buttonshadow;
border-width : 1px;
border-style : solid;
overflow :auto;
height : 200px;
text-align : left;
}
But for some odd reason the width of the auto complete list always takes up the width of the textbox even when I set the width to 500px. Is there a way to fix this?
I believe you can also accomplish this by changing
width:500px;
to
width:500px!important;
Tim Mackey expounds more in this blog post. Basically you have to use !important to override the CSS spit out by the control itself.
I finally figured it out. I used the OnClientPopulated="onListPopulated" property as follows:
function onListPopulated() {
var completionList = $find("AutoCompleteEx").get_completionList();
completionList.style.width = 'auto';
}
You need to set the min-width to 500px
Related
In my stylesheet I have this declared
#font-face {
font-family: 'light';
src: url('Fonts/HelveticaNeueLTStd-Lt.otf') format('opentype');
}
Now in my C# code behind I try to set the class like this
row.CssClass = light;
But I get a compile error of
The name 'light' does not exist in the current context
Is it possible to reference a css class #font-face from C# codebehind?
EDIT
This is how I am attempting to use this - I have tried the below
.lightfontface {
font-family: 'light';
}
#font-face {
font-family: 'light';
src: url('Fonts/HelveticaNeueLTStd-Lt.otf') format('opentype');
}
row.CssClass = lightfontface;
I believe your
row.CssClass = light;
needs to be
row.CssClass = "className";
and your css will need a .className entry.
Imagine your html row:
<tr class="className">stuff</tr>
Your CssClass assignment is assigning the value to class, and your css can use a class selector to format that row.
To sum up some of the comments, the style sheet entry should simply be:
.className { font-family: 'light'; }
Ordering on your style sheet is important. Put the font-face definition above the .className style entry. See: https://www.w3.org/TR/CSS2/cascade.html#cascading-order
I encounter some design problems.
I have a page with a JQuery Calendar (full-calendar) and I need to retrieve two IDs depending on the current month.
Which is the best solution ?
Retrieve the IDs using an Ajax Request each time the calendar is re-rendered (the month changed)
Loading all the Ids (I use Asp.Net Mvc) once and then filtering.
I tried to use the first solution but when the user switch the month too fast (January to February per example), it affects January IDs to February because the user switched too fast (before the first requests actually finished).
Hope I'm clear.
Thank you in advance.
The First Method is prefereable. What you can do is add a time disable ,for me a loader is of best usage in this type of situations
Css :
body.loading {
overflow: hidden;
}
body.loading .modal1 {
display: block;
}
.modal1 {
display: none;
position: fixed;
z-index: 1000;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: rgba( 255, 255, 255, .8 )
url('Loaderurl')
50% 50%
no-repeat;
}
View -
add this at bottom
<div class="modal1"></div>
Script-
$body = $("body");
$(document).on({
ajaxStart: function () {
$body.addClass("loading");
},
ajaxStop: function (e) {
$body.removeClass("loading");
}
});
Thanks for the help.
What I chose to do is to initialize an array where I put all the needToCancel ajax requests and created a cancelAjaxRequests method that I call each time I change the month.
var lastMonthAjaxRequests = [];
lastMonthAjaxRequests.push(... my ajax requests...)
function abortAjaxRequests(ajaxRequests) {
$.each(ajaxRequests,
function() {
this.abort();
});
}
Then each time my calendar is re-rendered :
abortAjaxRequests(lastMonthAjaxRequests);
lastMonthAjaxRequests = [];
I'm building some HTML in a StringBuilder like so:
builder.Append("<tr align='center' valign='top' class=\"skyBlueBackground textAlignCenter\">");
List<String> columnHeadings = GetColumnHeadings(monthCount, _begindate);
foreach (String s in columnHeadings)
{
if (s.Equals("Grand Total"))
{
builder.Append("<td align='left' valign='top' class=\"forestGreenBackground whiteText\"><b>");
}
else
{
builder.Append("<td align='left' valign='top'><b>");
}
builder.Append(s);
builder.Append("</b></td>");
}
builder.Append("</tr>");
Although I've got a class for centering text:
builder.Append("</style>");
. . .
builder.Append(".textAlignCenter { text-align: center; }");
builder.Append("</style>");
...the text is aligned left; it works other than that (skyblue background), it just stays magnetized to the left:
What must I do to get the text to center?
You should either set the textAlignCenter on the TD, not the TR or change the CSS definition to:
builder.Append(".textAlignCenter td { text-align: center; }");
And you should remove the explicit "align='left'" from your TD because that will still overrule the CSS.
If you are asking for how to vertically align the text, you could use the vertical-align CSS property. See here for more info.
You could also use the valign attribute, but it is deprecated in HTML5 and it is not a recommended approach.
Your problem is simply, you have created correctly the css class property .textAlignCenter, but your attribute align="left" on the <td> has style priority.
I think you can do two solutions:
Put the class .textAlignCenter on the td you want to align
center.
Remove the align="center" of the td and add a css like
this:
tr td {text-align:left}
tr td.textAlignCenter {text-align:center}
With this last solution you overwrite the last style.
I saw a couple of posts on how to change the color of a grid's row.
I tried to implement it like this:
Grid:
viewConfig: {
stripeRows: false,
getRowClass: function (rec, idx, rowPrms, ds) {
return 'master-row'
}
}
CSS:
master-row {background: red; color:Green}
the color Green is displaying fine, the backgorund isn't. I also tried with background-color, but no luck
What may I be missing?
Use this:
.master-row .x-grid-cell {background: red; color:Green}
You're adding a class so you'll need to use the css class selector (a point).
To color the cells u need to give the underlying grid cell a color and background color
I need to change the font size of bold thing below. I have a css for use but this bold part needs font changed to 8px instead of 10(css). i want someone to help me with how to change in Code behind.
string newpackname = dschkdowngraded.Tables[0].Rows[0]["ChangedTo"].ToString();
DateTime dt = Convert.ToDateTime(dschkdowngraded.Tables[0].Rows[0]["TakesAffect"]);
dt = dt.Date;
// need to change what is inside the ()
string packname = accountSummary.PackageName + " (Downgraded to "
+ newpackname + ". Effective from " + dt + ")";
Css is here:
float: left;
padding-right: 10px;
color: #0d7194;
font-weight: bold;
You can have two css classes, then change the css class propery ofr the relevant label.
myLabel.CssClass = "someClass";
Use CSS for this, when you do it in your codebehind you need to build and deploy whenever you want to change the font size. With CSS you can just change it.
Give the labels that need a smaller text an other class like Tom Gullen suggests