Можно ли динамически добавлять правила CSS в элементы управления веб-частей Sharepoint 2010?
Возможно динамическое добавление HTML-элементов в метод CreateChildControls() WebPart, например:
protected override void CreateChildControls()
{
base.CreateChildControls();
. . .
HtmlGenericControl _breakingSpace = new HtmlGenericControl("br");
this.Controls.Add(_breakingSpace);
}
Можно ли добавить правила CSS программно? Например, я хочу сделать "метки" (LiteralControls) блочными элементами, чтобы можно было установить их значение ширины. Возможно ли что-то вроде следующего псевдокода?
CSSRule displayInlineBlock = new CSSRule("display: inline-block");
CSSRule width20em = new CSSRule("width: 20em");
reqDateStr.ApplyCSSRule(displayInlineBlock);
reqDateStr.ApplyCSSRule(width20em);
?
Я попытался применить эти правила CSS, встроенные в сам элемент управления Literal, следующим образом:
LiteralControl reqDateStr = new LiteralControl("<span class=\"finaff-webform-field-label\" style=\"display: inline-block\"; width:200px\">Requester Date:</span>");
... но это не работает по-другому, чем у меня было раньше, который был:
LiteralControl reqDateStr = new LiteralControl("<span class=\"finaff-webform-field-label\">Requester Date:</span>");
Вы можете увидеть, как выглядит форма здесь
ОБНОВИТЬ
В ответ на запрос ceej относительно того, что генерируется HTML, здесь, прямо из браузера "Show Source" ("inline" есть, но, похоже, не имеет никакого эффекта):
<h1>UCSC - Direct Payment Form</h1>
<table>
<tr>
<td colspan="4"><h2 class="finaff-webform-field-label">Section 1: Payment Information</h2></td>
<td colspan="2"><h2 class="finaff-webform-field-label">Section 2: Requester Information</h2></td>
</tr>
<tr>
<td><span class="finaff-webform-field-label" style="display: inline-block"; width:200px">Requester Date:</span></td>
<td><input name="ctl00$ctl24$g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c$ctl11" type="text" value="4/23/2015" class="finaff-webform-field-input" /></td>
<td><span class="finaff-webform-field-label">Payment Amount:</span></td>
<td><input name="ctl00$ctl24$g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c$ctl14" type="text" class="finaff-webform-field-input" /></td>
<td><span class="finaff-webform-field-label">Requester Name:</span></td>
<td><input name="ctl00$ctl24$g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c$ctl17" type="text" class="finaff-webform-field-input" /></td>
</tr>
<tr>
<td><span class="finaff-webform-field-label">Payee Name:</span></td>
<td colspan="3"><input name="ctl00$ctl24$g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c$ctl21" type="text" size="64" class="finaff-webform-field-input" /></td>
<td><span class="finaff-webform-field-label">Dept / Div Name:</span></td>
<td><input name="ctl00$ctl24$g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c$ctl24" type="text" class="finaff-webform-field-input" /></td>
</tr>
<tr>
<td><span class="finaff-webform-field-label">Remit Address:</span></td>
<td colspan="3"><input name="ctl00$ctl24$g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c$ctl28" type="text" size="64" class="finaff-webform-field-input" /></td>
<td><span class="finaff-webform-field-label">Phone:</span></td>
<td><input name="ctl00$ctl24$g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c$ctl31" type="text" class="finaff-webform-field-input" /></td>
</tr>
<tr height="2em">
<td><span class="finaff-webform-field-label"> OR</span></td>
</tr>
<tr>
<td><span class="finaff-webform-field-label">Mail Stop:</span></td>
<td colspan="3"><input name="ctl00$ctl24$g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c$ctl37" type="text" size="64" class="finaff-webform-field-input" /></td>
<td><span class="finaff-webform-field-label">Email:</span></td>
<td><input name="ctl00$ctl24$g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c$ctl40" type="text" class="finaff-webform-field-input" /></td>
</tr>
<tr>
<td><span class="finaff-webform-field-label">Last 4 Digits SSN or ITIN:</span></td>
<td><input name="ctl00$ctl24$g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c$ctl44" type="text" class="finaff-webform-field-input" /></td>
</tr>
<tr>
<td colspan="5"><input id="ctl00_ctl24_g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c_ctl47" type="checkbox" name="ctl00$ctl24$g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c$ctl47" /><label for="ctl00_ctl24_g_5f7ce2fb_5653_4cc9_b9b8_b00ee0d0910c_ctl47"><span class="finaff-webform-field-label">204 submitted or on file. <strong>NOTE:</strong> If not on file, complete a <a href="https://financial.ucsc.edu/Financial_Affairs_Forms/Payee_Setup_204.pdf" target="_blank">Payee_Setup_204</a></span></label></td>
</tr>
</table>
1 ответ
Это должно быть возможно. Что такое сгенерированный HTML, который производится? Действительно ли встроенный стиль выводится? HTML искажен?
Я думаю, что это может быть так же просто, как неправильно указать стиль в вашей строке, который применяет встроенные стили в конструкторе LiteralControl. Вы закрываете стиль после inline-block
- это не должно быть `style=\"display: inline-block; width:200px\? Это сделало бы полную строку
LiteralControl reqDateStr = new LiteralControl("<span class=\"finaff-webform-field-label\" style=\"display: inline-block; width:200px\">Requester Date:</span>");
Конечно, вы можете добавить динамические элементы управления в веб-части, и это должно быть сделано в CreateChildControls
метод. Лично я бы использовал LiteralControl
а не HtmlGenericControl
для размещения статического текста или разметки, таких как <br>
на странице.
Что касается CSS и стилей - большинство веб-элементов управления имеют CssClass
собственность и Style
имущество. Тем не менее, контроль, который вы выбрали (LiteralControl
) не. Рассматривали ли вы использование Label
контроль? Это создаст <span>
и вы можете установить Style
имущество. Вы бы что-то вроде
var reqDateStr = new Label
{
CssClass= "finaff-webform-field-label",
Text = "Requester Date:"
};
reqDateStr.Style.Add("display", "inline-block");
reqDateStr.Style.Add("width", "200px");
this.Controls.Add(reqDateStr);
Вы даже можете установить AssociatedControlId
свойство, которое приведет к <label for="textboxId">
будучи выходом. Значение должно быть идентификатором элемента управления вводом, например, вашего текстового поля. Это может быть желательно в вашем сценарии.
Надеюсь это поможет...