I have 100 different url's each pointing to plain html pages, I have to convert these plain html pages to extjs pages. Footer and Header is same for all the pages but center section is different for different plain html pages.
In order to leverage maximum code I thought to create an EXTJS4.1.0 application which will have model, view, store and controller but separate index.html, app.js and viewport.js. The reason for separate index.html, app.js and viewport.js is that if I don't keep single index.html, app.js and viewport.js then I will not be able to bookmark the pages (Since users and using 100 different urls for 100 different pages) so basically I will have 100 different app.js and corresponding viewport.js (viewport.js will have common components for footer/header etc and specific components for screen) but at one point of time only one index.html, app.js and viewport.js will be active/run.
My first question is, is the solution I just mentioned a correct solution.
Is it true that in Extjs MVC pattern you can only have one Viewport.js file per application if you use autoCreateViewport: true.
Secondly if you use autoCreateViewport: false in Ext.Application (in app.js ) and create instance of different Viweport in launch method as follows:
Ext.application({
name: 'Panda',
autoCreateViewport: false,
launch: function() {
Ext.create('Panda.viewport.ViewportOne')
}
});
Notice that I have created instance of ViewportOne which is one of 100 viewports. With this solution also I ran into glitches while running the application (some navigation will not work etc). Is it because extjs does not allow viewport with name such as Panda.viewport.ViewportOne, Panda.viewport.ViewportTwo etc.
How in Extjs I can create fully MVC style application with bookmarkable pages such that each page is part of same extjs application (ie it leverages same model view, store, controller and dynamic loading).
The company I work for has lots of customers who are using an application which was build on plain html and javascript. Each uses works on only one page of that application which he has bookmarked on his browser.
The task I am given is to upgrade those plain html/javascript pages to Extjs one such that uses dont have to update their bookmarks.
At my end I am thinking to create single application in Extjs 4.1.0 which will have 100 pages (index.html, indexOne.html etc which user will bookmark) each if which can use common Model/view/store and controller.
So basically my entry point to application will be different but all pages will be using same model/view/store/controller.
Its more of an architectural question.
Hope this help.
Related
I know that the webpage that is opened by the user is part of the view. This one is easy, but what about js code calling the server to retrieve data via ajax? Is this part of the controller or still the view?
Can the view request data like this?
Thank you very much for any help.
Javascript, including Ajax, is a client-side technology. Therefore, in the context of MVC, any js script must be part of a template file.
Note that a template file is not the view (the V in MVC), but a part of it. The view should incorporate both server-side components (classes, interfaces, etc) and client-side components (html, js, css, images, etc). For example, an instance of a view class could read some data from the domain model and then load and render a certain template file, injecting the fetched data into it (formatted), in order to be printed on the screen.
So, an ajax object should be defined in a template file. Its request to the server is handled either by the controller, or by the server-side components of the view, depending on the MVC approach that you are choosing to implement. Though, the server response should always be created by the server-side components of the view.
I'm developping a jqm application with spring mobile in the back-end.
Whenever I hit the browser refresh button on my mobile phone the page is completely devastated afterwards. Browsers back-button works properly.
The data are still available due prg pattern (flashAttributes in Spring) after refresh. Only the view is malformed.
Any ideas how to solve this problem?
From jQuery Mobile docs :
The simplest approach when building a jQuery Mobile site is to reference the same set of stylesheets and scripts in the head of every page. If you need to load in specific scripts or styles for a particular page, we recommend binding logic to the pageinit event (details below) to run necessary code when a specific page is created (which can be determined by its id attribute, or a number of other ways). Following this approach will ensure that the code executes if the page is loaded directly or is pulled in and shown via Ajax
So what happens is - in jQuery Mobile, the scripts and styles defined in the head are loaded only once. So, in normal conditions, it works fine, as all the pages will use the scripts loaded from the first page.
But. When you refresh a page in-between, it triggers a page-reload instead of the ajax navigation model thatjqm uses. So all the scripts and styles loaded from the first page will not be included from here on out.
What you need to do is "reference the same set of stylesheets and scripts in the head of every page", so that even if you hit refresh in the middle, the scripts and styles that had been loaded from the head of the first page are loaded again.
I recommend you read the docs from the above link fully to gain a better understanding.
I'm hoping this isn't a double-post - I couldn't find my issue in the search, but I imagine it might be asked in several ways. My project involves a PHP5 workspace running the Laravel 4 framework.
Quickly, my issue occurs when I access any webpage within my private project that does not first make a call to a database. When viewing the page, my images are missing and the CSS styles - though correctly called in source, and accessible when I click on the HREF's for my styles - aren't displayed properly.
After going to a page that makes a database call (for instance, my Manage Users page which displays a list of users in the database), all images and styles in all pages work. Essentially, I:
Access the homepage, which is static HTML. It's styles are broken.
Access an admin panel page which is static HTML. It's styles are broken.
Access an admin panel page that pulls a list of users to the database. The styles suddenly work.
Any pages I visit after this point display styles properly.
Has this happened to anyone else? Is there a simple way to resolve this?
I have a site that I want to load links in the centre column, so why would I use AJAX over an iframe?
AJAX is a system which allows you to get data - any data - from a server. This is in contrast to iframes which simply load in a HTML document or fragment based on a given URL.
THe strength of AJAX's flexibility over iframes is their ability to give you back raw data with which you then use to build or update your view. Consider this example: you have a dataset that needs to be displayed in tabular form, so you could set up a page that contains the table with your data in it and load that in via iframe.
A better option however, is to get the raw data from the server with AJAX and send it to your application uncluttered by markup and extra tags. Your page then builds the table in whatever part of the page it needs, according to how your application needs it to appear right at that point.
Where iframes can load HTML content that must be presented as it is built, AJAX allows the developer to separate the data from the way it is presented, giving them the freedom to manipulate it as much as they like and use it in as many ways, pages and applications as they need.
More Information
AJAX allows the client or web page to send data back to the server to do things with (such as changing passwords, updating settings, or transaction processing, etc.) so if your page or application needs two-way communication without refreshing the page, AJAX is probably the technology you'd use.
Also, using iframes restricts your ability to work with the data inside. An iframe creates a new context which you can think of as a container of sorts - the data inside is safe from the outside and vice versa. This often means your CSS won't flow down into your iframe giving you unexpected results. On some browsers, clicking a link in an iframe can actually cause the link's destination to load inside the iframe instead of changing the whole page - usually not what you want.
I am working on a dashboard application that has multiple independent widgets based on the common query string parameters passed. In MVC, each widget has separate controller --> view --> JS file (that makes AJAX calls to get JSON from WCF). Now, I need to create a master page that will "host" all of these independent widgets. How can I make sure that these widgets are truely "independent"? IE has concurrent connection cap that could be made to a single server. Will iframe serve the purpose? Should I host each widget in a separate iframe on this master page? What are more suitable and acceptible alternatives? Use partial views?