Web Technology Experts Notes

Sunday, 5 April 2015

Ajax Interview Questions and Answers for 3 Year Experienced

Question: How to send ajax request to another domain using JSONP?
JSONP is simple way to overcome XMLHttpRequest same domain policy. With use of JSONP you can send the request to another domain. JSONP is "JSON with Padding", In JSONP we include another domain URL with a parameter i.e callback.
callback's value have a function name which must be present in your webpage.
See Example:

<script>
function myCalllbackFunction(data){
  console.log(data);
} 
</script>

 <script src="//twitter.com/status/user_timeline/padraicb.json?count=10&amp;callback=myCalllbackFunction" type="text/javascript"></script>

Question: CanAJAX requests retain PHP login info?
Yes, I can be.

Question: How can I detect that the Internet connection?
Very simple.
Make a ajax call to reliable server which always return data. To check the Internet connection, request the data to the server. If ajax call return data, internet connection is working else not. But make sure, ajax response must not come from browser cache. For this set the cache:false in ajax call.

Question: How to send Query string(If query string is full URL) in Ajax call?
use encodeURIComponent() before sending query string.
var url=encodeURIComponent(url);

Question: How to send ajax call with https on http page (Suppose, both https and http are same domain)?
If both protocall have same domain, then you can send all ajax request with https on both (https and https page).
Add Following in ajax Header

Access-Control-Allow-Origin: https://www.youwebsitedomain.com

Question: How to get response header of AJax Call?

$.ajax({
    url: '/ajax',
    success:function(data, textStatus, request){
      console.log(request.getResponseHeader('some_header'));
    
    }
});

Question: Can I handle the redirection of xmlhttprequest in Ajax Call?
No,

Question: How can I get the values of all sected checkbox?

$("input:checkbox[name=type]:checked").each(function()
{
//JS array of selected checkbox
    
});

Question: How to pass entire form data in Ajax?

   function onSubmitFunction(){
    $.ajax({
        type: "POST",
        url: "/ajax",
        data: $('#mytestForm').serialize(),
        success: function(msg){
            //console.log(msg); 
        }
    });
    return false;
}

Question: How to get the error messages in jQuery Ajax?

   function onSubmitFunction(){
    $.ajax({
        type: "POST",
        url: "/ajax",
        data: $('#mytestForm').serialize(),
        success: function(msg){
            //console.log(msg); 
        },
       error: function (request, error) {
              console.log(arguments);              
          }
    });
    return false;
}

Friday, 3 April 2015

Ajax Interview Questions and Answer for 1 Year Experienced

Ajax Interview Questions and Answer for Experienced

Question: How to Abort ajax requests using jQuery?
Use abort() function to abort a ajax request.
See Example Below:

var ajaxRequest = $.ajax({
    type: "POST",
    url: "/ajax",
    data: "name1=value1&name2=value2",
    success: function(msg){
       //here success comes
    }
});

//Abort the ajax request
ajaxRequest.abort()

When you abort the ajax call, you can see ajax request as aborted in browser console.

Question: How to redirect a page after success of Ajax call?
You can use window.location.href, to redirect.
See Example Below:

$.ajax({
    type: "POST",
    url: "/ajax",
    data: "name1=value1&name2=value2",
    success: function(msg){
        if(msg.success){
            window.location.href='/newpage.php';
        }
       //here success comes
    }
});

Question: How do I test an empty object?
You can use jQuery isEmptyObject().
See Example Below:

var myArray=new Array();
console.log($.isEmptyObject(myArray));//return true

var myArray=new Array('This is message');
console.log($.isEmptyObject(myArray));//return false

Question: How to submit a form in Ajax?
We can use jQuery ajax function to submit a Form.
See Example Below:
Following is Javascript function

   function onSubmitFunction(){
    $.ajax({
        type: "POST",
        url: "/ajax",
        data: $('#mytestForm').serialize(),
        success: function(msg){
            if(msg.success){
               //here success comes
            }

        }
    });
    return false;
}

Following is HTML Code

<form id="mytestForm" onsubmit="return onSubmitFunction()">
Name: <input name="name" type="text" /><input name="submit" type="submit" value="Submit" />
</form>

Question: How to get the value of textarea?
You can use val function of jQuery to get the text of textarea.
See Below:

console.log($('textarea#idOfTextArea').val());

Question: How to send AJAX call without jQuery?
For sending ajax call in IE7+, Firefox, Chrome, Opera, Safari
XMLHttpRequest
For sending ajax call in IE
use ActiveXObject

See Example Below:

function callAjax(url,method) {
    var xmlhttp;
    if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
            // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4) {
            if (xmlhttp.status == 200) {

                //console.log(xmlhttp.responseText);
            }
        }
    }

    xmlhttp.open(method, url, true);
    xmlhttp.send();
}
callAjax('/ajax?data=1','GET')

Question: How to make all ajax call cache Free?

$.ajaxSetup ({
    // Disable the caching of AJAX responses for all Ajax
    cache: false
});

Question: How to download file?
very simple

window.location="/folder/file.pdf"

Question: How can I add a custom HTTP header in Ajax?
Just Use the header parameter to set the custom header

$.ajax({
    url: '/ajax',
    headers: { 'x-my-custom-header': 'I am good' }
});

Sunday, 5 April 2015

Ajax Interview Questions and Answers for 3 Year Experienced

Best Related Posts are Following:

Friday, 3 April 2015

Ajax Interview Questions and Answer for 1 Year Experienced

Best Related Posts are Following: