Getting started with ASP.NET

**abolotnov** · 10 Mar 2007 7:20 AM

Hello,

the Resizable component is so awesome! I would like to use it in one of my Bible projects to allow people to have a resizable reading pane to be comfortable with the width of the pane.

The only problem is that I don't know how to get started with it - I see that the simple way is to create a div and give it a name and then create a new Basic against this name. Which libraries to I need to download (can't find any downloads on the site though)?

Any help will be greatly appreciated. Thanks!

**tryanDLS** · 10 Mar 2007 8:32 AM

You can download the current .33 release from jackslocum.com. Or the new 1.0 alpha code from the link in the Alpha discussion forum. All the examples are in the zip file

**abolotnov** · 10 Mar 2007 8:42 AM

Originally Posted by tryanDLS

You can download the current .33 release from jackslocum.com. Or the new 1.0 alpha code from the link in the Alpha discussion forum. All the examples are in the zip file

Thanks for your answer, I did download the libs and now trying to play with examples.

I unpacked everything into "ext" folder and tried to make a simple html page with the resizable box. I tried to follow the resizable/basic.html example and it don't seem to work for me. Here is what I have so far:

copied basic.css and basic.js from example's folder and there is ext folder in the same root with the following html file:

<html>
<head><title>simple test</title>
<link rel="stylesheet" type="text/css" href="ext/ext-all.js" />
<link rel="stylesheet" type="text/css" href="ext/yui-utilities.js" />
<link rel="stylesheet" type="text/css" href="ext/ext-yui-adapter.js" />
<link rel="stylesheet" type="text/css" href="basic.js" />
<link rel="stylesheet" type="text/css" href="basic.css" />
<link rel="stylesheet" type="text/css" href="ext/resources/css/resizable.css" />
</head>
<body>
<div id="basic">Resize Me!</div>

</body>
</html>

I get the good looking box with "Resize me!" inside, but it won't resize nor highlight the edges when hovered. I know I am dumb. If you could help a bit here, this would be totally great. Thanks.

**tryanDLS** · 10 Mar 2007 8:56 AM

Use Firebug to verify that your js files are getting loaded. Are you sure you have your paths correct?

**abolotnov** · 10 Mar 2007 9:01 AM

Originally Posted by tryanDLS

Use Firebug to verify that your js files are getting loaded. Are you sure you have your paths correct?

I figured that the html file I made was wrong I changed it to this (but now getting an "object expected on the "var basic = ... " line)

<html>
<head><title>simple test</title>

<script type="text/javascript" src="ext/yui-utilities.js"></script>
<script type="text/javascript" src="ext/ext-yui-adapter.js"></script>
<script language="javascript" src="basic.js"></script>
<link rel="stylesheet" type="text/css" href="basic.css" />
<link rel="stylesheet" type="text/css" href="ext/resources/css/resizable.css" />

</head>
<body>
<div id="basic">Resize Me!</div>

<Script language="javascript" type="text/javascript">
var basic = new Ext.Resizable('basic', {
width: 200,
height: 100,
minWidth:100,
minHeight:50
});
</Script>

</body>
</html>

**abolotnov** · 10 Mar 2007 9:08 AM

Originally Posted by tryanDLS

Use Firebug to verify that your js files are getting loaded. Are you sure you have your paths correct?

I used firebug and the scripts are there - paths seem to be correct - I get the following errors with it:

Ext.EventManager has no properties
file:///C:/Inetpub/wwwroot/eBible/utils/basic.js
Line 89

Code:

Ext.EventManager.onDocumentReady(ResizableExample.init, ResizableExample, true);

Ext.Resizable is not a constructor
file:///C:/Inetpub/wwwroot/eBible/utils/test.html
Line 21

Code:

<Script language="javascript" type="text/javascript">
var basic = new Ext.Resizable('basic', {
        width: 200,
        height: 100,
        minWidth:100,
 LINE 21->>       minHeight:50
});
</Script>

**Animal** · 10 Mar 2007 9:35 AM

You are not actually including Ext there. You need ext-all.js

**abolotnov** · 10 Mar 2007 9:52 AM

Originally Posted by Animal

You are not actually including Ext there. You need ext-all.js

many thanks - this helped

one last question about this - is there a way to actually hinder users from resizing the box in heigth?

**Animal** · 10 Mar 2007 10:36 AM

"the box" :?: :?: :?: :?:

**brian.moeskau** · 10 Mar 2007 12:52 PM

Look at the handles config option -- if you want to restrict resizing to horizontal only, for example, pass 'handles: e,w' to the Resizable constructor. Is that what you're asking?

Getting started with ASP.NET

Thread Tools

Search Thread

Display

Getting started with ASP.NET

Getting started with ASP.NET

Thanks

Thanks

Similar Threads

Getting started with YUI

Getting Started with YUI

getting started

Could not get started.

A little help getting started...