Thursday 8 December 2016

JQuery for Beginners (Concept clear writing)

JQuery is open source lightweight Javascript Library which makes easy interaction between HTML and JavaScript. 

JQuery is not a language. JavaScript is a Language. JQuery is built over JavaScript and acts like a extendable javascript framework to simplifies HTML document manipulation, event handling, animating, and Ajax interactions for rapid web development.

Purpose of jQuery is to make it easy to use JavaScript on your website. JQuery also simplifies a lot of the complicated things from JavaScript, like AJAX calls and DOM manipulation.

If we know HTML CSS and JavaScript then jQuery learning will not be a big problem

jQuery takes a lot of common tasks that require many lines of JavaScript code to accomplish, and wraps them into methods that you can call with a single line of code.
The jQuery library contains the following options (means what JQuery can do):
  1. HTML and DOM operation or management
  2. CSS operation or management
  3. HTML event methods
  4. Animations and Effects
  5. AJAX

JQuery  a single JavaScript file and can be used by adding JQuery library in HTML file. (The <script> tag should be inside the <head> section):
<head>
<script
 src="jquery-3.1.1.min.js"></script>
</head>

No ned to add  type="text/javascript" inside the <script> tags  as JavaScript is the default scripting language in HTML5 and in all modern browsers.

 Common Syntax for JQuery is
$(<Where >).<When >(<What >);

Explanation : I want to show a message when ever document is ready or loaded completely.

Where(Selectors) : On Document.
When (Action): Document is in ready state or loaded completely.
What(Function) : Show an alert message.

JQuery selectors are used to "find" (or select) HTML elements based on their name, id, classes, types, attributes, values of attributes and much more.

JQuery syntax for above requirement is
$(document).ready(alert("Hi this is for for Dotnestspider lovers"));

Basic syntax is: $(selector).action()
  • A $ sign to define/access jQuery
  • A (selector) to "query (or find)" HTML elements
  • A jQuery action() to be performed on the element(s)

Examples:
$(this).hide() - hides the current element.
$("p").hide() - hides all <p> elements.
$(".test").hide() - hides all elements with class="test".

Complete Skeleton Example

<html>
<head>
<meta charset="utf-8" />
<title>Dotnetspider tutorial</title>
</head>
<body>

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

$(document).ready(alert("Hi"));

</script>
</body>
</html>

One special thing in JQuery
$(document).ready(function(){
  
 // jQuery methods are to be here
});

Why this is required?
This is to prevent any jQuery code from running before the document is finished loading (is ready).

It is nice to wait for the document to be completly loaded and ready before working with it. This also allows you to have your JavaScript code before the body of your document, in the head section.

When it fails fail if methods are run before the document is fully loaded
  • Trying to hide an element that is not generated yet
  • Trying to get the size of an image that is not loaded yet

The shorter method for above document.Ready is
$(function(){
  
 // jQuery methods are to be here
});



Saturday 13 February 2016

Facts about Shree Jagganath. Still scientist are curious to know the science behind it. We are proud to be part of Shree Jagganath

1. The flag atop the temple always flaps in the opposite direction of air.
2. From any place in Puri you will always find the Sudarshan Chakra (Chakra at top of Temple) facing you.
3.Normally during day-time, air comes from sea to land & during evening, the vice-versa occurs. But in Puri it’s totally opposite.
4. No bird or planes fly above the temple.
5. The shadow of the main dome is invisible at any time of the day.
6. The quantity of cooked food inside the Temple remains same for the entire year. But that same quantity of prasadam can feed few thousand people & 20 lakh people, Still it won’t get wasted.

7. In the Temple kitchen, 7 pots are kept one on top of another and cooked on firewood. In this process the contents in the top pot get cooked first & then the bottom one.
8. After entering from Singhadwara’s first step (from inside of the Temple), you cannot hear any sound produced by the ocean. But, when you cross the same step (from outside of the Temple) you can hear it. This can be noticed clearly during evening.

Friday 12 February 2016

Some Asp.net code snippets

TextChange event in ASP.NET (type in one textbox and get in other control instantly)
CodeBehind
txtPrice.Attributes.Add("onkeyup", "rewriteLabel()");
txtRtNon.Attributes.Add("onkeyup", "rewriteLabelNon()");

HTML side
function rewriteLabel()
{
       document.getElementById('txtCFPrice').value = document.getElementById('txtPrice').value;
}

function rewriteLabelNon()
 {
       document.getElementById('txtCFNon').value = document.getElementById('txtRtNon').value;
}
Clear the columns of GridView
grdview.Columns.Clear()

Attach Scrollbar in a GridView
<DIV style="height:400px; overflow:auto;Width:775px">
GridView here
</DIV>
String cookiename = TextBox1.Text;
        //grab cookie
        HttpCookie cookie = Request.Cookies[cookiename];
        //exists?
        if (null == cookie)
        {
            Label1.Text = "cookie not found";
        }
        else
        {
            password.Text=cookie.Value.ToString();
        }
Solution
TextBox2.Attributes.Add("value", cookie.Value.ToString());
Description
When the TextMode property of an ASP.NET TextBox is set to Password the value set in the Text property will not display at runtime. This can be a pain, however it is actually by design to prevent the unmasked password from being displayed in the HTML source of the page.
While the security reasons are good to not display the masked password value, leaving it unmasked in the source, it is also necessary at times to display the masked value in the TextBox. For example, a user profile page where the user has the ability to change their password. It makes sense to display it there. After all, the user has already authenticated to get to the page (although the value is sent with the data to the browser and could easily be sniffed).
Security reasons aside, you can work around this by adding the password value to the control as as Attribute. Since the TextBox renders as an HTML input control, you can set the value attribute easily, just as you would set the Text property.

Use this to set the value, instead of setting the Text property. You can still read the value from the control via the Text property.

If you get a error like multiple item can be selected for the dropdownlist.
How to assign text/value to a dropdownlist
The first method to select an item in an ASP.NET DropDownList control is using SelectedIndex property. To find the SelectedIndex of an item, you can use IndexOf method and pass use FindByValue method. Here is the code snippet to select item Mahesh" in the DropDownList.
DropDownList1.SelectedIndex = DropDownList1.Items.IndexOf(DropDownList1.Items.FindByValue("Mahesh"))
Alternatively, you can loop through all items of the DropDownList and compare the value of the item and use Selected property to select the matched item.
Private Function SelectCurrentQuarterAndYear(ByVal stringToSelect As String)
        DropDownList1.ClearSelection()
        For Each item As ListItem In DropDownList1.Items
            If item.Text = stringToSelect Then
                item.Selected = True
                Exit For
            End If

       
Next
End Function
To Disable Browser’s back button

Just put in html side of every page (from which page , you are coming ang to the page you came. Then only you can stop the back button for both the pages. If you are using common user control in all pages the in user contro’s html side put this code.)

<script language="javascript">
        window.history.forward(1);
</script>
MessageBox with alert in DOTNET
protected void ShowMessageBox(string messageDisplay)
        {
            string sJavaScript = "<script language=javascript>\n";
            sJavaScript += "alert('" + messageDisplay + "');\n";
            sJavaScript += "</script>";
            Page page = HttpContext.Current.Handler as Page;

            if (page != null)
            {
                messageDisplay = messageDisplay.Replace("'", "\'");
                ScriptManager.RegisterStartupScript(page, page.GetType(), "err_msg", "alert('" + messageDisplay + "');", true);

            }
        }
You can not add HTML i
nside JavaScript alert(). You can do some custom popup for this porpose like on as jQuery Dialog

Baisic Useful Git Commands

  Pushing a fresh repository Create a fresh repository(Any cloud repository). Open terminal (for mac ) and command (windows) and type the be...