Using javascript in sharepoint 2013
Question
I have created a list in sharepoint 2013 and from that list a form has been created.I have a field called formID and when the form is generated, a textbox was automatically created for that field. I need to used JavaScript in order to modify that textbox.
Below is the code generated for the textbox
<SharePoint:FormField runat="server" id="ff1{$Pos}" ControlMode="New" FieldName="Title" __designer:bind="{ddwrt:DataBind('i',concat('ff1',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@Title')}"/>
Here is the HTML. This HTML has also been created by sharepoint
<WebPartPages:DataFormWebPart runat="server" EnableOriginalValue="False" DisplayName="commonPage" ViewFlag="8" ViewContentTypeId="" Default="FALSE" ListUrl="" ListDisplayName="" ListName="{FA03B5DA-DA12-404A-A3D7-531AF64C0F93}" ListId="fa03b5da-da12-404a-a3d7-531af64c0f93" PageType="PAGE_NEWFORM" PageSize="-1" UseSQLDataSourcePaging="True" DataSourceID="" ShowWithSampleData="False" AsyncRefresh="False" ManualRefresh="False" AutoRefresh="False" AutoRefreshInterval="60" NoDefaultStyle="TRUE" InitialAsyncDataFetch="False" Title="commonPage" FrameType="None" SuppressWebPartChrome="False" Description="" IsIncluded="True" PartOrder="2" FrameState="Normal" AllowRemove="True" AllowZoneChange="True" AllowMinimize="True" AllowConnect="True" AllowEdit="True" AllowHide="True" IsVisible="True" DetailLink="" HelpLink="" HelpMode="Modeless" Dir="Default" PartImageSmall="" MissingAssembly="Cannot import this Web Part." PartImageLarge="" IsIncludedFilter="" ExportControlledProperties="True" ConnectionID="00000000-0000-0000-0000-000000000000" ID="g_dad58f58_2e43_4881_882e_ab840e0d9b4f" ChromeType="None" ExportMode="All" __MarkupType="vsattributemarkup" __WebPartId="{DAD58F58-2E43-4881-882E-AB840E0D9B4F}" __AllowXSLTEditing="true" WebPart="true" Height="" Width=""><DataSources>
<SharePoint:SPDataSource runat="server" DataSourceMode="ListItem" SelectCommand="<View><Query><Where><Eq><FieldRef Name="ContentType"/><Value Type="Text">Item</Value></Eq></Where></Query></View>" UseInternalName="True" UseServerDataFormat="True"><SelectParameters><WebPartPages:DataFormParameter ParameterKey="ListItemId" PropertyName="ParameterValues" DefaultValue="0" Name="ListItemId"></WebPartPages:DataFormParameter><WebPartPages:DataFormParameter ParameterKey="weburl" PropertyName="ParameterValues" DefaultValue="https://tcfddemo.sharepoint.com/sites/Adelphi" Name="weburl"></WebPartPages:DataFormParameter><WebPartPages:DataFormParameter ParameterKey="ListID" PropertyName="ParameterValues" DefaultValue="{FA03B5DA-DA12-404A-A3D7-531AF64C0F93}" Name="ListID"></WebPartPages:DataFormParameter>
</SelectParameters><UpdateParameters><WebPartPages:DataFormParameter ParameterKey="ListItemId" PropertyName="ParameterValues" DefaultValue="0" Name="ListItemId"></WebPartPages:DataFormParameter><WebPartPages:DataFormParameter ParameterKey="weburl" PropertyName="ParameterValues" DefaultValue="https://tcfddemo.sharepoint.com/sites/Adelphi" Name="weburl"></WebPartPages:DataFormParameter><WebPartPages:DataFormParameter ParameterKey="ListID" PropertyName="ParameterValues" DefaultValue="{FA03B5DA-DA12-404A-A3D7-531AF64C0F93}" Name="ListID"></WebPartPages:DataFormParameter>
</UpdateParameters><InsertParameters><WebPartPages:DataFormParameter ParameterKey="ListItemId" PropertyName="ParameterValues" DefaultValue="0" Name="ListItemId"></WebPartPages:DataFormParameter><WebPartPages:DataFormParameter ParameterKey="weburl" PropertyName="ParameterValues" DefaultValue="https://tcfddemo.sharepoint.com/sites/Adelphi" Name="weburl"></WebPartPages:DataFormParameter><WebPartPages:DataFormParameter ParameterKey="ListID" PropertyName="ParameterValues" DefaultValue="{FA03B5DA-DA12-404A-A3D7-531AF64C0F93}" Name="ListID"></WebPartPages:DataFormParameter>
</InsertParameters><DeleteParameters><WebPartPages:DataFormParameter ParameterKey="ListItemId" PropertyName="ParameterValues" DefaultValue="0" Name="ListItemId"></WebPartPages:DataFormParameter><WebPartPages:DataFormParameter ParameterKey="weburl" PropertyName="ParameterValues" DefaultValue="https://tcfddemo.sharepoint.com/sites/Adelphi" Name="weburl"></WebPartPages:DataFormParameter><WebPartPages:DataFormParameter ParameterKey="ListID" PropertyName="ParameterValues" DefaultValue="{FA03B5DA-DA12-404A-A3D7-531AF64C0F93}" Name="ListID"></WebPartPages:DataFormParameter>
</DeleteParameters>
</SharePoint:SPDataSource>
</DataSources>
<Xsl>
<xsl:stylesheet xmlns:x="http://www.w3.org/2001/XMLSchema" xmlns:dsp="http://schemas.microsoft.com/sharepoint/dsp" version="1.0" exclude-result-prefixes="xsl msxsl ddwrt" xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime" xmlns:asp="http://schemas.microsoft.com/ASPNET/20" xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:msxsl="urn:schemas-microsoft-com:xslt" xmlns:SharePoint="Microsoft.SharePoint.WebControls" xmlns:ddwrt2="urn:frontpage:internal">
<xsl:output method="html" indent="no"/>
<xsl:decimal-format NaN=""/>
<xsl:param name="dvt_apos">'</xsl:param>
<xsl:param name="ManualRefresh"></xsl:param>
<xsl:variable name="dvt_1_automode">0</xsl:variable>
<xsl:template match="/" xmlns:x="http://www.w3.org/2001/XMLSchema" xmlns:dsp="http://schemas.microsoft.com/sharepoint/dsp" xmlns:asp="http://schemas.microsoft.com/ASPNET/20" xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer" xmlns:SharePoint="Microsoft.SharePoint.WebControls">
<xsl:choose>
<xsl:when test="($ManualRefresh = 'True')">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="top">
<xsl:call-template name="dvt_1"/>
</td>
<td width="1%" class="ms-vb" valign="top">
<img src="/_layouts/15/images/staticrefresh.gif" id="ManualRefresh" border="0" onclick="javascript: {ddwrt:GenFireServerEvent('__cancel')}" alt="Click here to refresh the dataview."/>
</td>
</tr>
</table>
</xsl:when>
<xsl:otherwise>
<xsl:call-template name="dvt_1"/>
</xsl:otherwise>
</xsl:choose>
</xsl:template>
<xsl:template name="dvt_1">
<xsl:variable name="dvt_StyleName">ListForm</xsl:variable>
<xsl:variable name="Rows" select="/dsQueryResponse/Rows/Row"/>
<div>
<span id="part1">
<table border="0" width="100%">
<xsl:call-template name="dvt_1.body">
<xsl:with-param name="Rows" select="$Rows"/>
</xsl:call-template>
</table>
</span>
<SharePoint:AttachmentUpload runat="server" ControlMode="New"/>
<SharePoint:ItemHiddenVersion runat="server" ControlMode="New"/>
</div>
</xsl:template>
<xsl:template name="dvt_1.body">
<xsl:param name="Rows"/>
<tr>
<td class="ms-toolbar" nowrap="nowrap">
<table>
<tr>
<td width="99%" class="ms-toolbar" nowrap="nowrap"><IMG SRC="/_layouts/15/images/blank.gif" width="1" height="18"/></td>
<td class="ms-toolbar" nowrap="nowrap">
<SharePoint:SaveButton runat="server" ControlMode="New" id="savebutton1"/>
</td>
<td class="ms-separator"> </td>
<td class="ms-toolbar" nowrap="nowrap" align="right">
<SharePoint:GoBackButton runat="server" ControlMode="New" id="gobackbutton1"/>
</td>
<td><input type="text" id="userType"/></td> <!-- look here -->
<td><input type="button" value="click here to change view" id="userTypeButton" onclick="function1()"/></td>
</tr>
</table>
</td>
</tr>
<tr>
<td class="ms-toolbar" nowrap="nowrap">
<SharePoint:FormToolBar runat="server" ControlMode="New"/>
<SharePoint:ItemValidationFailedMessage runat="server" ControlMode="New"/>
</td>
</tr>
<xsl:call-template name="dvt_1.rowedit"/>
<tr>
<td class="ms-toolbar" nowrap="nowrap">
<table>
<tr>
<td width="99%" class="ms-toolbar" nowrap="nowrap"><IMG SRC="/_layouts/15/images/blank.gif" width="1" height="18"/></td>
<td class="ms-toolbar" nowrap="nowrap">
<SharePoint:SaveButton runat="server" ControlMode="New" id="savebutton2"/>
</td>
<td class="ms-separator"> </td>
<td class="ms-toolbar" nowrap="nowrap" align="right">
<SharePoint:GoBackButton runat="server" ControlMode="New" id="gobackbutton2"/>
</td>
</tr>
</table>
</td>
</tr>
</xsl:template>
<xsl:template name="dvt_1.rowedit">
<xsl:param name="Pos" select="position()"/>
<tr>
<td>
<table border="0" cellspacing="0" width="100%">
<tr>
<td width="190px" valign="top" class="ms-formlabel">
<H3 class="ms-standardheader">
<nobr>formID<span class="ms-formvalidation"> *</span>
</nobr>
</H3>
</td>
<td width="400px" valign="top" class="ms-formbody" >
<SharePoint:FormField runat="server" id="ff1{$Pos}" ControlMode="New" FieldName="Title" __designer:bind="{ddwrt:DataBind('i',concat('ff1',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@Title')}"/>
<SharePoint:FieldDescription runat="server" id="ff1description{$Pos}" FieldName="Title" ControlMode="New"/>
</td>
</tr>
<tr>
<td width="190px" valign="top" class="ms-formlabel">
<H3 class="ms-standardheader">
<nobr>surgeon_name</nobr>
</H3>
</td>
<td width="400px" valign="top" class="ms-formbody">
<SharePoint:FormField runat="server" id="ff2{$Pos}" ControlMode="New" FieldName="tsnn" __designer:bind="{ddwrt:DataBind('i',concat('ff2',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@tsnn')}"/>
<SharePoint:FieldDescription runat="server" id="ff2description{$Pos}" FieldName="tsnn" ControlMode="New"/>
</td>
</tr>
<tr>
<td width="190px" valign="top" class="ms-formlabel">
<H3 class="ms-standardheader">
<nobr>surgeon_surname</nobr>
</H3>
</td>
<td width="400px" valign="top" class="ms-formbody">
<SharePoint:FormField runat="server" id="ff3{$Pos}" ControlMode="New" FieldName="_x0069_xr2" __designer:bind="{ddwrt:DataBind('i',concat('ff3',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@_x0069_xr2')}"/>
<SharePoint:FieldDescription runat="server" id="ff3description{$Pos}" FieldName="_x0069_xr2" ControlMode="New"/>
</td>
</tr>
<tr>
<td width="190px" valign="top" class="ms-formlabel">
<H3 class="ms-standardheader">
<nobr>date_created</nobr>
</H3>
</td>
<td width="400px" valign="top" class="ms-formbody">
<SharePoint:FormField runat="server" id="ff4{$Pos}" ControlMode="New" FieldName="date_created" __designer:bind="{ddwrt:DataBind('i',concat('ff4',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@date_created')}"/>
<SharePoint:FieldDescription runat="server" id="ff4description{$Pos}" FieldName="date_created" ControlMode="New"/>
</td>
</tr>
<tr>
<td width="190px" valign="top" class="ms-formlabel">
<H3 class="ms-standardheader">
<nobr>lab_name</nobr>
</H3>
</td>
<td width="400px" valign="top" class="ms-formbody">
<SharePoint:FormField runat="server" id="ff5{$Pos}" ControlMode="New" FieldName="d0h5" __designer:bind="{ddwrt:DataBind('i',concat('ff5',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@d0h5')}"/>
<SharePoint:FieldDescription runat="server" id="ff5description{$Pos}" FieldName="d0h5" ControlMode="New"/>
</td>
</tr>
<tr>
<td width="190px" valign="top" class="ms-formlabel">
<H3 class="ms-standardheader">
<nobr>lab_surname</nobr>
</H3>
</td>
<td width="400px" valign="top" class="ms-formbody">
<SharePoint:FormField runat="server" id="ff6{$Pos}" ControlMode="New" FieldName="zn0z" __designer:bind="{ddwrt:DataBind('i',concat('ff6',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@zn0z')}"/>
<SharePoint:FieldDescription runat="server" id="ff6description{$Pos}" FieldName="zn0z" ControlMode="New"/>
</td>
</tr>
<tr>
<td width="190px" valign="top" class="ms-formlabel">
<H3 class="ms-standardheader">
<nobr>status</nobr>
</H3>
</td>
<td width="400px" valign="top" class="ms-formbody">
<SharePoint:FormField runat="server" id="ff7{$Pos}" ControlMode="New" FieldName="status" __designer:bind="{ddwrt:DataBind('i',concat('ff7',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@status')}"/>
<SharePoint:FieldDescription runat="server" id="ff7description{$Pos}" FieldName="status" ControlMode="New"/>
</td>
</tr>
<tr id="idAttachmentsRow">
<td nowrap="true" valign="top" class="ms-formlabel" width="20%">
<SharePoint:FieldLabel ControlMode="New" FieldName="Attachments" runat="server"/>
</td>
<td valign="top" class="ms-formbody" width="80%">
<SharePoint:FormField runat="server" id="AttachmentsField" ControlMode="New" FieldName="Attachments" __designer:bind="{ddwrt:DataBind('i','AttachmentsField','Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@Attachments')}"/>
<script>
var elm = document.getElementById("idAttachmentsTable");
if (elm == null || elm.rows.length == 0)
document.getElementById("idAttachmentsRow").style.display='none';
</script>
</td>
</tr>
<xsl:if test="$dvt_1_automode = '1'" ddwrt:cf_ignore="1">
<tr>
<td colspan="99" class="ms-vb">
<span ddwrt:amkeyfield="ID" ddwrt:amkeyvalue="ddwrt:EscapeDelims(string(@ID))" ddwrt:ammode="view"></span>
</td>
</tr>
</xsl:if>
</table>
</td>
</tr>
</xsl:template>
</xsl:stylesheet> </Xsl>
<DataFields>
</DataFields>
<ParameterBindings>
<ParameterBinding Name="ListItemId" Location="QueryString(ID)" DefaultValue="0"/>
<ParameterBinding Name="weburl" Location="None" DefaultValue="https://tcfddemo.sharepoint.com/sites/Adelphi"/>
<ParameterBinding Name="ListID" Location="None" DefaultValue="{FA03B5DA-DA12-404A-A3D7-531AF64C0F93}"/>
<ParameterBinding Name="dvt_apos" Location="Postback;Connection"/>
<ParameterBinding Name="ManualRefresh" Location="WPProperty[ManualRefresh]"/>
<ParameterBinding Name="UserID" Location="CAMLVariable" DefaultValue="CurrentUserName"/>
<ParameterBinding Name="Today" Location="CAMLVariable" DefaultValue="CurrentDate"/>
</ParameterBindings>
</WebPartPages:DataFormWebPart>
and here is the javascript I wrote
<script>
function function1(){
var type=document.getElementById("userType").value;
//window.alert(type);
if(type=="lab"){
window.alert("you are lab");
document.getElementById("ff1{$Pos}").disabled=true;
}
else if (type=="surgeon"){
window.alert("you are surgeon");
}
}
</script>
My question is how do I access this textbox using "document.getElementByID" and pure javascript. I have tried to use the default ID, but it does not work.
1 answers
solution1
1 ACCPTED 2016-03-21 08:12:36
To wrap it up: you can get the HTML element through javascript using the generated ID by SharePoint. Just navigate to the page and look at the source. Get the ID from there and use this in your document.getElementById(xxx).
So using 'ff1{$Pos}' won't work as the element's ID is generated/replaced on page load.
The id's will mostle start with ctl00_PlaceHolderMain_[yourid]
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.
Related Question
Return SharePoint 2013 current user using Javascript
SharePoint 2013 get current user using JavaScript
Exposing Sharepoint 2013 REST API Get using JavaScript
Insert user in PeopleOrGroup Field using javascript SharePoint 2013
Unable to access sharepoint 2013 site using COM javascript
Getting List data from Sharepoint 2013 using javascript
Limit the number of items that can be entered in a SharePoint 2013 List using JavaScript
Null Reference Type Error using Javascript in Sharepoint 2013
SharePoint2013 - Javascript - Pagination in client side- Using listitemcollectionposition
Setting Search Center URL in SharePoint 2013 using Javascript CSOM
Related Tags