PDA

View Full Version : How to convert a html input text field to Ext js number field?



josephkirubakaran
27 Jan 2012, 4:38 AM
Hello,

I am using ExtJs 4.

I have a html page with a form. In that page I just want to convert a single input text field to a Ext js numeric field. I donno how to do that..

Here i dont have any Ext js form/panel. I need only one ext js number field and nothing else.

I have searched a lot for this and couldn't find the solution.. Can any one help me to do this?

Thanks in advance.

friend
27 Jan 2012, 4:51 AM
Here's a simple/ugly example. Note the use of the 'renderTo' attribute on the Number field:



<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>CheckboxModel Test</title>
<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css">
<script type="text/javascript" src="extjs/ext-all-debug-w-comments.js"></script>
<script type="text/javascript">
Ext.Loader.setConfig({enabled:true});

Ext.onReady(function() {
Ext.create('Ext.form.field.Number', {
fieldLabel: 'Age',
maxValue: 100,
minValue: 0,
name: 'age',
renderTo: 'ageField'
});
});
</script>
</head>

<body>
<form action="someAction" method="post">
<label>Name:</label> <input type="text" name="lastName"> </br>
<div id="ageField"></div>
</form>
</body>
</html>

josephkirubakaran
27 Jan 2012, 5:18 AM
Thank you friend.. But i want the same for input type and not for div. The given code is not woking when i change like
<input type="text" id="ageField"/>

Actually i am wrtting a common logic to upgarde all the input fields to number field based on the class it contains (say "numberField").

So is it possible?

josephkirubakaran
28 Jan 2012, 1:10 AM
Can any one help to do this?

ren_sk8er
8 Feb 2013, 1:34 AM
How to do this? I want to know the answers here.:( Same as html input text to ExtJS textfield