Working with table and cells with keyDown event with JQuery
Here are the details…
http://stackoverflow.com/questions/16959133/html-table-tr-onkeydown-not-working/16959202#16959202
Hi,
I was searching for some examples on the responsive web design and frameworks and i was impressed by JQuery mobile and it’s roadmap towards the future and it’s broad capabilities. You can view JQuery Mobile at http://view.jquerymobile.com/1.3.0/
So, in further searches – it was obvious that lesser people have tried it with web forms. I didn’t find any examples (may be there are.. but nothing good appeared on google search).
So here is a another to the point simple example:
Steps
Main Idea
“Every .aspx page in normal page has its respective .mobi.aspx” It’s hybrid project and we will simple use asp.net url routing to map if the request comes from mobile site (only in case of .aspx) – All other things remain same.
So,
Here are questions:
1- How to do URL Rewrite?
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.SessionState;
using System.Web.Routing;
namespace Test.WebWithMobile
{
public class Global : System.Web.HttpApplication
{
protected void Application_BeginRequest(object sender, EventArgs e)
{
if (Request.Browser.IsMobileDevice)
{
//Request.Url.MakeRelativeUri(new Uri(Request.Url.AbsoluteUri)).ToString() + Request.Url.AbsoluteUri.Replace(“.aspx”, “.mobi.aspx”)
if ((!Request.Url.OriginalString.ToLower().Contains(“mobile”)
&& Request.Url.OriginalString.ToLower().EndsWith(“.aspx”))
|| Request.Url.OriginalString.IndexOf(“.aspx”) == -1)
{
var url = Request.Url.OriginalString;
if (url.ToLower().IndexOf(“.aspx”) == -1)
url += “Default.aspx”;
url = url.Replace(“.aspx”, “.mobi.aspx”);
var path = Request.Url.MakeRelativeUri(new Uri(url));
HttpContext.Current.RewritePath(“~/” + path);
}//Request.ApplicationPath);
}
}
}
2- How to setup jQuery Mobile?
<head runat=”server”>
<meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=1″ />
<title></title>
<link href=”Content/jquery.mobile-1.3.0.min.css” rel=”stylesheet” />
<script src=”Scripts/jquery-1.9.1.min.js”></script>
<script src=”Scripts/jquery.mobile-1.3.0.min.js”></script>
<asp:ContentPlaceHolder ID=”head” runat=”server”>
</asp:ContentPlaceHolder>
</head>
<body>
<form id=”form1″ runat=”server”>
<div data-role=”page”>
<div data-role=”header”>Mobile Header</div>
<div data-role=”content”>
<asp:ContentPlaceHolder ID=”ContentPlaceHolder1″ runat=”server”>
</asp:ContentPlaceHolder>
</div>
</div>
</form>
</body>
That’s It !!!
Surprised … but that’s it… This will get your going with query mobile and setting up web solution.
Hi,
Today, I took the 70-480: Programming in HTML5 with JavaScript and CSS3 – and cleared it. I thought it would be easy one, but it wasn’t – it had more than expected material coverage. As I can’t give specific details out, so I will make it short and general.
http://www.microsoft.com/learning/en/us/exam.aspx?ID=70-480
I had very cool experience with the javascript, html and dhtml etc … so I got it through. But you should have some experience and had actually build some stuff with html/ html5/ javascript and jquery.
Having experience helps a lot.
Thanks,
Riz
Showing JQuery menu Horizontally through CSS
I was trying the menu widget from JQuery UI. It looks good with lot of ability. But as usual i had to tweak it a little bit. You can check this at http://jqueryui.com/menu/#navigationmenu
Problem:
The menu on the demo site appears to be Vertical aligned – it grows vertically, and i would like it to be horizontal.
Like
Menu 1 – Menu 2 – Menu 3
Instead of
Menu 1
Menu 2
Menu 3
Solution:
So, for doing with minimal changes here is what you need to do, just define following css classes:
#menu li { display:inline-block; width: auto; }
#menu li.sub { display:block; width: auto;}
Where menu is the ul element for menu, and li (the sub menus, the second level) are marked with “sub” class. Here is the HTML markup for the reference.
display:inline-block; will render the li as inline – so they will appear in the same line side by side.
for Sub menu under each li you need to set them as “block”, so they appear vertically.
<ul id=”menu“>
<li><a href=”?Aberdeen”>Admin</a></li>
<li>
<a href=”?Ada”>Themes</a>
<ul>
<li class=”sub”><a href=”?Ada”>Default</a></li>
<li class=”sub”><a href=”?Saarland”>Test 2</a></li>
<li class=”sub”><a href=”?Salzburg”>Test 3</a></li>
</ul>
</li>
<li><a href=”?Adamsville”>Support</a></li>
<li><a href=”?Addyston”>Release Notes</a></li>
<li><a href=”?Addyston”>My Details</a></li>
</ul>
Hopefully, it will help people out.
UPDATED: http://jsbin.com/afepiz/31/edit (JSBIN)
Enjoy,
Thanks,
Riz
We Require Senior Developer with C#, Asp.net, Jquery and Web Service Development experience at Lahore Office. Please send your CVs to rizwan@vsgsolutions.com
Excellent Opportunity!
Please feel free to contact me at rizwan@vsgsolutions.com or at rizworks@gmail.com