Saturday 17 August 2013

Top AJAX interview questions and answers


Questions : What is Ajax ?
Answers : Ajax is nothing but acronym for Asynchronous JavaScript and xml , It is not a new technology even it is not a technology but use to enhance web technology , In 2005 Google developer need to more fast search engine so they suggested to use Ajax . in older days When we need to send / fetch data to / from server page was reload every time hence take more time , use more memory , but being use AJAX no need to reload page again and again for sending small amount of data to server through Ajax we utilize more memory and bandwidth and our website work faster and fastest , also able to move and use fetched data , Ajax is used on client site means with java script and html
 
Questions : What is advantage of Ajax
Answers :  Basic advantage of Ajax is Bandwidth utilization means when we have more type of data on same page or use more included page , hence data is fetched without loading the page it's save memory also it is more interactive no any user want lose their information from that page , so the concentrate only on same page fastest where loading a page is difficult or more time consuming Ajax do best work So why in all modern website need concentration to use Ajax ,it is a Browser technology independent of web server software .

Like every thing advantage and disadvantage Ajax has too some disadvantage like

When we use Ajax it is difficult to return back page , when we click on back button we

Got first page(because same page is using for sending or fetching data but when we need just last use thing we could not able to seen last modified data they gone to starting point

And also need to more concentration because it is faster to implement but still it is very beneficial to us
 
Questions : How AJAX Work ?
Answer : How it work means it use with JavaScript , hence java script can communicate directly with the server by using the JavaScript XMLHttpRequest Object using this object JavaScript fetch and send data without reloading the page .

Following key word used with Ajax though JavaScript ;
1.XMLHttpRequest create object for browser like Firebox ,Muzilla, opera ,safari and other .

2>Internet explore use ActiveXObject
3>onreadystatechange henceActiveXObjectvar. readyState ==4 means response is ready to send and sent by server hence process complete there values like 1,2 ,3 means ,initialize ,in process etc ..
4.>object .status== 200 means status is ok other wise produce error404

5> for open a file or data use

Object. open("GET","file.php",true)
 


Questions : Which two methods are used for handling Cross-Domain Ajax Calls ?
Answer : Cross-domain means the ability to manually or automatically access or transfer data between two or more differing security domain
1) CROS (Cross-Origin Resource Sharing) : Works with all HTTP verbs and Mos modern web browsers. Provides better support for error handling than JSONP.
2) JSONP (JSON with padding) : It is only works HTTP GET verb and on legacy browsers.
 
Questions : What are the disadvantages of AJAX?
Answer : These are the disadvantages:
1) AJAX is dependent on Javascript. If there is some Javascript problem with the browser or in the OS,your AJAX functionality may not work.
2) Search engines generally do not index Javascript present in web pages. AJAX can be problematic in Search engines as it uses Javascript for most of its parts.
3) source code written for AJAX is easily human readable.
4) Debugging is difficult. We have often to use additional Javascript code for that.
5) Data of all requests is URL-encoded. It increases the size of the request. It can cause problem while Paginating through GridView if there is a huge data.
6)Slow and unreliable network connection.
7)Problem with browser back button when using AJAX enabled pages.
 

Friday 16 August 2013

How to make Custom radio button and check boxes via css?

css

label {
display: inline-block;
cursor: pointer;
position: relative;
padding-left: 25px;
margin-right: 15px;
font-size: 13px;
}
.wrapper {
width: 500px;
margin: 50px auto;
}
input[type=radio],
input[type=checkbox] {
display: none;
}
label:before {
content: "";
display: inline-block;

width: 16px;
height: 16px;

margin-right: 10px;
position: absolute;
left: 0;
bottom: 1px;
background-color: #aaa;
box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, .3), 0px 1px 0px 0px rgba(255, 255, 255, .8);
}

.radio label:before {
border-radius: 8px;
}
.checkbox label {
margin-bottom: 10px;
}
.checkbox label:before {
    border-radius: 3px;
}

input[type=radio]:checked + label:before {
    content: "\2022";
    color: #f3f3f3;
    font-size: 30px;
    text-align: center;
    line-height: 18px;
}

input[type=checkbox]:checked + label:before {
content: "\2713";
text-shadow: 1px 1px 1px rgba(0, 0, 0, .2);
font-size: 15px;
color: #f3f3f3;
text-align: center;
    line-height: 15px;
}


HTML
<div class="wrapper">
<h3>Radio Button</h3>
<div class="radio">
<input id="male" type="radio" name="gender" value="male">
<label for="male">Male</label>
<input id="female" type="radio" name="gender" value="female">
<label for="female">Female</label>
</div>

<h3>Checkbox</h3>
<div class="checkbox">
<input id="check1" type="checkbox" name="check" value="check1">
<label for="check1">Checkbox No. 1</label>
<br>
<input id="check2" type="checkbox" name="check" value="check2">
<label for="check2">Checkbox No. 2</label>
</div>
</div>
               OUTPUT
                                 

What is the difference between HTML vs XHTML vs DHTML?

HTML:  HTML (HyperText Markup Language): HTML is the most widely accepted language used to build websites. It is the main structure of a website. It builds tables, creates divisions, gives a heading message (In the title bar of programs), and actually outputs text.

XHTML (eXtensible HyperText Markup Language): : XHTML is extremely similar but follows the rules of XML. The main differences between HTML and XHTML are the case-sensitivity, the need to use closing tags for all tags, the need to use quotes around all attribute values and that all attributes must be in lowercase as XML requires. Special characters between tags need to be replaced with its code equivalent. Declaring the correct doctype (first line in source code) and language (in meta tag in the head of the source code) is required.

XHTML is used to be compatible with XML programming. Following the rules now would make it possible to include XML programming in the future. It is not difficult to change HTML pages to XHTML, but it can be time-consuming. Finding all line breaks and images to include closing tags, converting any uppercase to lowercase and any other incompatibility can be a nuisance. Using a find and replace program can allow you to edit your code faster, but you still have to reupload all those changes. It is recommended that programmers try to remember these rules to comply with W3C recommendations, so the web pages appear correctly in most browsers.

When should you be concerned with XHTML instead of just plain HTML? If the website will contain a catalog of items as in an ecommerce site, the site accesses a database, the site accesses information from another source that uses a different programming language or the site is expected to grow and exist for many years. XHTML is used when referring to XML files used for RSS feeds, some music players, some image galleries and many more applications.

XHTML is popular for mobile web design when used with proper CSS code. Try viewing your website in a mobile simulator to see how your website looks. If you want mobile phones like Nokia or iPhone to access your website, you should use XHTML. You may need to change your DOCTYPE, but if you do, you may need to change additional code. Try to avoid JavaScript, large files, large images and tables.

XHTML  is the same as HTML, except it has a cleaner syntax. XHTML uses the same tags as HTML, so people who know HTML know messy XHTML.

Some new rules are followed in XHTML like:

  • XHTML elements must be properly nested.
  • XHTML elements must always be closed.
  • XHTML elements must be in lowercase.
  • XHTML documents must have one root element.
  • In HTML, some elements can be improperly nested within each other, like this:
                 <b><i>This text is bold and italic</b></i>
  • In XHTML, all elements must be properly nested within each other, like this:
                <b><i>This text is bold and italic</i></b>

DHTML(Dynamic HyperText Markup Language): is a combination of different technologies to make your HTML interactive. Common languages used are HTML (of course), Javascript and Stylesheets. is not a language, but the art of using HTML, JavaScript, DOM and CSS together to create dynamic things, such as navigation menus.

How to flip any image via using css?

css
img{
        -moz-transform: scaleX(-1);
        -o-transform: scaleX(-1);
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
        filter: FlipH;
        -ms-filter: "FlipH";
}

image before





image after