开发者

Sencha Touch: How to determine an input is the last in a FieldSet

So, if you add a bunch of inputs to a FieldSet, the last one has round corners on the bottom. In my form, tho, I hide and show inputs inside the form, depending on a Checkbox at the top of the form.

So now, it is possible that an input, tho logically not the last one in the Fieldset, to be visually, and temporarily, the last one.

Does anybody know how Sencha determines which is the la开发者_运维百科st input in the Fieldset? Just looks which one is the last in the array of inputs, or there is a property I can set to an input to tell it that it is the last one now ... ?


There is a CSS rule, .x-form-fieldset .x-field:last-child, which styles the last child of a fieldset to have rounded bottom corners. There is a bit more to the rule to handle edge cases, but any fields that are added (or hidden/shown) to that fieldset will have the appropriate styling applied just based on their HTML position alone.

The appropriate rule is in \resources\themes\stylesheets\sencha-touch\default\widgets\_form.scss:294 in release 1.1.0.


Thanks to mistagrooves post from above, I've managed to fix the problem. The idea is that I programmaticlly set a class "last" to the input I want it t be rendered as last, and then in my CSS, I rewrite the rules for that .last class like so:

.last, .last .x-form-field-container, .last .x-form-field-container * 
{
    -webkit-border-bottom-right-radius: .4em;
    border-bottom-right-radius: .4em;
    border-bottom: none;
}

.last, .last .x-form-label, .last .x-form-label * 
{
    -webkit-border-bottom-left-radius: .4em;
    border-bottom-left-radius: .4em;
}

Hope it helps

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜