My team is in the early stages of a new workflow oriented web application.  A major requirement is being able to render a form based upon a JSON message from the database. Basically, the database reports what data it wants (or perhaps already has) and is asking for edits. The UI framework needs to render the form with preexisting data if it is there and then produce the JSON back with the edits. The exact form of the JSON message has yet to be established, so it can "advise" the UI renderer of the component which would be appropriate.

I really like the way EasyUI does not push some passive aggressive architecture for handling this type of workflow.  I can think of ways to code from the JSON to the UI, but the reverse is not so clear.

Any help would be greatly appreciated.

Thanks for making me look carefully again.  An enclosing panel with conflicting CSS was the actual culprit, not EasyUI at all.

I've a datagrid with three columns:

Code:

{field:'file',title:'File',width:228},
{field:'percent',hidden:true},
{field:'progress',title:'Progress',width:100}

.

The progress column contains a progress bar composed with some <div> and CSS to show the percent complete, but the numeric percent is stored in the hidden percent column.

Can I somehow make progress sortable, but actually sort by percent?

I've set up two tabs, each with a separate datagrid.  Each datagrid is populated with rows.  When I click the second tab to reveal the second datagrid, it only displays the border and title, the rows and field titles are missing.  Upon examination with firebug, they are there, but undisplayed.  I can access the row values through the datagrid methods.  If I pull the second datagrid out from the tab panel, it displays correctly.

That worked, but is this compound statement any less brittle if I upgrade the libraries at some point in the future?

With the HTML, <input id="HTML-GetFile" type="file"/>, I can get the get the files array via $('#HTML-GetFile').files; for each file with its name, size, etc.

But for the EasyUI component, <input id="EasyUI-GetFile" class="easyui-filebox"/> there is no files property.

This call, $('#Upload-ChooseFile').filebox('getValue'); yields only the file name.  Buried in the generated code is the array I need assessable via $('firebox_file_id_1')[0].files;, but I had to dig through the DOM to find this and I have to believe this ID, being code generated, is brittle.

What must I do to get the files array rather than just the file name directly from my filebox component?