How to open List when Page loads in SharePoint Hosted App?

I want to create an app same like InstantPracticeManager by InstantQuick.
Now I want to know that in a SharePoint Hosted App How can I show the Whole List in a page.
Here I have added one image:
Here there is one list and there are 4 views of that list.
Now the App will be like when I load the page It will show like the image above. Now how can we show the list like this in sharepoint hosted app?
I want the same scenario which is shown in the following blogs:
http://sp2013.blogspot.in/2012/08/use-list-view-in-sharepoint-2013-apps.html
and
http://www.sharepointnutsandbolts.com/2013/08/working-with-web-parts-within.html
where they add a list to an app
Can any one suggest me the idea? I am bit confused.
thanks in advance.

Hi,
According to your post, my understanding is that you want to show the different list view in a page in SharePoint Hosted App.
We can use jQuery and cross-domain library to achieve it.
The following articles for your reference:
Adding a Tabbed View to A Web Part Page Using jQueryUI
http://sympmarc.com/2011/11/09/adding-a-tabbed-view-to-a-web-part-page-using-jqueryui/
How to: Access SharePoint 2013 data from apps using the cross-domain library
http://msdn.microsoft.com/en-us/library/office/fp179927(v=office.15).aspx
SharePoint 2013: Get list items by using the cross-domain library (JSOM)
http://code.msdn.microsoft.com/office/SharePoint-2013-Get-items-d48150ae/view/SourceCode#content
Thanks,
Dennis Guo
TechNet Community Support
Please remember to mark the replies as answers if they help and unmark them if they provide no help. If you have feedback for TechNet Subscriber Support, contact
[email protected]
Dennis Guo
TechNet Community Support

Similar Messages

How to use Sharepoint Modal Popup loader in Sharepoint-Hosted Apps

Hi,
I have a requirement to use a modal popup as loader in SharePoint-Hosted Apps. I have used this like following-
SP.UI.ModalDialog.showWaitScreenWithNoClose(
'Please Wait',
'while we retrieve...',
'400',
'600');
But it does not work if we have "SP.Js" and "SP.runtime.js" included in the page. If we remove the mentioned script, then only modal works, but other functionality related to "Sp.Js" does not work.
Please let me know if there is any solution for the problem.
Thanks in Advance.

Hi,
Chk out this link also
http://stackoverflow.com/questions/4015159/using-jquery-to-display-a-modal-please-wait-dialog-box-message
http://bernado-nguyen-hoan.com/2012/04/23/how-to-close-sharepoint-modal-wait-screen-after-postback-when-page-is-in-dialog-mode/
http://sharepoint.stackexchange.com/questions/24391/how-do-i-show-a-loading-div-when-opening-a-modal-dialog-from-a-customaction
http://blog.collabware.com/2012/10/30/tips-tricks-sharepoint-2010-modal-dialogs/
Thanks
Jaison A
http://infomoss.blogspot.in

How to get hostweb's site collection in SharePoint hosted app?

I want display SharePoint site collection of host web in my SharePoint hosted app. I have used following code.
ExecuteOrDelayUntilScriptLoaded(callSharePoint, "sp.js");
function callSharePoint() {
hostweburl = getQueryStringParameter("SPHostUrl");
appweburl = getQueryStringParameter("SPAppWebUrl");
hostweburl = decodeURIComponent(hostweburl);
appweburl = decodeURIComponent(appweburl);
var scriptbase = appweburl + "/_layouts/15/";
$.getScript(scriptbase + "SP.Runtime.js",
function () {
$.getScript(scriptbase + "SP.js",
function () {
//$.getScript(scriptbase + "SP.Taxonomy.js", function () { });
$.getScript(scriptbase + "SP.RequestExecutor.js", execOperation);
//Loads context, web and lists....
function execOperation() {
try {
//create context for appweburl.
context = new SP.ClientContext(appweburl);
var factory = new SP.ProxyWebRequestExecutorFactory(appweburl);
context.set_webRequestExecutorFactory(factory);
//get hostsite reference & load as web.
appContextSite = new SP.AppContextSite(context, hostweburl);
web = appContextSite.get_web();
context.load(web);
list = web.get_lists();
context.load(list);
webs = appContextSite.get_web().get_webs();
context.load(webs);
//webs = appContextSite.get_site().get_rootWeb().get_webs();
//context.load(webs);
context.executeQueryAsync(onWebsLoaded, onQueryFailed);
catch (err) {
alert(err.message);
function onWebsLoaded(sender, args) {
alert(list.get_count());
var webEnum = list.getEnumerator();
while (webEnum.moveNext()) {
web = webEnum.get_current();
alert(web.get_id());
for (var i = 0; i < webs.get_count() ; i++) {
subwebs = webs.itemAt(i);
recursiveAll(subwebs);
/* recursive call for web */
function recursiveAll(cweb) {
debugger;
alert(cweb.get_title());
var subwebs = cweb.get_webs();
context.load(subwebs);
context.executeQueryAsync(function (sender, args) {
debugger;
var webEnum = subwebs.getEnumerator();
while (webEnum.moveNext()) {
web = webEnum.get_current();
alert(web.get_title());
//recursive call for current web.
recursiveAll(web);
}, function () { debugger; alert('err'); });
In this code I have get all the list of the Host web. But I am not able to get Host webs.
Any of the when I load the Web it gives me the AppWebUrl not the host web.
So I tried by using following code
context = new SP.ClientContext(hostweburl);
web = appContextSite.get_web();
context.load(web);
context.executeQueryAsync(onWebsLoaded, onQueryFailed);
But it gives me error: unexpected response data from server
Is there any other way to view all sites and sub sites of the host web in SharePoint hosted app?

Hi,
Since you are using a provider Hosted app if you want to get the current logged in name than do not use AppOnlyAccessToken else use AccessToken which is App + user Context AccessToken.
then
Web web = clientContext.Web;
clientContext.Load(web);
clientContext.ExecuteQuery();
clientContext.Load(web.CurrentUser);
clientContext.ExecuteQuery();
clientContext.Web.CurrentUser.LoginName;will return proper user Name.
HttpContext.Current.User.Identity.Name will never return the user as this object is related to IIS server of your App Server not sharepoint.you should set this as Anonymous in case of provider hosted app.you can download the below sample which uses the AccessToken which has user name in it.https://code.msdn.microsoft.com/Working-provider-hosted-8fdf2d95
Whenever you see a reply and if you think is helpful,Vote As Helpful! And whenever you see a reply being an answer to the question of the thread, click Mark As Answer

Change the Page title of Default.aspx in SharePoint Hosted App using ECMA Script

Basically i want to change page title dynamically. the thing is default.aspx page is present in the below location
Folders/Pages/Default.aspx ( Verified using
SharePoint Manager 2013 Online )
Could any one let me know how to iterate through the folders and then go to pages and change title of Default.aspx page?
Navaneeth

All the links which is mentioned above is either they are doing it in code behind or javascript like document.title.
I want to change dynamically using ECMA script. the point i found here is if you use the below code you will get an error saying list "Pages" does not exists in the SharePoint site.
clientContext.Web.Lists.GetByTitle("Pages");
So i am wondering how can we change the page title of SharePoint hosted app ( Default.aspx) dynamically
Say example i have one text box and submit button. when give the title in the text box and click on submit the title should reflect in the page.
Navaneeth

Pagination - JavaScipt in "Execute when Page Loads" stop working

I'm using APEX 4.0.
I have a standard report region on a page. In the page's JavaScript - Execute When Page Loads area, I put some javascript code there to initialize hover event handlers for dropdown menus inside the report. It works fine when the report is genarated.
But it stop working when a pagination performed. For example, after clicked 'next" or any number form the pagination dropdown list.
Please advice how to fix it. Thanks.
Shiofan

Hi, Peter:
Thanks for the quick reply. That is appreciated.
My code involves only CSS and JQuery.
I have found out the reason. It is because "Enable Partial Page Refresh" was set to Yes. ( that is the default by APEX, isn't it? ). After I reset it to No, the dropdown menu does work fine after pagination.
I don't know how APEX pagination work together with report attribute "Enable Partial Page Refresh". To me, no matter what, the style sheet, the JavaScript put in page template/page header should always be included since they are common to the page. Can we say this is an APEX bug need to be fixed?
Thanks again.
Shiofan

How to open a JSP page from a form ??? plz help

hi ..
i want to know how to open a jsp page from a oracle apps form using a button .
the requirement is that whenever we click on the button created on the form, it opens a jsp page.
plz help me ..its urgent !! :-(

In portlet project, to navigate between pages, you should not use the URL property to link to a page. Instead, portlets use navigation via action handling. You use the Page Navigation editor to set up links to pages; that is, the navigation editor sets the action property.
Here is an example to hyperlink ans button to open a new page:
# From within the IDE, create a new portlet project. This action creates the project and one page, PortletPage1.jsp.
# Create a second portlet page, called PortletPage2.jsp, for the project.
# Drop a Hyperlink component onto the first portlet page, PortletPage1. (You can drop the Hyperlink on the page in the Design window or on the PortletPage1 node in the Outline window.) Change the Hyperlink's text property to Next Page.
# Drop a Button component (found in the Basic section of the Palette) onto the second portlet page, PortletPage2.
# Open the Page Navigation Editor. It displays the two pages (PortletPage1.jsp and PortletPage2.jsp) of the application.
# Click the PortletPage1.jsp icon in the Navigation window to expand it, and then drag a connector from hyperlink1 to PortletPage2.jsp. Change the name of the connector from case1 to Page2.
# Click the PortletPage2.jsp icon in the Navigation window to expand it, and then drag a connector from button1 to PortletPage1.jsp. Change the name of the connector from case1 to Page1.
# Run and deploy the portlet. The browser displays PortletPage1 and you should see the Next Page hyperlink. When you click the Next Page hyperlink, the Apache Pluto Portal server displays PortletPage2. Click the Page2 button to return to PortletPage1.
Sherry
Creator Team

Dynamically displaying ADF rich components in UI, when page loads

Hi All
Could you please tell me how to display ADF 11g rich components in UI programmatically from managed bean, when page loads.
I tried to call onPageLoad() from pagePhaseListener, however no idea how to set the components to the UI from onPageLoad() method. Please someone help me.
Regards
Venkat.S

Thanks for your response Abhijit.
However in the given video, ADF components are displaying only after clicking the button. But i need to know how to display those components dynamically when page loads(i.e, i wont be clicking any button). While page loads those components should display dynamically.

How to open a web page in JFrame.

Please let me know how to open a web page in the Java Frame.

HTML code can be viewed in any Swing component you want.

How can I find when I loaded Maverick? I want to uninstall.

How can I find when I loaded Maverick? I want to uninstall it, but I want to go back to before I installed it for
Time Machine.

No need to multiple post. See your other thread on this Topic...
https://discussions.apple.com/message/24544578#24544578

How do i sing out from hotmail/ how to open camera when i chat with messenger

how to i sing out from hotmail????????... it says coudn't sign out because web brower cookie........
how to open camera when i chat using messenger?????????

Thanks for your help - I am frustrated that I can't figure this out. I am not getting any error messages but here is what happes. I plug in the IPAD and it shows up in the left hand colum in itunes but it does not sync to ITUNES. When I click on the IPAD, it shows me the tabs but that nothing is actually on the IPAD hard drive. When I click on transfer files manually, the "apply" button does not work. When I turn off the transfer files, the apply button still does not work. So next, I tried the music button, and it does ask whether to "apply" but when I click on apply, nothing happens. Under the music tab, it only shows music that I purchased from ITUNES but not all the music that I purchased on CD and transfered to ITUNES.

How to open all the pages of a file PDF in Photoshop?

Hi,
How to open all the pages of a file PDF in Photoshop?
Or
I need to know the amount of Pages in PDF.
Example:
>Set MyPhotoshop = CreateObject("Photoshop.PDFOpenOptions")
Set MyOpenPref = CreateObject("Photoshop.PDFOpenOptions")
sFileName = "C:\Temp\Myfile.pdf"
>With MyOpenPref
.AntiAlias = True
.Mode = psOpenCMYK
.Resolution = 72
.BitsPerChannel = psDocument8Bits
.CropPage = psBoundingBox
.Page = 4
.SuppressWarnings = True
End With
>MyPhotoshop.Open sFileName, MyOpenPref
I need help.
Thanks

http://www.ps-scripts.com/bb/viewtopic.php?t=1882
Have a look at this thread, the last entry has the full code and has everything you need there.
The answer to knowing how many pages is, you don't need to know!
You use SL code and no error and no page is opened. Thats the crux of the code.

Inputtext component refreshes and the entered data is vanishes only happen when page loads first time

Hi,
Am using 11.1.1.5 adf jdev.
I got unique issue , i have couple of jsff seach pages . In jsff , i have user enterable inputtext box ,Issue is when user enters data for first time . the component refreshes and the entered data is vanishes .
But it happen for the first time when page loads, There is no partial triggers on dat input text box.

Hi John,
My page is not a part of a task flow. The whole app is an Admin app comprising of multiple individual pages navigated using Menu.
I have tried to run this page individually on my local machine as well as when deployed on the WLS server. The behavior is the same.
Kindly advice,
Thanks,
Ram

Javascript in 'Execute when page loads', not working when paging results grid

I have some Javascript in an Apex page, running in 'Execute when page loads'. It does some stuff to a results grid. It works fine on page load, but then doesn't run when I page through, or sort the grid. I presume this is because the grid is being sorted / paged using Ajax, which means the page isn't being fully loaded.
Is there anywhere else I can put the code so it gets applied to the grid on sorts and paging?

Thanks, works perfectly! I used the After Refresh and just selected the region I wanted to trigger the Javascript, and it works great. As you say the scope needs to be Dynamic.
For anyone else reading this, something which caught me out was that my reports region was using the No Template setting, and the Dynamic Action didn't work, as it requires you to use a template which contains #REGION_STATIC_ID# - which is used by the dynamic action to identify the region. Once I switched to using a template, it worked fine.

How do I move the page-load progress meter from the bottom task bar to the top menu bar, or inside the top/header toolbar? I am currently using Firefox Version 3.6.19

How do I move the page-load progress meter from the bottom task bar to the top menu bar, or inside the top/header toolbar? I am currently using Firefox Version 3.6.19.
URL Eaddress: [email protected]

You see the orange (on Linux gray) Firefox button if the Menu Bar is hidden, so you need to hide the Menu bar to get the new appearance.<br />
If you need to access the hidden Menu bar then press F10 or hold down the Alt key to make the Menu Bar appear temporarily.<br />
You can place the Tab Bar on top.
* View > Toolbars : [ ] Menu Bar
* View > Toolbars : [X] Tabs on Top
The Tab bar only appears on the title bar if the Firefox window is maximized.

How to get inputted value in a RTE field on custom page and submit by REST call in 'Sharepoint hosted app'.

Hi I am facing the three questions below.
1. How to use default RTE in custom page in Sharepoint hosted app.
I saw the article of Rich text Editor (ribbon based) in a webpart in SharePoint 2013 and tried it. But it did not work well. I guess it needs code-behind setting, however sharepoint hosted app does not support code-behind.
Does anybody know how to do this?
2. In above case, I placed the below code on custom page and tried to get the field's value when submit button was clicked.
<SharePoint:InputFormTextBox ID="rftDefaultValue"
RichText="true"
RichTextMode="FullHtml" runat="server"
TextMode="MultiLine" Rows="5">
</SharePoint:InputFormTextBox>
In debugger, the returned value was 'undefined'.
var note = $('#hogehoge').val();
Is it possible to get the RTE value? If yes, please let me know how to do this.
3. I need to submit the RTE value using REST call.
In this
article in MSDN, the item creation sample treats single line text field. Does anybody know the sample for RTE?

Hi,
According to your description, you might want to use Rich Text Editor control in your SharePoint hosted app.
First of all, I would suggest you post one question in one thread to make it easier to be discussed, which would also help you get a quick solution.
Though we can add this control into a SharePoint hosted app, however, as we can’t add code behind for it, plus with the potential compatibility issues in different
browsers, I would suggest you use other JavaScript Rich Text Editor plugins instead.
Two JavaScript Rich Text Editor plugins for your reference:
http://quilljs.com/
http://nicedit.com/
If you want to submit the value of Rich Text Editor control to a SharePoint list using REST call, since the content in the Multiple Line of Text column is wrapped
with nested HTML tags, the similar requirement would also be applied to the content to be submitted.
Here is a code snippet about how to update a Multiple Line of Text column for your reference:
updateListItem(_spPageContextInfo.webAbsoluteUrl, "List018", 1);
function updateListItem(siteUrl, listName, itemId)
var itemType = GetItemTypeForListName(listName);
var item = {
"__metadata": { "type": itemType },
"MultiTextEnhanced": "<div><a href='http://bing.com/'>Bing</a><br></p></div>",
"Title": "123"
$.ajax({
url: siteUrl + "/_api/web/lists/getbytitle('" + listName + "')/items(" + itemId + ")",
method: "GET",
headers: { "Accept": "application/json; odata=verbose" },
success: function (data) {
console.log(data);
$.ajax({
url: data.d.__metadata.uri,
type: "POST",
contentType: "application/json;odata=verbose",
data: JSON.stringify(item),
headers: {
"Accept": "application/json;odata=verbose",
"X-RequestDigest": $("#__REQUESTDIGEST").val(),
"X-HTTP-Method": "MERGE",
"If-Match": data.d.__metadata.etag
success: function (data) {
console.log(data);
error: function (data) {
console.log(data);
error: function (data) {
console.log(data);
// Getting the item type for the list
function GetItemTypeForListName(name)
return"SP.Data." + name.charAt(0).toUpperCase() + name.slice(1) + "ListItem";
Thanks
Patrick Liang
Forum Support
Please remember to mark the replies as answers if they help and unmark them if they provide no help. If you have feedback for TechNet Subscriber Support,
contact [email protected]
Patrick Liang
TechNet Community Support

How to open List when Page loads in SharePoint Hosted App?

Similar Messages

Maybe you are looking for