my question is:
"What is the right way to operate with XTemplates in a MVC like project in ExtJS4?"
> Are XTemplates supposed to be in YourApp.view or in YourApp.controller?
The ExtJS4 docs just shows how to use XTemplates with some data, but i haven't seen a MVC-like example.
So,
Where should our XTemplates take place at?
Can XTemplate take some variable from controller as argument? (in case i would get some calculated data in controller and every time those data changes they should be passed to XTemplate and this XTemplate should form and render new template to the webpage;
P.S.
Sorry for my English and Thanks for your help;
I'm not an expert, but i can share with you/SOF a few thoughts and hopefully help you out to understand more the templating engine of extjs.
In very general terms, the XTemplate is what a view/control(grid, texfield, etc) is built on. Every component control in extjs has a "Tpl" or "fieldSubTpl" or "subTpl" etc.. config options which is the XTemplate to use to render the component UI.
So, imagine you are using extjs native class "Ext.form.field.TextArea" which represents an input text control, if you look in the source code of extjs framework (I think people often forget about checking out the source code, learn and get inspired from it, get the grip on things, see how extjs dev. team does things) and locate the class definition for it, and you will be able to see how the XTemplate is used. So I think if you can check this out and understand it, ofc, sencha docs is a valuable resource, you get already some answers.
XTemplate takes an array with data/single object whose properties need to match the variable inside the XTemplate, so you got an object representing a person and a property name i.e. person.Name so in your xtemplate would would show the name by using {Name} inside the xtemplate. You mention about doing some calculation in the controller and then pass it into the XTemplate, that is fine you can do it, but remember that the XTemplate support custom functions which can manipulate the data before the Xtemplate is rendered as you can see in this example from sencha docs http://docs.sencha.com/ext-js/4-0/#!/api/Ext.XTemplate
If you want an MVC application which uses XTemplates explicitly, you can check the "MVC Feed viewer" app from sencha here http://docs.sencha.com/ext-js/4-0/#!/example/feed-viewer/feed-viewer.html
I hope it helps you.
Happy Easter!
Related
In angular formerly we pass the array with fields and it generates the form in its std. way or layout. but if want to change its look or layout .Is it possible and how?
Yes, you can do advanced layout using field groups as in this example. I also recommend you learn the fundamentals of angular-formly here.
I'm looking to load a pretty big dataset (around 20k rows) and use the extjs 4.2 grid buffered rendering to view the data. I've seen so many examples that are different (extjs 4.2 examples) that my head is spinning and I can't get any of them to work. There is even an extjs page http://www.sencha.com/blog/first-look-at-ext-js-4-2-grid that shows how simple buffered rendering is in extjs 4.2 (just add the buffered rendering plugin to the grid ) but the examples in the sdk don't look like the example on the web page (they still use the stores buffering configs even though the linked to page above explicitly says you don't need to do that in extjs 4.2).
In the end ... I don't want to hit the server over and over and buffer the data that way. I want to load all the data and just buffer the grid's current dataset.
Does anybody know of an example of how to make that happen ?
Sorry my english is not so good.
Also, if I understood your question on the right way, you have to learn the difference between Remote- and Local Filtering. I think what you search is a local filter,
there you can set individual parameters as you want.
take a look to this example, on the button of the grid, you can find buttons to switch between local- and remote filters, there you got a working example for local filtering. Should do what you want :)
I'm writing a javascript web app using Backbone and Marionette, and my templates are created using Handlebars.
I have a view with three sections: a progress indicator, results list, and footer. Each of these may be shown or hidden based on if an operation is in progress or if there was an error.
Should I include conditional code in the Handlebars template, along the lines of {{unless resultsFetched}} and do this.render() often, or use javascript in the view like this.ui.resultsList.show() and this.ui.resultsList.hide()?
Thanks.
Update
Here are what I think are some pros and cons to having logic in the view templates:
Pros:
I think this looks like a declarative (instead of imperative) style, where the view says that it'll act a certain way based on model state.
As things get more complex, it'd probably be easier to read a template that has conditional logic than javascript code where show() and hide() is used extensively.
Cons:
Is the MVC architecture still being obeyed?
This goes against Mustache's philosophy of logic-less views
As a general rule, you'll want to keep as much logic in the Views as possible and only have presentation in your templates. That isn't always practical to be sure, but the larger your app gets, the cleaner you're going to want your templates to be.
That being said, today I used a for loop in an Underscore template because I had no need for a CollectionView-ItemView combo for the little things in the list that I was adding to the DOM.
TL:DR; Try to stick to my first paragraph, but use your instincts :)
I want to create a component on ExtJS like the editor that have stackoverflow for ask question (only Bold and Emphasis buttons). I think that should be an extension of textarea but i dont know how to select text selected and how to replace with tags+text. Please give me some ideas.
Thanks
Markdown by John Gruber can be obtained from his site. You could use his documentation as a basis for creating your own plugin for the HtmlEditor.
If you're talking about the ability to use asterisks for bullets and such, in that mode StackOverflow's editor uses something called "Markdown".
Here's one example of someone trying to make a markdown-based textarea with preview in Extjs:
http://www.sencha.com/learn/Extension:Ext.ux.MarkdownEditor
If you look around for other Markdown-related editors, you might find some ideas. If you're instead looking for just an "Online Rich-Text Editor" there's plenty of those.
UPDATE 29-APR-2014: There's actually a project you should take a look at. It's called "StackEdit":
https://stackedit.io
It's an open source initiative to supply a markdown editing component. Not ExtJS based, but those who find this question may be interested in what they are doing it.
(I discovered it through one of SO's open-source-recruiting sidebar campaigns; advertising can be useful, apparently.)
I am currently loading the default file, page.xaml, but in that page, I am loading the content from another xaml file. With each "page" change, I just load the content from a different xaml file, and on and on.
Example: this.Content = new StartPage();
I'm running into some syntax issues, however, because of the way I am changing my content, and was wondering if there is a definitive answer on how to accomplish this?
For example, when trying to capture user's keystrokes, I would normally do:
this.Keydown += new KeyEventHandler(this_KeyDown);
but that event handler doesn't even fire in my situation. So, I'm looking for a new approach to my content-switching approach before revisiting the keystroke problem.
Have you looked at using Silverlight 3. It has a new Page Navigation functionality.Silverlight 3 Navigation
As far as content switching goes, I've always done what you propose in the question. Normally I create a MainPage.xaml which has has the frame of the application (usually a Grid for me). One of the cells in the Grid is considered the content area of the app. When the user takes an action that I would consider to be navigation, I create a new instance of a Page, which for me is a file like MyUserControl.xaml, and then add it to the appropriate content cell in the Grid. MainPage stays around for the life of the application and assists with navigation.
If you want something fancier, and want to take advantage of browser based back/forward buttons, you could look into the SL3 navigation like Correl suggested.
A Big problem with what your're doing is that journalization doesnt take place automatically when you swap out framework elements by creating them and plugging them in the codebehind. This means that you lose the back and forward functionality of the browser. You can manually journalize stuff when you swap out pages, but this is simply a hack to get your navigation approach working.
Take a look at Prism at www.compositewpf.codeplex.com/, specifically the MVVM method of GUI design, it'll save you alot of time later on. And remember, you dont need to go hardcore when you look at MVVM, u could always cut out alot of "dynamic" functionality if you're a one man band
Also swap to silverlight 3 and use the navigation application. If you cant, take a look at helix 0.3, it'll provide a more asp oriented approach to navigation. the link provides a really really good starting point, its a three part article, i suggest you read all three and download the sample application and understand it.
A book could have been written on your question, this has to suffice for now.