I thought what I am trying to do what already built in, but it does not seem to be working. From what I understood, with asp.net MVC you can name your views like this:
_view.cshtml
_view.Mobile.cshtml
and it would use the mobile one if coming from a mobile device, and use the non-mobile one on desktops.
It is not automatically doing this for me, is there something else I need to do? I have all the jquery mobile scripts and css referenced.
As pointed out in the comments, this tutorial: asp.net/mvc/tutorials/mvc-4/aspnet-mvc-4-mobile-features is a great way to go.
My particular problem what I did not have anything in the default Shared view folder, so it was not routing correctly.
Related
I have been looking all over for templates that are mobile compatible. I understand that people carry the web with them. My present website uses an old css template which does not work well in phones. I found a template here at https://html5up.net/photon
I downloaded this, but I'm having problems integrating it into a masterpage. It is a html page with links to images that are not working. Where can I get a basic masterpage for vb.net that is mobile compatible? It needs to have a nav bar. Thanks.
My mvc website makes use of the Telerik Kendo mvc dll's. However the problem is that the drop down list doens't work when running it on IE10, in a website that uses frames. When I run it on its own, it works fine, however as soon as it is used on a website with frames, it brakes the drop down list and they won't expand.
I'm currently using the latest version (2012.913) of the Kendo UI for MVC.
Is there a solution for this.?
I know this is an old post, but I thought I'd share since we had the same issue and found the fix for it. Unfortunately we are forced to continue using frames as well, so we had to put this fix in place.
First thing to check is if your using compatibility mode in the browser, whether by the site being added to the compatibility list or you're on an intranet site. If you can, disable compatibility mode and that should resolve this. If you want to ensure your site isn't using compatibility mode, add this tag to your application.
The problem we had is that IE doesn't obey this setting when using frames...it will always use whatever the parent frame is set to. We had to have compatibility mode enabled for certain portions of our site, so we were in a catch-22 situation. Since there's no way around this, our final resolution was to re-direct the user behind the scenes if they navigated to the page in the iFrame.
That being said, the easiest option is to add the meta tag above if you don't need compatibility view for anything.
I am starting a jquery mobile/phonegap application. And would like to know if there is any way I can keep my code in seperate files so it is easier to manage. From all the reading I have done on jquery mobile it looks like all of your pages are in one file and are just seperated by divs like <div data-role="page" id="page-one"></div>. I guess I could try to make some type of a makefile that concatenated them all together, but it seems that most apps are pretty lengthy that they should have a solution for this. Keeping all the code in one file just seems impossible to maintain.
JQuery demo, three pages, all one source file:
http://demos.jquerymobile.com/1.1.0/docs/pages/multipage-template.html
You can just use normal links with jQuery mobile:
http://demos.jquerymobile.com/1.4.0/navigation/
It will "hijack" the link and use transitions to give you a native like animation. As Flatlineato pointed out you need to make each page confirm to the required markup, and you'll need to repeat your headers/footers etc on each included page.
Or you can use more complex solutions to dynamically change the content of your page, which can be stored in multiple files, like this other SO post:
including the header and footer in jquery mobile multiple page site
But I would also agree with Leo and say the jQuery mobile isn't the best choice for Phonegap, it's not that well optimized, and runs slower in the Phonegap webkit view than it does in native safari.
I've also switched to a custom navigation system and dropped jQM early on in my Phonegap development, but that was over a year ago, more recent versions may work better.
I think my personal API is what you are searching for:
https://github.com/charnekin/api
Demo example:
http://yopo.es/cordovapi/
jQuery Mobile allows you to have the pages in separate files. Obviously in each file must conform to the structure of the markup pages.
To point to another page in the link instead of the id you specify the correct file name. If the file then you enter multiple jquery mobile pages must also specify the id.
This is my first question on SO so i'll try and make it as clear and as understandable as possible.
I've recently started messing around with Angular JS and currently I am working on a mobile app using Angular JS and jQuery Mobile. So far I've not had any major problems and so far have no had a need to consider any external libraries for integration (such as the angular js + jquery mobile adapter). I've created a multi-page app (currently only two pages) and used separate controllers for each page (login + content page). The app itself is simple, it's just a list keeping app and i've created a quick jsfiddle based on the ui aspect of the content page: http://jsfiddle.net/G7JNV/4/
The app works as expected from the jsfiddle. However because the content page is a page in the same html document (index.html) as the login page, to navigate to the content page the url becomes:
.../index.html#mainpage
(mainpage being the page for the list keeper)
Thats when things start getting funny. When the url is like above, when adding an item to the list, the item is initially unstyled (it doesn't look like it's part of the list) but the css styling for that item comes back after adding another item. Of course the next item is then unstyled (and so on).
If you want to see what the issue looks like:
Everything however works fine if i don't have the hash page as part of the URL (I tested this by turning the two page app into just one page for the content so that .../index.html goes straight to the content page). The css is applied to the dynamic content fine as one would expect.
Of course I have no idea why it's doing this and I suspect that it's something to do with how angular and jqm treat the hash anchor in the URL (but bare in mind I don't have much experience in both Angular JS nor jQuery Mobile).
Any help from any of the more experienced Angular JS (and jQuery Mobile) users would be greatly appreciated!
You should be creating a directive that encapsulates the list and the logic that you have for it.
As suggested in the comments to your questions, a timeout can work. If you're having issues with the element "flashing" or "flickering", you can use the ngCloak directive to deal with this.
You may also want to check out the $locationProvider configuration in your app and turn off HTML5 mode or set the hash prefix.
I am attempting to find a place to start debugging this issue at.
I do not experience this issue if I create a new, MVC2 project, but I am trying to integrate into our companies existing MVC solution.
I am adding a ScriptManager to the MasterPage. Something like this:
<telerik:RadScriptManager ID="ScriptManager1" runat="server" EnableTheming="True" EnablePageMethods="True">
</telerik:RadScriptManager>
Here is what I see when I try and run.
I'm extremely new to MVC and unsure of where/how to start debugging this. I have a hunch it has something to do with either the Global ASAX or Web Config file, but without any more information I'm not sure where to begin poking around.
Has anyone seen this before?
partial-answer: it seems that moving the script manager inside of the closing tag resolved this issue, but the second I tried to add a control to my View I am back to looking at garbage. Plus, it doesn't match what I had to do in the default app. Wondering why.
Some asp.net controls simply won't work in MVC because they rely on features that MVC doesn't support, such as viewstate. I'm not sure if the Telerik ajax controls are in this boat or not, but you can't assume any control will work. Generally, the more complex the control, the less likely it will work.
I notice that you have it working in a default project, but perhaps that project has no real data or doesn't use the same features that your production app uses.