CODEWITHSUNDEEP
htmlextjs
Annie W.
Annie W.

Reputation: 448

include extjs field in html form

I've a pure html form and need to html inputs mixed with ExtJS fields but don't want to use ExtJS panel/form/application, only inject an ExtJS field in html form.

Here my sample coding (not working):

<html>
<head>
<title>Dummy</title>
<link href="http://cdn.sencha.io/ext-4.1.1-gpl/resources/css/ext-all.css" rel="stylesheet" />
<script src="http://cdn.sencha.io/ext-4.1.1-gpl/ext-all.js"></script>
</head>

<body>
<form action="dummy.php" method="get">
First: <input name="first"><br>
<div id='div1'></div>
<script type="text/javascript">
Ext.create( 'Ext.form.TextField', {
    id:'second',
    value:'second',
    renderTo:'div1'
})
</script>
<input type=submit value="Ok">&nbsp;<input type=reset value="Cancel"><br>

</form>

</body>
</html>

Could you give me a hint how to get such mix?

Upvotes: 1

Views: 3077

Answers (2)

Annie W.
Annie W.

Reputation: 448

This problem ('renderTo' generates error 'TypeError: Ext.resetElement is undefined') occurs in ExtJS 4.1.1 but doesn't occur in ExtJS 5.0.

For ExtJS 4.1.1 is a workaround possible (found in Internet):

Ext.resetElement = Ext.getBody();  // #WORKAROUND
Ext.create( 'Ext.form.TextField', {
    id:'second',
    value:'second',
    renderTo:'div1'
})

Upvotes: 1

Darin Kolev
Darin Kolev

Reputation: 3409

You can create ExtJS components but after the library files are loaded. That means inside of Ext.onReady():

Ext.onReady(function(){
    Ext.create('Ext.form.TextField', {
        id:'second',
        value:'second',
        renderTo:'div1'
    });
});

I updated your example here.

Upvotes: 0

Related Questions