If I define slider like in example bolow I can see that pointer is not aligned with ruller

Code:

<input class="easyui-slider" style="width:300px" 
    data-options="showTip:true,min:1,max:24,value:12,rule: [1,'|',6,'|',12,'|',18,'|',24]">

Thanks stworthy!

I have one more question to this example.

There is a input element in panel. I'm going to have a number of input elements but part of them should be hidden for a while.

So, I put

Code:

<style>
    .hiddenElement {display:none}
</style>
<p class="hiddenElement"><b>test:</b>
<input id="test" name="tcName" class="easyui-textbox" style="width:100%" disabled></p>
<script>
function displayItemsByClassName(className,value){
	var items = document.getElementsByClassName(className);
	for (var i=0; i<items.length; i++) items[i].style.display = value;
}
</script>

Using displayItemsByClassName('hiddenElement','inline'); function call I show hidden elements but all of them do not look like if they were not hidden at the beginning. Input width is not 100% and behaves really strange when I resize 'east' panel.

Can you advice what should be done in order to get it fixed?

[collapsed:true]

Hi,

One comment to http://jsfiddle.net/k0o6afhL/1/ example:

If I set collapsed:true parameter for east panel and run this example then when I open east panel I see that toolbar is located not on top of the panel.

Can you check this?

Thanks,
//V

It works.

What is the difference? Why it works like this?

What about syntax error?

Also I can see that load Ajax load is not working in Chrome when loading local file, not remote from web server. (see jquery-easyui-1.4.5/demo/tabs/nestedtabs.html example)

It seems like it is Chrome thing as it does not work in many examples.

XMLHttpRequest cannot load file://3pp/jquery-easyui-1.4.5/demo/treegrid/treegrid_data1.json. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

[new.html (short copy of basic.html from treegrid demo)]

Hi,

I have the following code

Code:

<script>
	function addTab(){
		address = 'new.html';
		if ($('#docTabs').tabs('exists','New')){
			$('#docTabs').tabs('getTab','New').panel('refresh',address);
			$('#docTabs').tabs('select','New');
		} else {
			$('#docTabs').tabs('add',{title:'New',href:address,closable:true});
		}
	}
</script>
<div id="docTabs" class="easyui-tabs" style="width:700px;height:250px">
	<div title="TEST" style="padding:10px">
		<input type="button" onclick="addTab()" value="TEST">
	</div>
</div>

new.html (short copy of basic.html from treegrid demo)

Code:

<table title="Folder Browser" class="easyui-treegrid" 
		data-options="
			url: 'treegrid_data1.json',
			method: 'get',
			rownumbers: true,
			idField: 'id',
			treeField: 'name'
		">
	<thead>
		<tr>
			<th data-options="field:'name'" width="220">Name</th>
			<th data-options="field:'size'" width="100" align="right">Size</th>
			<th data-options="field:'date'" width="150">Modified Date</th>
		</tr>
	</thead>
</table>

1) When I press button I get

Code:

syntax error ......  treegrid_data.json:1:1

This problem is visible in Firefox with basic.html from treegrid demo folder.

2) When I press button again (the New tab is already oppened) I get this:

Code:

TypeError: $.data(...) is undefined .......jquery.easyui.min.js:10107:7

Perfect!

Thanks!

I'm trying to put the following table

Code:

<table style="width:100%" border=1>
	<tr>
		<td style="width:30px"><input class="easyui-textbox" style="width:30px" value="TC" disabled></td>
		<td style="width:5px">-</td>
		<td style="width:130px"><input class="easyui-textbox" style="width:130px" value="CODE" disabled></td>
		<td style="width:5px">-</td>
		<td style=""><input class="easyui-textbox" style="width:100%" value="UNIQ_ID" disabled></td>
	</tr>
</table>

into "east" layout (inside Dialog) discussed in this topic http://www.jeasyui.com/forum/index.php?topic=5742.0

When I resize panel to make it bigger UNIQ_ID field gets bigger as expected but it is not getting smaller when I resize panel in opposite direction.

Do you know what I'm doing wrong?

Thanks!

I have menu and I would like to check iconCls parameters for all of them and do something after that ...

Code:

<div id="mm" class="easyui-menu" style="width:120px">
	<div id="m1" iconCls="icon-ok">Item1</div>
	<div class="menu-sep"></div>
	<div id="m2" iconCls="icon-ok">Test</div>
	<div id="m3" iconCls="icon-empty">Test2</div>
</div>

For example for columns in treegrid I could call "getColumnFields" but I don't see something similar for menu

Yes, got it.

Initially I put it into "data-options" section by mistake what gave me strange result and I removed it.

Now it looks as expected.

Thanks

Recently I tried to put TinyMCE, NicEdit into my layouts just to see how it could look like.
Both of them look fine in their DEMOs but on my page with EasyUI style both look so foreign and alien. 

Looking forward to see initial version of EasyUI text editor. Hope it will happen one day.

It works but not completly correct.

1) Title of the layout panel should not be closed by Dialog. In this setup I do not see "collapse" button for my "east" panel.

2) There is a gap between dialog and bottom of "east" panel of the same size as title bar or "east" panel.

Code:

<div class="easyui-layout"  style="height:240px">
	<div data-options="region:'center'" title="">test</div>
	<div data-options="region:'east',title:'Editor',split:true,collapsed:false" style="width:200px">
		<div class="easyui-dialog" data-options="inline:true,fit:true,shadow:false,noheader:true,border:false,
					toolbar:[{text:'Add'},{text:'Edit'}]">

			<form id="form">
				<p><b>test:</b>
				<input id="test" name="tcName" class="easyui-textbox" style="width:100%" disabled>
        <p>test</p><p>test</p><p>test</p><p>test</p>
        <p>test</p><p>test</p><p>test</p><p>test</p>
        <p>test</p><p>test</p><p>test</p><p>test</p>
        <p>test</p><p>test</p><p>test</p><p>test</p>
			</form>
		</div>
	</div>
</div>

How can I make toolbar in layout to look like in dialog?

I mean I don't want to have buttons on top-right in "blue" area/header. I would like to have fixed "grey" panel below "blue" header.

Thanks,
/V

Thanks!

In addition to #1 I must say that style="width:100%" helps to adapt width in case if I make panel width bigger but not smaller.