Tag | jQuery Posts

Jquery auto-complete, WCF Services and cross domain nightmares Gone are the days of using the Ajax toolkit, it’s far too bloated and can be very difficult to debug if anything goes wrong. So like many other developers I have made the conscious effort in swapping my attention to jQuery instead. I have recently been working on a project where I needed to implement a simple auto complete dropdown, so instead of reaching for the auto-complete extender from the Ajax toolkit I decided instead to use the ...
I had recently a very interesting problem. I have a single button on my page, which opens a jquery ui dialog with other page containing single textbox control. After pressing the Ok button, using web service the textbox value is sending to the server and a label control on the main page is updating and the update panel containing this label is refreshing. Vary simple solution. Maybe too simple, because I have lost a few hours to investigate, why after pressing the Ok button, full postback occurs ...
As you probably already know Visual WebGui has recently released an HTML5 supported (beta) version of its platform. Needless to say this new .NETHTML5 version generated a lot of buzz and interest which were followed by many inquiries so I want to share more information and the Gizmox vision for the HTML5 version. I would like to start and state that at this point in time (May 2011) .NETHTML5 is functionally equivalent to the classic Visual WebGui WINWEB version. The main current difference is at ...
This is very easy to check, which mouse button was pressed using jQuery. This solution works propertly on IE (tested on 9), Firefox (tested on 4), Chrome. In Opera there doesn't work the middle button and the browser context menu is showing. $('#someElement').mousedown... { switch (e.which) { case 1: alert('Left mouse button pressed'); break; case 2: alert('Middle mouse button pressed'); break; case 3: alert('Right mouse button pressed'); break; default: alert('Unsupported mouse button'); ...

For more info refer the below post

 

http://blog.jquery.com/2011/05/12/jquery-1-6-1-released/

 

Some great improvements and fixes.

I dug up one of my first jQuery plugins and thought I would share. //thomas gathings //jquery plugin to enable confirmation of unsaved changes on common input elements. //apply to an ancestor, such as fieldset, div, or form. jQuery.fn.confirmUnsavedCha... = function() { var $obj = this; var saving = false; window.onbeforeunload = function() { //if local element data 'dirty' = true, show unload confirmation if (!saving && $obj.data("dirty")) { return "You have unsaved changes."; } }; //for ...
Luego de varios días de intenso trabajo, hoy he tomado un pequeño espacio de tiempo para dedicar un post al trabajo con datos en forma de tablas en asp.net Todos los que hemos trabajado desde hace bastante con asp.net, hemos aprendido a querer al GridView, un excelente control que nos permite mostrar los datos directamente desde una base de datos y trabajar con ellos, llamase trabajar a las operaciones de: editar, buscar, agregar y eliminar. Por supuesto que existen muchas otras opciones que no son ...
A jQuery Plugin for adding IE9 features (site pinning, site mode, etc.) to your websites. Several new features of Internet Explorer 9 are designed to enhance the browsing experience of consumers by enabling sites that leverage certain features to behave like applications on the desktop when those sites are ‘pinned’ to the taskbar in Windows 7. A user pins a site by dragging the site’s tab (or favicon in the address bar) to the taskbar. For all sites, IE9 will create a default experience (called ‘site ...
After HTML 5 Microsoft WebCamp Portugal, I came up with some interest in exploring the Menubar plugin. This plugin transforms a list into a nice menu, and as such, I like to implement it on a project which I use web.sitemap. To this, I needed to use an XSLT to transform the web.sitemap file, which is nothing more an XML, into an unordered list in a format required by Menubar. Here’s an example of web.sitemap file: <?xml version="1.0" encoding="utf-8"?> <siteMap xmlns="http://schemas.micro... ...
Lately, I have been taking some time to learn some new technologies. For me, the best way to learn a new technology is to jump head first into a project: Daily deal websites such as GroupOn, LivingSocial, DealFind, etc. have really taken off over the last 6 months. With so many sites out there, my inbox was being flooded with emails from all these daily deal websites. This seemed like it might be a fun project, so I set out to build a daily deal aggregator. First, I built a Windows Phone 7 app. I ...
This past week the company I work for re-launched our external facing internet site, all powered by SharePoint 2010. I already blogged about it, but have you ever wondered, what does it take to build a great looking site? There are 3 basic levels of Branding in SharePoint 2010: Low Effort Remember the themes in SharePoint 2007? well its incredibly easy to build them in SharePoint 2010.The best examples out there are the ones that use Power Point 2010 to produce color schemes and styles and apply ...
I have lost recently some time to send a json parameter to my web service using jquery. Suppose that we have the data in an javascript array: var attributes=[]; $('#PreviewGroup1_DecisionA... input:checkbox').each(funct... attributes.push({attribute: elem.value, checked: elem.checked}); }); To send that array to web service we simply need to do $.ajax({ url: '../Services/PreviewFormWeb... dataType: "json", data: "attrs="+ JSON.stringify(attributes), ...
Project Silk provides guidance for building cross-browser web applications with a focus on client-side interactivity. These applications take advantage of the latest web standards like HTML5, CSS3 and ECMAScript 5 along with modern web technologies such as jQuery, Internet Explorer 9, and ASP.NET MVC3. To illustrate this guidance, the project includes a reference implementation called Mileage Stats that enables its users to track various metrics about their vehicles and fill-ups. Much of the effort ...
Join us for a special WebMatrix and ASP.NET MVC Web Camp you don’t want to miss. No matter your expertise in web development, these Web Camps are the perfect opportunity to get hands-on experience and 'unleash your coding genius'. Our interactive sessions will: Introduce ASP.NET Web Pages and WebMatrix; discuss possible uses of these Facilitate an in-depth discussion on when to migrate ASP.NET WebPages applications to ASP.NET MVC Explore new features of ASP.NET MVC 3 Take a dive deep into jQuery ...
How doing some asp.net deevelopment and i decided to use one of the asp.net controls. But need to use Jquery to do some extra stuff I had a link in the page i wanted to let popup like a modal dialog like so: <td><a id="mdialog" href="details.aspx?scode=&l... Eval("Code")%>">[..]&... Then refrenced Jquery like so: <script type="text/javascript"> $(document).ready(function () { $("#mdialog]").fancybox({ 'width': '75%', 'height': '100%', 'autoScale': false, 'transitionIn': ...
Ajax enabled data centric applications are getting popular day by day in web development space. While these type of web applications provide rich user experience, building a robust and powerful application quickly is a great challenge for developers. Fortunately Microsoft has started providing great frameworks, plug-ins and APIs to facilitate this process. Last week Microsoft announced a new version of java-script API “datajs”, which is intended to help web developers to build data centric AJAX applications ...
At the recent Mix 2011 conference the datajs team talked about this new cross-browser JavaScript library that makes writing data centric web apps easier. Its fairly simple to use and can be very powerful. Here is a quick application I threw together using the library. The code uses datajs, jQuery, jQuery UI and jQuery templates. Microsoft has an OData Service at http://live.visitmix.com/od... which exposes all Mix sessions. I used this source to get a list of all sessions using the datajs ...
HTML5 introduces markup-level functionality for rich graphics, animation and web multimedia. It also supports a richer web application functionality and extends the client capabilities with local storage. Many pundits see it as the next generation web - web 3.0 if you like - and an open standard replacement for propriety plug-ins, Microsoft Silverlight and Adobe Flash. But, for all its new features, HTML5 is still only the end product. This article looks at HTML5 from the web programmer's point of ...
Recently, while browsing Visual Studio extensions I came across the SharpKit tool. It sparked my curiosity as I'm always looking for ways to improve my jQuery and Javascript in general. Working off the example in my previous post about Updating the Content of a WebGrid async we can generate the same Javascript via the SharpKit project. First, head to theSharpKit site to download and setup your first project (check out the Screencasts). Or search "jQuery" in Visual Studio 2010 extension manager. So ...
Fellow Techies of the world.. Welcome! In this obligatory first post I want to just tell you a little about myself and what I intend to do with this blog. I’ve worked in fits and starts on a tech blog before so I’m happy to be a part of the GeeksWithBlogs community now and make it my new home. Let’s begin at the beginning… Sometime back in 1995 my dad (who has worked with computer pretty much since there have been computers) brought home 2 books. Visual Basic 4 and Visual C++ 4 (For Beginners). I ...
A simple script you can add to your master page or content editor etc. to hide the “Sign in As a Different User” option that is available in the Personal Actions Menu. <script src="/jQuery/jquery-1.4.1.js" type="text/javascript">&... <script type="text/JavaScript"> jQuery(document).ready(func... { var objects = document.getElementsByTagNa... for (var i = 0; i < objects.length; i++) { itm = objects[i]; if (('#' + itm.id).indexOf("LoginAsDif... ...
Yeah I know I don’t blog much anymore, because life has taken me places that don’t involve the interwebs unfortunately. I am in the midst of planning two events, starting a non for profit, creating more sessions for various conferences, submitting to various conferences, working a 40 hour a week job, attempting to hang out with boyfriend/friends/family. So you can see that list does not include this blog sadly that’s how it goes sometimes. The bottom piece very important over any of the top pieces. ...
Employee Info Starter Kit is an open source ASP.NET project template that is intended to address different types of real world challenges faced by web application developers when performing common CRUD operations. Using a single database table ‘Employee’, it illustrates how to utilize Microsoft ASP.NET 4.0, Entity Framework 4.0 and Visual Studio 2010 effectively in that context. Employee Info Starter Kit is highly influenced by the concept ‘Pareto Principle’ or 80-20 rule. where it is targeted to ...
v\:* {behavior:url(#default#VML);} o\:* {behavior:url(#default#VML);} w\:* {behavior:url(#default#VML);} .shape {behavior:url(#default#VML);} Normal 0 false false false EN-GB X-NONE X-NONE MicrosoftInternetExplorer4 /* Style Definitions */ table.MsoNormalTable {mso-style-name:"Table Normal"; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; mso-style-noshow:yes; mso-style-priority:99; mso-style-qformat:yes; mso-style-parent:""; mso-padding-alt:0cm 5.4pt 0cm 5.4pt; mso-para-margin:0cm; mso-para-margin-bottom:.000... ...
Ever wanted to have a simple jQuery menu bound with ASP.NET web site map file? Ever wanted to have cool css design stuffs implemented on your ASP.NET data bound controls? Ever wanted to let Visual Studio generate logical layers for you, which can be easily tested, customized and bound with ASP.NET data controls? If your answers with respect to above questions are ‘yes’, then you will probably happy to try out latest release (v5.0) of Employee Starter Kit, which is intended to address different types ...
There are a million plugins for jQuery and when a web forms developer like myself works in MVC making use of them is par-for-the-course! MVC is the way now, web forms are but a memory!! Grids / tables are my focus at the moment. I don’t want to get in to righting reems of css and html, but it’s not acceptable to simply dump a table on the screen, functionality like sorting, paging, fixed header and perhaps filtering are expected behaviour. What isn’t always required though is the massive functionality ...
Microsoft Tech ed 2010 was a great success. Infact Most of such conferences always provide a great place to meet other technology enthusiasts and ofcourse,whats in the pipeline for future products of a company or field.. And yet again,MS Tech ed India is coming on 23-25 march in Banglore,India.Well,the place is ofcourse right suited for any IT/Computing conference.After all,Its Silicon Valley of India.. From Last year.I remember a session by Harish about “Building pure client side apps with Jquery ...
Goal: Using the jgGrid to enable a selection of a checkbox for row selection - which is easy to set in the jqGrid - but also only allowing a single row to be selectable at a time while adding events based on whether the row was selected or de-selected. Environment: jQuery 1.4.4 jqGrid 3.4.4a Issue: The jqGrid does not support the option to restrict the multi-select to only allow for a single selection. You may ask, why bother with the multi-select checkbox function if you only want to allow for the ...
Goal: Create a menu widget that does not require any javascript, extremely lightweight, very fast, soley based on CSS, compatible with FireFox and Chrome. Issues: May have some rendering issues in some versions of IE, sorry :-) Instruments: css file html with specific menu format jQuery-ui library - optional if you want to use your own images/colors Implementation Details: HTML: <div id="header"> <div id="header_Menubar"> <ul class="linkList0 ui-tabs-nav ui-helper-reset ui-helper-clearfix ...

At http://www.4guysfromrolla.com/articles/120810-1.aspx there is very useful article on using jQuery to check all / uncheck all checkboxes in a GridView.  - Enjoy!

With the release of Internet Explorer 9 RC the browser looks to be in a usable state. So far, my experience has been positive. However, one area where I am having problems is when people are using the jQueryUI library. Versions older than 1.8 cause IE 9.0 to be unable to drag and drop. This is a real pain, especially at sites like Agile Zen, where dragging and dropping is a primary bit of functionality. Now that IE 9 is a release candidate, we’ll see how quickly these things improve. I expect things ...
Goal: As we all know the jqGrid examples in the demo and the Wiki always refer to static values for drop down boxes. This of course is a personal preference but in dynamic design these values should be populated from the database/xml file, etc, ideally JSON formatted. Can you do this in jqGrid, yes, but with some custom coding which we will briefly show below (refer to some of my other blog entries for a more detailed discussion on this topic). What you CANNOT do in jqGrid, referring here up and ...
I have one common piece of jQuery code which I use to submit a form any time the selection changes on a drop-down list (HTML select tag). This is similar to setting AutoPostBack = true in ASP.Net. I use a single CSS class (autoSubmit) to annotate that I want the drop-down to force the form to submit on change so the HTML looks something like this: <select id="myAutoSubmitDropDown" name="myAutoSubmitDropDown" class="autoSubmit"> <option value="1">Option 1</option> <option value="2">Option ...
OK, so for some reason you have a mega mashup solution with ASP.net AJAX, jQuery and web forms. Perhaps you are just on the migration from AjaxControlToolkit to the jQuery UI framework – who knows!! Anyway, the problem is that when you post back with something like an UpdatePanel, you will find that your nicely setup jQuery stuff, like the datepicker for example will no longer work. You may have something like this… $(document).ready(function () { $(".date-edit").datepicker({ dateFormat: "dd/mm/yy", ...
In this post I'll demonstrate how to make a simple collapsible menu using jQuery. To get started let's go ahead and fire up Visual Studio and create a new WebForm. Now let's build our menu by adding some div, p and anchor tags. Since I'm using a masterpage then the ASPX mark-up should look something like this: 1: <asp:Content ID="Content2" ContentPlaceHolderID="MainC... runat="server"> 2: <div id="Menu"> 3: <p>CARS</p> 4: <div class="section"> 5: <a href="#">Car ...
jQuery effects not working after UpdatePanel Asynchronous request is over ...
I’ve been updating the Winnipeg Code Camp website over the last few weeks with sessions and speakers as we’ve added them, and I’m happy to announce the full set of sessions!* We have a very interesting mix this year with new speakers and varied technologies! Remember this is a *FREE* event, so head over to our website to find out how to register for what will be a fantastic code camp! *OK, so we still have one session that needs to be have an official title, and one session that’s still TBA…but close ...
When we were working with ASP.NET MVC 2, we needed to write our own JavaScript to get Client-Side Validation Summary with jQuery Validation plugin. I am one of those unfortunate people still stuck with .NET Framework Runtime 2.0 and .NET Framework 3.5; meaning I am still on ASP.NET MVC 2. So I will still keep on supporting by answering any question you may have with my original code. Long awaited ASP.NET MVC 3 has been released, and it supports Client Side Validation Summary with jQuery out-of-the-box ...
The code samples in Microsoft All-In-One Code Framework are updated on 2011-1-23. Download address: http://1code.codeplex.com/r... You can download individual code samples or browse code samples grouped by technology inthe updated code sample index. If it’s the first time that you hear about Microsoft All-In-One Code Framework, please read this Microsoft News Center article http://www.microsoft.com/pr... or watch the ...
I’m trying to find time to update the Prairie Developer Conference 2011 website, and the sessions and speaker information will be up by this weekend including the registration page. For those that are wondering what the session and speaker list looks like, I wanted to give a sneak peak. We have a fantastic set of sessions by world class technologists! We’re covering .NET, Java, Ruby, SQL Server, Agile, User Experience, Mobile, Security, Azure, Office, SharePoint, and others. In fact, this year I’ve ...
I read a blog post a few months back about client binding your Asp.Net GridView. It was Called Bind Gridview using Jquery. I took it to heart and now I'm using it, except it doesn't handle client sorting (paging is another story). Granted this has some room for improvement and my js isn't the best… Base Page method with the grid view: protected void SetHeaderAttribs(GridView grid) { for (int i = 0; i < grid.Columns.Count; i++) { TableCell cell = grid.HeaderRow.Cells[i]; DataControlField field ...
If you attempt to make an ajax call that cross domain or protocol boundaries, the default XHR (XmlHttpRequest) processor will fail. The out-of-the-box implementation forbids crossing boundaries. Enter flXHR. A flash-based proxy that implements (and extends) the XHR API. That’s good news for JQuery developers. It means you can use flXHR just like the native Jquery XHR. There’s also a Jquery proxy plugin that makes it SIMPLE. You can download the sample here. In my example, I’m hosting the website ...
Problem As was mentioned in a previous blog I am building a web page that allows the user to select dates in a calendar and then shows the dates in an unordered list. The problem now is that those dates need to be sent to the server on page submit so that they can be saved to the database. If I was storing the dates in an input element, say a textbox, that wouldn't be an issue but because they are in an html element whose contents are not posted to the server an alternative strategy needs to be developed. ...
Overview I recently needed to build a web page that would allow a user to capture some information and most importantly select multiple dates. This functionality was core to the application and hence had to be easy and quick to do. This is a public facing website so it had to be intuitive and very responsive. On the face of it it didn't seem too hard, I know enough juery to know what it is capable of and I was pretty sure that there would be some plugins that would help speed things along the way. ...
If you are using MVC it might be worth checking out the telerik controls (http://demos.telerik.com/a... they are free if you are doing an internal or “not for profit” application. If however you do choose to use them, you could come up against a little problem I had. Using the telerik controls with your own custom jQuery. In my case I was using the jQuery UI dialog. It kept throwing an error where I was setting my div to a dialog. Code Snippet $("#textdialog").dialog({ The problem is when ...
This blog post has moved:http://gruffcode.com/... ...
Issue: The code below worked before under version jQuery 1.4.2 but when I upgraded to version 1.4.4 it no longer worked as expected - it did not unselect the list box item, only setting "selectd" worked: _handleClick: function(elem) { var self = this; var initElem = this.element; var checked = $(elem).attr('checked'); var myId = elem.attr('id').replace(ini... + '_chk_', ''); initElem.children('option[v... + myId + ']').attr('selected', function() { if (checked) { return 'selected'; ...
Google now has a feature where the search updates as you type in the search box. You can implement the same feature in your MVC site with a little jQuery and MVC Ajax. Here's how: Create a javascript global variable to hold the previous value of your search box. Use setTimeout to check to see if the search box has changed after some interval. (Note: Don't use setInterval since we don't want to have to turn the timer off while Ajax is processing.) Submit the form if the value is changed. Set the update ...
En este post, trabajaremos una parte que en ocasiones se nos hace un “mundo”, la creación de menús en nuestras aplicaciones web. Nuestro objetivo será evitar la utilización de elementos que puedan ocasionar que la página se vuelva un poco lenta, para ello utilizaremos jquery que viene siendo una herramienta muy semejante a ajax para crear nuestro menú. Para crear nuestro menús de ejemplo necesitaremos de tres elementos: 1. CSS, para aplicar los estilos. 2. Jquery para realizar las animaciones. 3. ...