All posts by Thiyagu

Jquery

Difference between ‘return false;’ and ‘e.preventDefault();

1 Comment

Difference between ‘return false;’ and ‘e.preventDefault();

  •  `e.preventDefault()` which will prevent the default event from occurring, but will continue the event flow (ie., next line of code in the function)
  •   return false will always had to go at the end of your function, or at the end where no further execution was needed.

HTML :

<div id=”preventDef”>
<a href=”#”>Pls Click Here!</a>
</div>

<div id=”returnFalse”>
<a href=”#”>Pls Click Here!</a>
</div>

JQUERY

$(“#preventDef a”).click(function(e) {
e.preventDefault();
$(this).hide();
});

$(“#returnFalse a”).click(function(e) {
return false;$(this).hide();
$(this).hide();
});

OUTPUT

Explanation :
If you click first link… it will hide , because it will not fire particular event to fire but it will continue with next line in the function

Bur if you click on second link, it will not hide because it will move the end of the loop/function

Jquery

How to close the div popup/any Element while clicking outside of the popup

3 Comments

How to close the div popup/any Element while clicking outside of the popup

JQUERY

$(document).mouseup(function(e)
{
var container = $(“#divPatientDetail”);
if (container.has(e.target).length === 0)
{
container.hide();
}

});

Explanation:

var container = $(“#divPatientDetail”); — Assigning the selector to the variable

container.hide(); — After checking the condition , it hide the selector element

Note :

It will not hide while clicking inside of the div/Element

MVC

Implementing Globalization , Localization in MVC Razor

1 Comment

Implementing Globalization  , Localization in MVC Razor

 Short introduction:

Globalization  :  Tthe process of designing and developing application that functions in multiple cultures/locales.
(Adapting a global product for a multiple language)
Localization   :  The process of adapting a particular language. ie., which is comfortable to use in the target country.

In this post let we see how we implement Localization

Step 1 :   Add resource file to the application as show in below

Step 2 : Open Resources.resx fils and enter the key and value as like below screen

resource1

Note :  while saving the resource file ,we want to set the access specifier to access the resource name in the view

Step 3 :  Add the following code in the view

               View : Include reference on the top of the view page

@using MVCRazor.Properties
<div> @Resources.sampletext</div>

Step 4 : Run the application

Description :

1 ) @using MVCRazor.Properties  : importing the reference to the view

2) @Resources.sampletext :  @Resources is a name of the resource and sampletext be a key of the resource file

3) At runtime it will display the equlant value match for the key

MVC

MVC Razor : How to call controller from html radio button click event using Jquery

3 Comments

In this post we will discuss about how to call the controller from the radio button click event using jquery.

HTML :

<div id=”radio”>
<input type=”radio” id=”Isactive” name=”Isactive” value=”1″ >Yes</input >
<input type=”radio” id=”Isactive” name=”Isactive” value=”0″ >No</input >
</div>

JQUERY :

$(document).ready(function () {
$(‘input[type=radio]’).live(‘change’, function()
{
alert($(this).val());
window.location = ‘@Url.Action(“UserDetail”, “AllUserDetail”)’;
});

});

Controller : AllUserDetailController

public ActionResult UserDetail()
{
//Perform action here
}

Explanation:

  • window.location = ‘@Url.Action(“UserDetail”, “AllUserDetail”)’;

UserDetail : This will be the name of the action
AllUserDetail : This will be the name of the controller.

 

 

MVC

MVC – Passing JSON data from controller to the view

1 Comment

Passing JSON data from controller to the view

UserDetailController.cs

[HttpPost]
[ValidateInput(false)]
public JsonResult FetchUserDetailsByid(string userID)
{
List<UserDetailByID>  userDetailollection;
try
{
//return the User Details List
userDetailollection = new GetUserDetailsByidModel().FetchUserDetailByid(UserID));
}
catch (Exception ex)
{

throw ex;
}
var jsonSerializer = new JavaScriptSerializer();
string output = jsonSerializer.Serialize(userDetailollection );
return Json(new
{
output
}, JsonRequestBehavior.AllowGet);
}

Included Namespace:

using System;
using System.Collections.Generic;
using System.Web.Mvc;
using System.Web.Script.Serialization;

View (JQUERY)

$.ajax({url: “@Url.Action(“FetchUserDetailsByid”, “UserDetail”)”,
data: “{ ‘userID’: ‘” + userID + “‘ }”,
dataType: “json”,
type: “POST”,
contentType: “application/json; charset=utf-8”,
success: function(data)
{
//Converting JSON String to JSON Object
var jsonObject = $.parseJSON(data.output);
if (parseInt(jsonObject.length) > 0)
{
alert( jsonObject[0].UserName);
}
},
error: function(result) {
alert(“Error”);
}

Note :

1.  URL  “FetchUserDetailsByid” be the name of the method
             “UserDetail” be the name of the controller

2. “var jsonObject = $.parseJSON(data.output);” is used to converting
         json string to object

Jquery

How to split the attribut “class” name in the html element

Leave a comment

How to split the attribute “class” name  in the html element

HTML :

<div id=”divUserDetails” class=”red”>

JQEURY :

$(document).on(“click”, “#divUserDetails”, function()
{
var userColor = $(this).attr(‘class’) == null ? “No User Color Found” : $(this).attr(‘class’);
alert(userColor );
}

Output

Here is the output

Jquery

How to get the top and left positon of clicked td/div

Leave a comment

How to  get the  top and left positon of clicked td/div

Jquery

$(document).on(“click”, “#tbUserDetails”, function()
{
var getclickTop = $(this).offset().top;
var getclickLeft = $(this).offset().left;
}

Explanation:
.on method is used for dynamically created table using jquery (at runtime)

HTML

<table>
<tr>
<td id=’tbUserDetails’></td>
</tr>
</table>

MVC

MVC4 Razor : How to get the value from view to controller

Leave a comment

MVC4 Razor : How to get the value from view to controller ?

Explanation :

Here i explain how to get the value from html razor control (view) to controller

Code in View:

@using (Html.BeginForm())
{
@Html.TextBox(“txtCustomerName”)
<input type=”submit” value=”Send” />
}

Code in Controller

[AcceptVerbs(HttpVerbs.Post)] public ActionResult Index1(FormCollection collection)
{
string customerName = collection[“txtCustomerName”].ToString();
return null;
}

Output :

After press send button the value will be catch in controller (as like below)

Note :
As above , we can get value of other control from the view to controller
1. [AcceptVerbs(HttpVerbs.Post)] , will do action when we use Html.BeginForm()
2. FormCollection : It provides to access  the values that were just posted to your page.