Implement Jquery Auto Complete

Jquery Auto Complete

In this article we will show you how to use auto complete of jQuery. Auto complete widget provides suggestions while you type into the field. Here we are going to show you an example that how to implement auto complete and how we can customize it as per our requirement.

In the below example, we have 3 different objects in an array:
 
var data = [{
label: "Code",
value: "http://www.codehotfix.com"
},
{
label: "Hotfix",
value: "http://www.codehotfix.com"
},
{
label: "Code Hotfix",
value: "http://www.codehotfix.com"}
];
$(function () {
$("#idOfSearchTextBox").autocomplete({
source: function (request, response) {
var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex(request.term), "i");
response($.grep(data, function (item) {
return matcher.test(item.label);
}));
},
select: function (event, ui) {
$("#idOfSearchTextBox").val(ui.item.label);
window.location.href = ui.item.value;
}
});
});

hotfix

Continue reading “Implement Jquery Auto Complete”

MVC Simple Model In ASP.NET

In our previous article we have learnt basics of MVC , now in this article we will learn how to make simple model In MVC.

  • Create New ASP.NET MVC 4 Web Application .
  • Select Internet Website as template.
  • Select ASP.NET as  View Engine
  • Right Click on the model -> Add New Item ->Class -> Movies.cs
MovieModel

Continue reading “MVC Simple Model In ASP.NET”

Avoid multiple call to AuthorizeCore in MVC

AuthorizeCore in MVC

In MVC AuthorizeAttribute Class is another cool feature that makes it easy to add authentication at the Controller level. In AuthorizeAttribute class we have AuthorizeCore function, it specifies that access to a controller or action method is restricted to users who meet the authorization requirement. We can override AuthorizeCore  function as per our authorization logic.

When you place the [Authorize] attribute on a Controller’s action method, a couple of calls get made to the AuthorizeAttribute class at the beginning of each request to your controller to authenticate users. Lately when I was working on a web application I found this multiple calls as an extra overload that even though the user is authorized, AuthorizeCore got executed.

So to avoid this multiple calls, I found one of the property in HttpContext which is  SkipAuthorizationSkipAuthorization is a boolean property, you can set this as true once the user is authorized. The below code snippet will give you the brief idea.

protected override bool AuthorizeCore(HttpContextBase httpContext)
{
if (httpContext.SkipAuthorization) return true; // hack to avoid multiple call to the method
if (!authorized) //if user is not authorize
{
   return false;
}
if (authorized) //if user is authorize
{
   httpContext.SkipAuthorization = true;
   return true;
}
   return false;
}

How to read JSON data from External File

In this article we will understand how we can read JSON data from a external file.JSON is short for JavaScript Object Notation, and is a way to store information in an organized, easy-to-access manner .One of the easiest ways to load JSON data into our web applications is to use jQuery.getJSON().For this we have to understand the term “jQuery.getJSON()” .

So what is significance of jquery.getJSON?????….

jQuery.getJSON()

It loads JSON data from the  server using GET HTTP request .

Picture1

Continue reading “How to read JSON data from External File”

JSON with Javascript and Jquery

JSJavascript has grown  from a way to add interactivity on your page , to a language that lets you perform tasks that once belonged to servers.JSON provides for an easy way to create and store data structures within JavaScript. JSON stands for JavaScript Object Notation…it’s called that because storing data with JSON creates a JavaScript object. The JavaScript object can be easily parsed and manipulated with JavaScript.

First, we create a variable to hold our data, and then we use JSON to define our object. Our sample object above is a simple as it gets. Just an item called firstName and it’s value Sam. When using strings with JSON, you should use them with quotations as above. If you use numbers, then you don’t have to use quotations.

<script> var data = { “Firstname”: “Sam” }; alert(data.Firstname); </script>

Let’s put data inside an HTML element.

<script>
var data = {
"Firstname": "Sam",
"Lastname": "Legend",
"Age": "34"
};

 document.getElementById("placeholder").innerHTML = data.Firstname + " " + data.Lastname + " " + data.Age;
</script>
  • Every object in json is stored with curly braces {}, an array is stored with brackets[].

  • So in order to organize our data, we created an object called users, which held an array (using brackets).

  • That object had a couple of other objects…each stored like before with curly braces {}.

  • Each element in that object was separated by commas.

<html>
<head>
<meta charset="utf-8" />
<title>JSON Data</title>
</head>
<body>
 <div id="placeholder"> </div>
</body>
</html>
<script>
var data = {
"users": [
{
"Firstname": "Sam",
"Lastname": "Legend",
"Age": "34"
},
{
"Firstname": "John",
"Lastname": "Watson",
"Age": "22"
}
]
};
 document.getElementById("placeholder").innerHTML = data.users[0].Firstname + " " + data.users[0].Lastname + " " + data.users[0].Age;
</script>


How to achieve multithreading in Java Script

Achieve Multithreading in Java Script

Alright, before we start let me admit that JavaScript is a single-threaded environment, JavaScript historically suffers from an important limitation that all its execution process remains inside a single thread.

On the web you may found the various ways to archive multi-threading but as far as I know, the only way is HTML5 Web Workers. You can simulate ‘concurrency’ by using techniques like setTimeout(),setInterval() and event handlers.

Yes, all of these features run asynchronously, but non-blocking doesn’t necessarily mean concurrency. Like setInterval() only schedule things to happen later, they don’t run concurrently with anything else. Before multithreading when executing scripts in an HTML page, the page becomes unresponsive until the script is finished.

Multithreading using HTML5 Web Workers

Continue reading “How to achieve multithreading in Java Script”

Autocomplete Textbox Using Jquery/JSON from Database

JSONIn web page designing  autocomplete property of textbox is widely used for making the site user friendly and interactive , so in this article we will understand the simple method for autocompletion of textbox using Jquery.

First we will see a simple example for this then in next step I will show you how you can fetch the data from the database using JSON

HTML Code

<html>
<head>

<!-- Load jQuery, jQuery UI and jQuery ui styles from jQuery website -->
<<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>

var data = [
"Delhi",
"Mumbai",
"Indore",
"Dehradun",
"Assam"];
$(document).ready(
function () {
 $("#City").autocomplete({
source: data,
 autoFocus: true,
});
}
);
</script>
</head>

<body>

<label for="City">City <input type="text" name="CityNames" id="City" /></label>
</body>

</html>

Continue reading “Autocomplete Textbox Using Jquery/JSON from Database”

DLL Hell Problem and Solution

DLL Hell Problem

DLL Hell is a problem in which two different Application share a common assembly and If one Application changes the common assembly, the changes which are not backward compatible will cause another Application to crash. Let us understand this with an example.

Let say you have two Applications, we can call it as Application1 and Application2  and both Applications shares a common Assembly we can call it as Shared. Both Application consumes GetOperation().

Dll hell problem

Continue reading “DLL Hell Problem and Solution”

Export to excel table without hitting server using Jquery

Want to export the data to excel, but don’t  want to hit server again and again ?? So here is the simple way out for you.

In the following steps you will understand how simply we can export the data to excel sheet by using jquery.

Continue reading “Export to excel table without hitting server using Jquery”

Analyse JavaScript Code with JSLint

jslintlogoIn this article we will know how to analyse JavaScript with JSLint and why it is important but first we will start with what is JavaScript.

Java Script is a high level, untyped, and interpreted programming and most importantly its a dynamic programming language (term dynamic used for the those programming languages which, at runtime, execute many common programming behaviors rather than compile time). So that’s why you will never get compile time errors, and you will never get Type Safety with Java Script.

Continue reading “Analyse JavaScript Code with JSLint”