How to insert data into SharePoint hosted list(hosted web app list)

Question

I want to insert data into SharePoint hosted app list through SharePoint hosted app,for that I am using bellow code.

I followed plenty of articles and many among them show same code,but this code is not working for me,so can any one tell me what's wrong with this code?

because I am alway getting failed message after making many changes by referring many articles but still it is not able to insert the record in hosted app list.

Code:

var hostWebUrl;
var appWebUrl;
var appCtxSite;
hostWebUrl = decodeURIComponent(manageQueryStringParameter('SPHostUrl'));
appWebUrl = decodeURIComponent(manageQueryStringParameter('SPAppWebUrl'));

function manageQueryStringParameter(paramToRetrieve) {
    var params =
    document.URL.split("?")[1].split("&");
    var strParams = "";
    for (var i = 0; i < params.length; i = i + 1) {
        var singleParam = params[i].split("=");
        if (singleParam[0] == paramToRetrieve) {
            return singleParam[1];
        }
    }
}
$(document).ready(function () {
    $(".click").click(function () {
        Insert();
    });
});

var listItem;
function Insert() {
    var ctx = new SP.ClientContext(appWebUrl);//Get the SharePoint Context object based upon the URL
    var context = new SP.AppContextSite(ctx, hostWebUrl);
    // var web = context.get_web(); //Get the Site 
    var list = context.get_web().get_lists().getByTitle("List"); //Get the List based upon the Title
    var listCreationInformation = new SP.ListItemCreationInformation(); //Object for creating Item in the List
    listItem = list.addItem(listCreationInformation);
    listItem.set_item('Title', $("#txt_Title").val());
    listItem.set_item('Name', $("#txt_Name").val());
    listItem.update();
    ctx.load(listItem);
    ctx.executeQueryAsync(
        Function.createDelegate(this, success),
        Function.createDelegate(this, fail)
       );
}

function success() {
    alert("Completed");
}
function fail() {
    alert("failed -- " + appWebUrl);
}

Answer 1

var hostWebUrl;
var appWebUrl;
var appCtxSite;
hostWebUrl = decodeURIComponent(manageQueryStringParameter('SPHostUrl'));
appWebUrl = decodeURIComponent(manageQueryStringParameter('SPAppWebUrl'));

function manageQueryStringParameter(paramToRetrieve) {
    var params =
    document.URL.split("?")[1].split("&");
    var strParams = "";
    for (var i = 0; i < params.length; i = i + 1) {
        var singleParam = params[i].split("=");
        if (singleParam[0] == paramToRetrieve) {
            return singleParam[1];
        }
    }
}
$(document).ready(function () {
    $(".click").click(function () {
        Insert();
    });
});

var listItem;
function Insert() {
    var ctx = new SP.ClientContext(appWebUrl);//Get the SharePoint Context object based upon the URL
   // var context = new SP.AppContextSite(ctx, hostWebUrl);
    // var web = context.get_web(); //Get the Site 
    var list = ctx.get_web().get_lists().getByTitle("List"); //Get the List based upon the Title
    var listCreationInformation = new SP.ListItemCreationInformation(); //Object for creating Item in the List
    listItem = list.addItem(listCreationInformation);
    listItem.set_item('Title', $("#txt_Title").val());
    listItem.set_item('Name', $("#txt_Name").val());
    listItem.update();
    ctx.load(listItem);
    ctx.executeQueryAsync(
        Function.createDelegate(this, success),
        Function.createDelegate(this, fail)
       );
}

function success() {
    alert("Completed");
}
function fail() {
    alert("failed -- " + appWebUrl);
}

var ctx = new SP.ClientContext(appWebUrl);//Get the SharePoint Context object based upon the URL
    var context = new SP.AppContextSite(ctx, hostWebUrl);
    // var web = context.get_web(); //Get the Site 
    var list = context.get_web().get_lists().getByTitle("List"); //Get the List based upon the Title

This was mistake i was passing host url for accessing hosted web app list.