PDA

View Full Version : [CLOSED] Set and Get Attribute and Value to a field



matrixwebtech
Sep 03, 2014, 10:12 AM
Hi

I have a NumberField



X.NumberField()
.ID("txtDiscounta")
.HideTrigger(true)
.Name("m")

I want to set an attribute to this,like


foo=bar

and after this I have a script ,where I select fields by name,and loop though with fields


var fields = Ext.select('*[name=' m ']');
fields.each(function (field) {

})



I need the Value for the particular Attribute.for each field.

Is there property for assign attribute to a field?please give some sample.

matrixwebtech
Sep 03, 2014, 12:34 PM
I try


X.NumberField()
.ID("txtDiscounta")
.HideTrigger(true)
.Name("m")
.HideLabel(true)
.EnableKeyEvents(true)
.Listeners(l =>
{
l.Render.Handler = @"this.getEl().set({
foo : 'bar'
});";

})


var fields = Ext.select('*[name=' m ']');
fields.each(function (field) {
console.log(field.getAttribute("foo"));

})

but not working

Daniil
Sep 03, 2014, 1:41 PM
Hi @matrixwebtech,

I think your JavaScript code has a syntax error. If you run it, you should see an error message.

matrixwebtech
Sep 03, 2014, 2:35 PM
Yes there are a javascript error,I rectify ,but not working,Its give null


<script>
Ext.onReady(function () {
var fields = Ext.select('*[name= m]');
fields.each(function (field) {
console.log(field.getAttribute("foo"));

})
})

</script>


@(X.NumberField()
.ID("txtDiscounta")
.HideTrigger(true)
.Name("m")
.HideLabel(true)
.EnableKeyEvents(true)
.Listeners(l =>
{
l.Render.Handler = @"this.getEl().set({
foo : 'bar'
});";

})
)

Daniil
Sep 03, 2014, 2:47 PM
Ext.onReady fires before rendering of the NumberField.

Another moment that this

Ext.select('*[name= m]')
retrieves an input HTML element, but a NumberField's getEl

this.getEl()
a table HTML element which is a wrapper from the input element.

matrixwebtech
Sep 03, 2014, 3:08 PM
Hi, Danill


but a NumberField's getEl


this.getEl()
a table HTML element which is a wrapper from the input element.

not understand properly.its very help full for me if you provide some sample.

Situation : I have 2 fields and I set 2 different value for the attribute ,when change event fires I take fields by name and check there attribute and doing a calculation as per attribute's value. so I write bellow code.can you please tell me ,how to achieve this.


@using Ext.Net
@using Ext.Net.MVC

@{
var X = Html.X();
Layout = null;
}
<script>
var calculate = function () {
var fields = Ext.select('*[name= m]');
fields.each(function (field) {
console.log(field.getAttribute("calculationtype"));

})
}

</script>
@X.ResourceManager()


@(X.NumberField()
.ID("txt1")
.HideTrigger(true)
.Name("m")
.HideLabel(true)
.EnableKeyEvents(true)
.Listeners(l =>
{
l.Render.Handler = @"this.getEl().set({
calculationtype : 'plus'
});";
l.Change.Handler = "calculate()";

})
)
@(X.NumberField()
.ID("txt2")
.HideTrigger(true)
.Name("m")
.HideLabel(true)
.EnableKeyEvents(true)
.Listeners(l =>
{
l.Render.Handler = @"this.getEl().set({
calculationtype : 'minus'
});";
l.Change.Handler = "calculate()";

})

)

Daniil
Sep 03, 2014, 3:25 PM
I don't have a sample, but I have a recommendation. If you use NumberFields, it is better to deal with them as with instances of JavaScript classes, not with HTML elements that they render. Is there any reason why you deal with HTML elements directly?

matrixwebtech
Sep 03, 2014, 3:35 PM
I have 8-10 number field on a page ,and I have to do mathematical calculation with them. may be there are some tax and addition charge fields and some discount fields .tax fields values add with total and discount fields values subtract from total.thats why I try to add attribute to fields


calculationtype : 'plus'

and


calculationtype : 'minus'

so that when


calculate()
function call and loop through fields ,I can understand which value need to add and which need to subtract .

matrixwebtech
Sep 03, 2014, 3:36 PM
I have 8-10 number field on a page ,and I have to do mathematical calculation with them. may be there are some tax and addition charge fields and some discount fields .tax fields values add with total and discount fields values subtract from total.thats why I try to add attribute to fields


calculationtype : 'plus'

and


calculationtype : 'minus'

so that when


calculate()
function call and loop through fields ,I can understand which value need to add and which need to subtract .

what do you mean by this,

it is better to deal with them as with instances of JavaScript classes,

I will found a post http://www.sencha.com/forum/showthread.php?128322-Custom-attributes-to-ExtJS-controls&p=963003&viewfull=1#post963003
If I do like this is that working?
If so can you please let me know the syntax of

inputAttrTpl

Daniil
Sep 03, 2014, 4:21 PM
You can define any property on a NumberField itself.

@(X.NumberField()
.ID("NumberField1")
.CustomConfig(cc => cc.Add(new { somePropertyName = "some value" }))
)
and access it in JavaScript

App.NumberField1.somePropertyName

matrixwebtech
Sep 03, 2014, 4:59 PM
Hi ,

I use

.InputAttrTpl(X.XTemplate().Html("foo=minus"))
and get attribute value from javascript by


field.getAttribute("foo")

problem solved.this can be mark as close.

matrixwebtech
Oct 27, 2014, 3:42 PM
Hi,
Can you please let me know how I add multiple attribute(syntax) with .InputAttrTpl().like

X.XTemplate().Html("foo=minus,bar=plus,zoo=devide")

is above syntax is correct?

Daniil
Oct 27, 2014, 5:19 PM
Please try

.Html("foo=minus bar=plus zoo=divide")