Share Point Hosted App Query

Right: when we use below code in full page share point hosted app so that it’s working properly

 

Wrong: when we use below code in Client Web Part (share point hosted app) so that it’s not working properly

 

Error: When we click on #why so the error shows Invalid request

 

   <input id=”txtwhy” type=”text” />

    <div id=”divUserProfiles”></div>

 

 

//Get Image From User Profile (Office-365 Environment)

$(document).ready(function () {

 

    $(“#txtwhy”).click(function () {

        users = [];

        userProfileProperties = [];

        SP.SOD.executeFunc(‘sp.js’, ‘SP.ClientContext’, getAllUsers);

    });

});

 

var users = [];

var userProfileProperties = [];

 

//Method to fetch all the users

function getAllUsers() {

 

    var ctx = new SP.ClientContext(appWebUrl);//Get the SharePoint Context object based upon the URL 

    var appCtxSite = new SP.AppContextSite(ctx, hostWebUrl);

    var web = appCtxSite.get_web(); //Get the Site

 

 

    //Textbox value containing search term

    var searchTerm = $(“[Id*=’peoplePickerDiv_TopSpan_i:0#.f|membership|’][Id*=’_ProcessedUser’]”)[0].id.split(‘|’)[2].split(‘_’)[0];

 

 

    clientContext = new SP.ClientContext.get_current();

 

    //Building Keyword query for the search

    var keywordQuery = new Microsoft.SharePoint.Client.Search.Query.KeywordQuery(ctx);

    keywordQuery.set_queryText(searchTerm);

    keywordQuery.set_sourceId(“B09A7990-05EA-4AF9-81EF-EDFAB16C4E31”);

    keywordQuery.set_rowLimit(500);

    keywordQuery.set_trimDuplicates(false);

 

    var searchExecutor = new Microsoft.SharePoint.Client.Search.Query.SearchExecutor(ctx);

    results = searchExecutor.executeQuery(keywordQuery);

 

    ctx.executeQueryAsync(onQuerySuccess, onQueryError);

 

 

}

 

function onQuerySuccess() {

 

    var testing = results.m_value.ResultTables[0];

    $.each(results.m_value.ResultTables[0].ResultRows, function () {

        users.push(this.AccountName);

 

    });

 

    fetchProfilePropertiesForUsers();

 

}

 

function onQueryError(sender, args) {

    alert(args.get_message());

}

 

function fetchProfilePropertiesForUsers() {

 

    var peopleManager = new SP.UserProfiles.PeopleManager(clientContext);

 

    var profilePropertyNames = [“PreferredName”, “PictureURL”, “AboutMe”, “TechNetProfile”, “AccountName”];

 

    for (var i = 0; i < users.length; i++) {

        var userProfilePropertiesForUser = new SP.UserProfiles.UserProfilePropertiesForUser(clientContext, users[i], profilePropertyNames);

        userProfileProperties[i] = peopleManager.getUserProfilePropertiesFor(userProfilePropertiesForUser);

    }

 

    clientContext.executeQueryAsync(onSuccess, onQueryError);

}

 

function onSuccess() {

 

    var html = “<style type=’text/css’> .floatL {float:left;margin:10px;} .floatR {padding-top:10px} .profile {padding:10px 10px;} .editProfile{margin-left:100px;}  div>img {height:72px;width:72px;} </style>”;

    for (var i = 0; i < userProfileProperties.length; i++) {

        html += “<div class=’profile’><div class=’floatL’><img src='” + userProfileProperties[i][1] + “‘ href=’#’ /></div><div class=’floatR’>” + userProfileProperties[i][3] + “</a><br /></div></div><br />”;

    }

    $(“#divUserProfiles”).html(html);

}

 

 

HTML Where we are binding the image

 

   <input id=”txtwhy” type=”text” />

 

 

    <div id=”divUserProfiles”></div>