Silverstripe 3.1 中的 setLeftTitle答案

【问题标题】：setLeftTitle in Silverstripe 3.1Silverstripe 3.1 中的 setLeftTitle
【发布时间】：2023-12-16 09:40:01
【问题描述】：

我刚刚加入了 Silverstripe 的行列。我一直在尝试在getCMSfields 表单上的文本字段前获得以下静态文本效果：

Telephone number:   +36 [__________]

其中“电话号码：”显然是字段标题（可以通过->setTitle() 更改，+36 是输入字段左侧的静态前缀。

我一直在尝试使用->setLeftTitle('+36')，但它似乎没有任何效果。

顺便说一句。 ->setRightTitle('something') - 我希望在输入字段的右侧附加一个标签，与 ->setDescription() 的工作方式相同。

我很困惑。那么有什么方法可以实现我想要的吗？

【问题讨论】：

标签： silverstripe form-fields

【解决方案1】：

使用FieldGroup class

public function getCMSFields($fields) {
    $fields = parent::getCMSFields($fields);

    $fields->addFieldToTab('Root.Main',
        FieldGroup::create(
            new HeaderField('+36'),
            new TextField('PhoneNumber','')
        )->setTitle('Telephone number')
    );

    return $fields;
}

出于美观的原因，我个人会使用两个 TextField，并对 TelephonePrefix 进行一些验证。

【讨论】：

我用 LabelField 替换了 HeaderField，但尽管标签需要正确的 CSS 对齐。
您可以开始使用 Javascript/JQuery 调整各个字段，但要注意它如何影响 CMS 的其他部分。我还没有测试过这些，但它应该让你走上正确的道路。创建一个文件“somefile.js”并将其保存在 mysite/javascript 中。在 getCMSFields 中：public function getCMSFields(){Requirements::javascript("mysite/javascript/somefile.js");} 然后在您的 javascript 中，类似：$(function) { $("#some.selector").css({'attribute', 'value'})} 抱歉所有编辑，无法弄清楚评论标记
感谢！文档看起来很简洁，我很乐意阅读每个 sn-p。

【解决方案2】：

默认模板不呈现左侧标题。为此，您可能需要创建一个自定义表单域模板（称为FormFieldLeftTitle.ss）或其他东西，并在适当的位置包含$LeftTitle：

<div id="$Name" class="field<% if $extraClass %> $extraClass<% end_if %>">
    <% if $Title %><label class="left" for="$ID">$Title</label><% end_if %>
    <div class="middleColumn">
        $LeftTitle
        $Field
    </div>
    <% if $RightTitle %><label class="right" for="$ID">$RightTitle</label><% end_if %>
    <% if $Message %><span class="message $MessageType">$Message</span><% end_if %>
    <% if $Description %><span class="description">$Description</span><% end_if %>
</div>

然后您可以致电$myFormField->setTemplate('FormFieldLeftTitle') 使用此模板。

【讨论】：