Showing posts with label jQuery. Show all posts
Showing posts with label jQuery. Show all posts

Thursday, December 27, 2012

Using Inheritance in KendoUI

I am in the process of learning KendoUI and was working on this tutorial.

It is a good tutorial showing how the Kendo peeps made good use of basic OO principals that Javascript developers need in order to keep the code clean and readable.

I also put together a fiddle that came from the tutorial as well.

Happy New year

Monday, December 24, 2012

Getting to your WebApi methods in jQuery

I have been working with WebApi in my latest project. If your new to WebApi then this might help you out.

The default api route in Global.asax will look something like,
GlobalConfiguration.Configuration.Routes.MapHttpRoute(
name: "DefaultApi",
routeTemplate: "api/{controller}/{id}",
defaults: new { id = RouteParameter.Optional }
);

In order for you to be able to call your methods in your WebApi controller you will need to use Url.RouteUrl to build the link correctly.
<script type="text/javascript">
var toUrl = '@Url.RouteUrl("DefaultApi", new { httproute = "", controller = "values" , id = "123" })';
$.ajax({
url: toUrl,
type: 'GET',
success: function(result) {
// ...
}
});
</script>

I found a great post on the subject here.

 

If you have any questions feel free to contact me.

Thursday, December 6, 2012

Dynamically create Checkboxes with jQuery

In a recent project I had the need to create checkboxes dynamically from a dataset.

My project was done in MVC 3 sprinkled with jQuery.

[gallery ids="118,123"]


<html lang="en">

<head>

    <meta charset="utf-8" />

    <title>jQuery Build Dynamic Checkboxes</title>

    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />

    <style type="text/css">

          .wrapper{ padding: .5em; border: 1px solid #d81c3f; border-radius: 5px; min-height: 500px; }

    </style>

</head>

<body>

<div>

    <div class='poo'>

    </div>

</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<script>

     (function(){

          var chkContainer = $('.poo');

          var ccId = '1320';

          if(ccId){

               // Call to get your data

               var shoeTypes;

               if(ccId === '1320'){

                    shoeTypes = [

                           { description: 'Runner' , available: true, enabled: true},

                           { description: 'Jogger', available: true, enabled: true },

                           { description: 'Sprinter', available: null, enabled: null },

                           { description: 'Walker', available: true, enabled: true },

                           { description: 'Couch', available: null, enabled: null }

                         ];

               } else {

                    shoeTypes = [ ];

               }

          }

          $.each(shoeTypes, function(index, item){

               // Build the Checkbox

               var chk = '<input type="checkbox" name="' + item.description + ccId + '" ';

               (item.enabled) ? chk += 'checked="true" ' : chk += '';

               (!item.available) ? chk += ' disabled="true"' : chk += '';

               chk += " />";

               $(chk).appendTo(chkContainer);

               // Build the Label for the Checkbox

               $('<label for="' + item.description + ccId +'">' + item.description + '</label>').appendTo(chkContainer);

          });

     })();

</script>

Monday, December 3, 2012

Sublime Text 2

I have been really getting into the jQueries stuff and have recently started using Sublime Text 2 editor and it is great. I am an old school Visual Studio guy and thought VB 5 was the end of all programming and it would never be able to be beat.

I am stupid.

Take a look at the video in this post.