PDA

View Full Version : [CLOSED] Text Align right in fields and gridcolumn



matrixwebtech
Oct 01, 2014, 9:16 AM
I want
text-align:right for these fields which contain numeric or decimal value,is there any property in InputField or in GridColumn ehere I can set text alignment?

I use


.x-grid-cell-inner {
text-align:right!Important;
} for grid panel ,and all field's text aligned right,but how can I do this for a specific column in grid panel.

and I use

X.TextField().Text("20.36").StyleSpec("text-align:right") but text not aligned to right.

what to do?

Daniil
Oct 01, 2014, 2:35 PM
Hi @matrixwebtech,

Do you have TextFields in a GridPanel? Do you use ComponentColumns or, maybe, you mean Editors?

Please clarify.

Providing us with a runnable test case is the best way to go.

matrixwebtech
Oct 02, 2014, 5:20 AM
Hi Daniil bellow is some sample


@(

Html.X().GridPanel()
.ID("GridPanel1")
.Store(
Html.X().Store()
.DataSource(ViewBag.loadgrid)
.Model
(
X.Model()
.ID("mid")

.Fields
(
X.ModelField().Name("text").Type(ModelFieldType.String),
X.ModelField().Name("value").Type(ModelFieldType.Float)
)

)
)
.ColumnModel(
Html.X().Column().DataIndex("text").Text("text").Flex(1).StyleSpec("text-align:right"),
Html.X().Column().DataIndex("value").Text("value").Flex(1).StyleSpec("text-align:right")
)


)

@(X.TextField().Text("25.36").StyleSpec("text-align:right"))
@(X.NumberField().Text("25.36").StyleSpec("text-align:right"))


public class textalignController : Controller
{
//
// GET: /textalign/

public ActionResult Index()
{
ViewBag.loadgrid = getSampleData();
return View();
}


private List<textalign> getSampleData()
{
List<textalign> _textalign = new List<textalign>();
_textalign.Add(new textalign
{

text = "Sample text",
value = 10.36,

});
_textalign.Add(new textalign
{

text = "some more Sample text",
value = 25.38,

});

return _textalign;
}
}

public class textalign
{
public string text { get; set; }
public double value { get; set; }
}

Q 1.How do set cell's text alignment for grid?i try with
.StyleSpec("text-align:right") for grid column but cell's text alignment not changed,It will change header text alignment.

Q 2.For TextField or NumberField how do I set text-alignment?

Daniil
Oct 02, 2014, 12:20 PM
Please set this for Columns:

.Align(Alignment.Right)
http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.grid.column.Column-cfg-align

Please use for the TextFields and NumberFields:

.FieldStyle("text-align:right")
http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.form.field.Base-cfg-fieldStyle

Or the Cls property:
http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.AbstractComponent-cfg-cls

matrixwebtech
Oct 03, 2014, 6:31 AM
Thank you Daniil,you can close this.