if you want to send an email confirmation to the submission, with those user input data being sent and saved in the database. it is a good approach to use the asp.net custom user control to layout the design of the message template according the user requirement.
we will create a custom asp.net user control naming it as MCustomUC. it will be shown as MCustomUC.ascx in your project file.
In the code behind, define a public property such the uniqure record ID, that we can pass from the host page to the user control, here is the snippet of code from the user control code behind.
public string UniqueConfirmedID
{
get;
set;
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
LoadData();
}
}
public void LoadData()
{
VehicleProvider vehicleProvider = new VehicleProvider();
List<DealerVehicle> myList = vehicleProvider.GetProgramDetailsByID(ConvertToInteger(UniqueConfirmedID));
if (myList != null && myList .Count > 0)
{
BindControls(myList [0]);
}
}
in the submission page, we can dynamically load the user control after the confirmation id is generated
private string LoadEmailContent(string myID)
{
StringBuilder sb = new StringBuilder();
MCustomUC myCustomUC = (MCustomUC)LoadControl("~/UserControls/MCustomUC .ascx");
myCustomUC .ID = "emailContentDetail";
myCustomUC .UniqueConfirmedID= myID;
myCustomUC .LoadData();
// Render the control into the stringbuilder
StringWriter sw = new StringWriter(sb);
Html32TextWriter htw = new Html32TextWriter(sw);
myCustomUC .RenderControl(htw);
string body = sb.ToString();
return body;
}
then we can call the above method and assign the output string to the email body property of the .net mail object. the user will receive the desired email message with the predefined template.
a blog to share Microsoft technologies Azure, DotNet, SharePoint, SQL Server,JavaScript Framework: Node.JS, Angular, React
Monday, April 20, 2015
Wednesday, April 15, 2015
How to Retrieve Host Url Query String from sharepoint App?
I encounter a challenge issue today. My manager want to have a new feature in the current testing sharepoint app. he want the current app can show the record detail. It means that the app will expect a dynamic detail record ID.
Since the app had been inserted into the host page, display the content within the host page iframe section.
here is the url that the use will use to access the record detail
https://<<SharepointWebSite>>/Forms/Pages/MyHostPage.aspx?QueryID1=Value1&QueryID2=Value2&Value3=24833
After I google the web, the MSDN article provide a great help on solving this challenge task.
https://msdn.microsoft.com/en-us/library/office/fp179921.aspx
Step 1. Add New custom properties to the Properties Section in the Elements.xml file for the ClientWebPart.
<Properties>
<Property Name="QueryID1" Type="string" DefaultValue="QueryID1Value" WebBrowsable="true" WebDisplayName="DealerID" WebDescription="" WebCategory="Basic app part category" RequiresDesignerPermission="true">
</Property>
<Property Name="QueryID2" Type="string" DefaultValue="QueryID2Value" WebBrowsable="true" WebDisplayName="DealerID" WebDescription="" WebCategory="Basic app part category" RequiresDesignerPermission="true">
</Property>
<Property Name="QueryID2" Type="string" DefaultValue="QueryID3Value" WebBrowsable="true" WebDisplayName="DealerID" WebDescription="" WebCategory="Basic app part category" RequiresDesignerPermission="true">
</Property>
</Properties>
Step 2. change the Content Type Src attribute by appending the new query string to the end in the Elements.xml file for the ClientWebPart.
<Content Type="html" Src="~remoteAppUrl/Pages/Default.aspx?{StandardTokens}&QueryID1=_QueryID1_&QueryID2=_QueryID2_&QueryID3=_QueryID3_" />
Step 3. Create a JavaScript file to grab the host url query string value and use them to replace those property default value in the path source of content type.
after the deployment, the embedded app will contains the following QueryString with default value replaced _QueryStringName_ in its url
&QueryID1=QueryID1Value&QueryID2=QueryID2Value&QueryID3=QueryID3Value&SenderId=MyID002
<script>
var arrFrames = document.getElementsByTagName("iframe");
for(i = 0; i< arrFrames.length; i++)
{
var iFrame=arrFrames[i];
var QueryID1="QueryID1Value";
if(iFrame.src.indexOf(QueryID1) != -1)
{
var QueryID1Value=getQuerystring("QueryID1");
if (QueryID1Value != null)
{
iFrame.src=iFrame.src.replace(QueryID1,QueryID1Value);
}
}
var QueryID2="QueryID2Value";
if(iFrame.src.indexOf(QueryID2) != -1)
{
var QueryID2Value=getQuerystring("QueryID2");
if (QueryID2Value != null)
{
iFrame.src=iFrame.src.replace(QueryID2,QueryID2Value);
}
}
var QueryID3="QueryID3Value";
if(iFrame.src.indexOf(QueryID3) != -1)
{
var QueryID3Value=getQuerystring("QueryID3");
if (QueryID3Value != null)
{
iFrame.src=iFrame.src.replace(QueryID3,QueryID3Value);
}
}
}
function getQuerystring(key)
{
key = key.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regex = new RegExp("[\\?&]"+key+"=([^&#]*)");
var qs = regex.exec(window.location.href);
if(qs == null)
return null;
else
return qs[1];
}
</script>
Step 4. Deployment the modified Sharepoint App with new Version Number, so the update process can overwrite the existing app.
Step 5. Add javascript code and SharePoint app to the host page.
first, we must add the Script Editor Web Parts from Media and Content Categories to the host page, so that the embedded script will render to replace those default query value after the app part had been rendered

then click on the Edit Snippet Button to open the Embed Script Editor, then copy and paste the above script to the editor, click Insert to complete the process.

second, we will added the app part to the host page, which stays on the top of the Script Editor Web Part.
Now the SharePoint app will able to grab the host web page query string and render them within itself.
Since the app had been inserted into the host page, display the content within the host page iframe section.
here is the url that the use will use to access the record detail
https://<<SharepointWebSite>>/Forms/Pages/MyHostPage.aspx?QueryID1=Value1&QueryID2=Value2&Value3=24833
After I google the web, the MSDN article provide a great help on solving this challenge task.
https://msdn.microsoft.com/en-us/library/office/fp179921.aspx
Step 1. Add New custom properties to the Properties Section in the Elements.xml file for the ClientWebPart.
<Properties>
<Property Name="QueryID1" Type="string" DefaultValue="QueryID1Value" WebBrowsable="true" WebDisplayName="DealerID" WebDescription="" WebCategory="Basic app part category" RequiresDesignerPermission="true">
</Property>
<Property Name="QueryID2" Type="string" DefaultValue="QueryID2Value" WebBrowsable="true" WebDisplayName="DealerID" WebDescription="" WebCategory="Basic app part category" RequiresDesignerPermission="true">
</Property>
<Property Name="QueryID2" Type="string" DefaultValue="QueryID3Value" WebBrowsable="true" WebDisplayName="DealerID" WebDescription="" WebCategory="Basic app part category" RequiresDesignerPermission="true">
</Property>
</Properties>
Step 2. change the Content Type Src attribute by appending the new query string to the end in the Elements.xml file for the ClientWebPart.
<Content Type="html" Src="~remoteAppUrl/Pages/Default.aspx?{StandardTokens}&QueryID1=_QueryID1_&QueryID2=_QueryID2_&QueryID3=_QueryID3_" />
Step 3. Create a JavaScript file to grab the host url query string value and use them to replace those property default value in the path source of content type.
after the deployment, the embedded app will contains the following QueryString with default value replaced _QueryStringName_ in its url
&QueryID1=QueryID1Value&QueryID2=QueryID2Value&QueryID3=QueryID3Value&SenderId=MyID002
<script>
var arrFrames = document.getElementsByTagName("iframe");
for(i = 0; i< arrFrames.length; i++)
{
var iFrame=arrFrames[i];
var QueryID1="QueryID1Value";
if(iFrame.src.indexOf(QueryID1) != -1)
{
var QueryID1Value=getQuerystring("QueryID1");
if (QueryID1Value != null)
{
iFrame.src=iFrame.src.replace(QueryID1,QueryID1Value);
}
}
var QueryID2="QueryID2Value";
if(iFrame.src.indexOf(QueryID2) != -1)
{
var QueryID2Value=getQuerystring("QueryID2");
if (QueryID2Value != null)
{
iFrame.src=iFrame.src.replace(QueryID2,QueryID2Value);
}
}
var QueryID3="QueryID3Value";
if(iFrame.src.indexOf(QueryID3) != -1)
{
var QueryID3Value=getQuerystring("QueryID3");
if (QueryID3Value != null)
{
iFrame.src=iFrame.src.replace(QueryID3,QueryID3Value);
}
}
}
function getQuerystring(key)
{
key = key.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regex = new RegExp("[\\?&]"+key+"=([^&#]*)");
var qs = regex.exec(window.location.href);
if(qs == null)
return null;
else
return qs[1];
}
</script>
Step 4. Deployment the modified Sharepoint App with new Version Number, so the update process can overwrite the existing app.
Step 5. Add javascript code and SharePoint app to the host page.
first, we must add the Script Editor Web Parts from Media and Content Categories to the host page, so that the embedded script will render to replace those default query value after the app part had been rendered
then click on the Edit Snippet Button to open the Embed Script Editor, then copy and paste the above script to the editor, click Insert to complete the process.
second, we will added the app part to the host page, which stays on the top of the Script Editor Web Part.
Now the SharePoint app will able to grab the host web page query string and render them within itself.
Monday, April 13, 2015
How to setup a provider-hosted app for sharepoint 2013 running under local IIS
when we develop a provider-hosted app for sharepoint 2013 with visual studio 2013, we did not need to make any configuration on the sharepoint host site and configuration file in the project. we can simply click start button to debug the provider-hosted app project.
If the provider-hosted app is under specific application pool, in order to use the specific service account to access the database.
Step 1. we must configure the project to run under Local IIS.
Right click on the Web Project, the select Property from the Pop Menu to show the project property window as following.

Step 2. Register the App part for sharepoint in the development environment or farm, use the following link
http://<SharePointWebsite>/_layouts/15/AppRegNew.aspx.
right click on the AppManifest file, then select View Code to open the file in the visual studio, and get the client ID from the section AppPrincipal Section.
<AppPrincipal>
<RemoteWebApplication ClientId="da0b46be-1349-4429-a96c-e2410120b1c2" />
</AppPrincipal>
App Domain: should be your Full Computer Name in the System Windows.
Redirect URI: http://AppDomain/YourProviderHostedAppWeb/
then click on the Create button to register the App in the development environment.
please visit the Register by using AppRegNew.aspx section for detail explanation in the link below.
https://msdn.microsoft.com/en-us/library/office/jj687469.aspx
here is the summary of the succeed registration.
Now, we can press F5 to start the project and debug it.
Warming: you must register the app again, if you close the project.
Tips: since the app is executed under specific application pool with credential being setup for the
service account. we must check the Show Processes from all users check box to show W3P.exe process

If the provider-hosted app is under specific application pool, in order to use the specific service account to access the database.
Step 1. we must configure the project to run under Local IIS.
Right click on the Web Project, the select Property from the Pop Menu to show the project property window as following.
Step 2. Register the App part for sharepoint in the development environment or farm, use the following link
http://<SharePointWebsite>/_layouts/15/AppRegNew.aspx.
right click on the AppManifest file, then select View Code to open the file in the visual studio, and get the client ID from the section AppPrincipal Section.
<AppPrincipal>
<RemoteWebApplication ClientId="da0b46be-1349-4429-a96c-e2410120b1c2" />
</AppPrincipal>
App Domain: should be your Full Computer Name in the System Windows.
Redirect URI: http://AppDomain/YourProviderHostedAppWeb/
then click on the Create button to register the App in the development environment.
please visit the Register by using AppRegNew.aspx section for detail explanation in the link below.
https://msdn.microsoft.com/en-us/library/office/jj687469.aspx
here is the summary of the succeed registration.
Now, we can press F5 to start the project and debug it.
Warming: you must register the app again, if you close the project.
Tips: since the app is executed under specific application pool with credential being setup for the
service account. we must check the Show Processes from all users check box to show W3P.exe process
Subscribe to:
Posts (Atom)