Register/Include javascript within RenderingTemplate - javascript

Problem description
Is it possible to register (include) javascript within RenderingTemplate? (RenderingTemplates are used to render list forms or fields)
By using
<SharePoint:RenderingTemplate ID="NewRelatedListItem" runat="server">
<Template>
<span id="part1">
<SharePoint:ScriptLink Name="SPFormFieldAssistant.js" Localizable="false" />
...
</span>
...
</Template>
</SharePoint:RenderingTemplate>
it couldn't be done - it didn't include script at HEAD area, but...:
Source http://img62.imageshack.us/img62/9826/ss20100324092808.png
Is something wrong with my code? Althought script IS at Layouts folder and I checked with Reflector that it uses Layouts folder if Localizable='False'.
I don't want this script to be loaded with every page, but only for forms.
Any ideas on how this could be achieved?
My idea that is not working...
My first idea was to add script programmatically with <% this.Page.ClientScript.RegisterClientScriptInclude("spffa", "/_layouts/SPFormFieldAssistant.js") %>, but it is not working, as that code evaluation is happening in Render method and i read somwhere that you cannot register client scripts within Render method, but usually is done within PreRender method. Pity
My second idea that is still not working
I thought i would create custom UserControl named RegisterClientScript and there within overriden PreRender method i would add scripts i need with client script manager (this.Page.ClientScript...) but, as with SharePoint:ScriptLink, my control also is rendered as text!
my control as text http://img693.imageshack.us/img693/3738/ss20100324115826.png
How do i overcome this and where's the catch?

Looks like you are missing the runat. Try this:
<SharePoint:ScriptLink Name="SPFormFieldAssistant.js" Localizable="false" runat="server" />

It turns out that you can directly add <script> tags to template!
<script src="/_layouts/SPFormFieldAssistant.js" type="text/javascript"></script>
Thank you for the notes however.

Sometime back I had a Similar requirement. For which I have included the script Register in the CreateChildControls method of the Field Control class.

Related

Passing/exposing VXML Application root document variables to JSP

I need to have variables that are defined in my VXML application root document, which other documents modify, available to the JSP/EL pages. The idea here is that based on the value of these variable I can add logic to the JSP to render different blocks of VXML back to the IVR browser.
What I have tried so far does not generate any errors. It simply does not render the expected block of VXML code within the EL. My guess is that I am not de-referencing them correctly in EL.
Below is some of what I have tried.
root.vxml doc has
..
<var name="promptRetries" expr="''" />
...
start.jsp:
<vxml version="2.1" xmlns="http://www.w3.org/2001/vxml" application="/root.vxml" >
....
<assign name="application.promptRetries" expr="'3'" />
.....
<block>
<submit next="${pageContext.request.contextPath}/nextdoc.jsp" />
</block>
nextdoc.jsp
<vxml version="2.1" xmlns="http://www.w3.org/2001/vxml" application="/root.xml" >
....
<!-- at this point I can print and see the value of 3 for promptRetries -->
<!-- How can I expose this to JSP to accomplish something like the code below
I have used .equals() and other forms in the EL expression with no luck.
-->
<c:if test="${(application.promptRetries eq 1)} ">
<!-- Setting prompts for 1 retry -->
<catch event="noinput undefined" count="1" >
<audio expr="curPrompt2"/>
<log expr="buildLogStr(ibmCallId, documentName,frmName ,blkName,
'event=noinput count=1 reprompt', '')" />
</catch>
</c:if>
...
....
When developing VoiceXML applications in JSP, you need to be aware that there are two execution spaces. First, the Java server that generates the VoiceXML. Second, the VoiceXML Browser that executes it.
You already have an example of passing data from JSP to VoiceXML with the ${variable_name} syntax. To pass data from VoiceXML to JSP, you need to explicitly list the variables to send in the submit element:
<submit next="${pageContext.request.contextPath}/nextdoc.jsp" namelist="promptRetries"/>
And then in your second JSP page, use
request.getParameter("promptRetries")
to access the variable sent from the browser.

Javascript returns undefined with asp.net master pages

I'm running into a bit of an issue. My JavaScript function returns "undefined" when using master pages. However, when I'm not using master pages, it works fine. Here is my code:
HTML:
<input id="txtPhoneNumberAreaCode" class="TextBox" runat="server" type="text" onkeyup="GoToNextTextBox(this.id, 3, 'cphMainArea_txtPhoneNumberFirstThree')" />
The Javascript:
function GoToNextTextBox(CurrentTextBox, MaxCharLength, NextTextBox) {
alert(CurrentTextBox.value);//pops up "undefined"
if (CurrentTextBox.value.length == MaxCharLength) {
NextTextBox.focus();
NextTextBox.style.backgroundColor = '#FFFFFF';
}
Again, this works fine when not using master pages. So I'm completely confused.
This is because, you are doing it wrong.
In GoToNextTextBox(), you are expecting a DOM element, but you are passing only its id.
DO this:
<input id="txtPhoneNumberAreaCode" class="TextBox" runat="server" type="text"
onkeyup="GoToNextTextBox(this, 3, 'cphMainArea_txtPhoneNumberFirstThree')" />
When using master pages and user controls the rendered ID of your controls change, but there is a way to stop it.
Let's say you have a Textbox
<asp:Textbox id="txtName" runat="server"></asp:Textbox>
on a standard asp page, it's id will be as you expect, txtName
Now you add a master page, called Site.Master. In your rendered html, the controls name is now different.
cntl1_Site_txtName
I might have the syntax of the new name a bit off, but you can view source and find it for yourself.
There is a way to control that though. There is a property on your page, ClientIDMode.
If i remember correctly it has 3 or 4 options. Auto ID is default I believe.
If you set it to static for that page, then you will no longer get the verbose control IDs, they will be as you expect.
This can be a downfall when using things like Repeaters though. You will not have easy access to specific fields if they do not have the verbose ID

Linking to javascript & CSS using client resource Management API

I am looking to integrate ”lightbox2” (http://lokeshdhakar.com/projects/ligh...) into a DNN module I am developing, this involves using 4x js and css files in the dnn project which come with Lightbox2.
I have followed the resource client management API guide found here (http://www.dotnetnuke.com/Resources/Wiki/Page/Client-Resource-Management-API.aspx) to try and set this up in my module. Unfortunately when I run the module on my local machine I keep getting an error:
Error: TestModule is currently unavailable. DotNetNuke.Services.Exceptions.ModuleLoadException: The server tag is not well formed. ---> System.Web.HttpParseException: The server tag is not well formed. ---> System.Web.HttpException: The server tag is not well formed. at System.Web.UI.TemplateParser.ProcessError(String message) at System.Web.UI.TemplateParser.ParseStringInternal(String text, Encoding fileEncoding) at System.Web.UI.TemplateParser.ParseString(String text, VirtualPath virtualPath, Encoding fileEncoding) --- End of inner exception stack trace --- at System.Web.UI.TemplateParser.ParseString(String text, VirtualPath virtualPath, Encoding fileEncoding) at System.Web.UI.TemplateParser.ParseFile(String physicalPath, VirtualPath virtualPath) at System.Web.UI.TemplateParser.Parse() at System.Web.Compilation.BaseTemplateBuildProvider.get_CodeCompilerType() at System.Web.Compilation.BuildProvider.GetCompilerTypeFromBuildProvider(BuildProvider buildProvider) at System.Web.Compilation.BuildProvidersCompiler.ProcessBuildProviders() at System.Web.Compilation.BuildProvidersCompiler.PerformBuild() at System.Web.Compilation.BuildManager.CompileWebFile(VirtualPath virtualPath) at System.Web.Compilation.BuildManager.GetVPathBuildResultInternal(VirtualPath virtualPath, Boolean noBuild, Boolean allowCrossApp, Boolean allowBuildInPrecompile, Boolean throwIfNotFound, Boolean ensureIsUpToDate) at System.Web.Compilation.BuildManager.GetVPathBuildResultWithNoAssert(HttpContext context, VirtualPath virtualPath, Boolean noBuild, Boolean allowCrossApp, Boolean allowBuildInPrecompile, Boolean throwIfNotFound, Boolean ensureIsUpToDate) at System.Web.Compilation.BuildManager.GetVPathBuildResult(HttpContext context, VirtualPath virtualPath, Boolean noBuild, Boolean allowCrossApp, Boolean allowBuildInPrecompile, Boolean ensureIsUpToDate) at System.Web.UI.TemplateControl.LoadControl(VirtualPath virtualPath) at DotNetNuke.UI.Modules.WebFormsModuleControlFactory.CreateModuleControl(TemplateControl containerControl, ModuleInfo moduleConfiguration) at DotNetNuke.UI.Modules.ModuleControlFactory.LoadModuleControl(TemplateControl containerControl, ModuleInfo moduleConfiguration) at DotNetNuke.UI.Modules.ModuleHost.LoadModuleControl() --- End of inner exception stack trace ---
I am working in the ascx page (not the code) and my script so far is:
<%# Register TagPrefix="dnn" Namespace="DotNetNuke.Web.Client.ClientResourceManagement" Assembly="DotNetNuke.Web.Client" %>
<dnn:DnnJsInclude runat="server" FilePath="FilePath="~/DesktopModules/TestModule/js/jquery-1.7.2.min.js" PathNameAlias="SkinPath" />
<dnn:DnnJsInclude runat="server" FilePath="~/DesktopModules/TestModule/js/jquery-1.7.2.min.js" PathNameAlias="SkinPath" />
<dnn:DnncssInclude runat="server" FilePath="~/DesktopModules/TestModule/css/lightbox.css" PathNameAlias="SkinPath" />
<dnn:DnncssInclude runat="server" FilePath="~/DesktopModules/TestModule/css/screen.css" PathNameAlias="SkinPath" />
I have had a search around a few forums for an answer but there isnt much help available around this. One similar question is here (How to add a Lightbox to a custom DotNetNuke module) but doesn't go into much detail for a javascript novice such as myself
Would be very grateful if someone could point me in the right direction here
Many Thanks
Your first include line repeats: FilePath="FilePath="~
Delete the second FilePath="
Edits after your comment:
You're loading jQuery twice so I'm assuming one of those is supposed to be loading your lightbox plugin (these are your first two lines once the first one is corrected):
<dnn:DnnJsInclude runat="server" FilePath="~/DesktopModules/TestModule/js/jquery-1.7.2.min.js" PathNameAlias="SkinPath" />
<dnn:DnnJsInclude runat="server" FilePath="~/DesktopModules/TestModule/js/jquery-1.7.2.min.js" PathNameAlias="SkinPath" />
Also, I've not tried loading it that way but I have a feeling loading jQuery like this might load it twice (and likely two different versions). Try using:
DotNetNuke.Framework.jQuery.RequestRegistration();
instead.
I use this stuff in my current project and it works fine. The only thing that I can see that's different between yours and mine is that I don't use the PathNameAlias="SkinPath" attribute.
A good way of cross checking is to open the source code for a page that contains your module, and search for the javascript file or css file by name. If it's there, check that the path is right, if it's not there, then you have a problem.
When I write my own scripts, I generally start with alert('here') just to make sure that they are being included. You could temporarily add that to the start of your lightbox js file.
Mark

"onComplete attribute must be javascript function name" what am i typing wrong?

I'm trying to run a piece of JavaScript code on completion of a song in the <cfmediaplayer> tag but whenever i put "playNext()" into the onComplete attribute it provides me with an error telling me it must be a proper name, but that is the proper name? Anybody know where i might be going wrong?
<script type="text/javascript">
function playNext(){
<cfoutput>
var #ToScript(URL.current, "trackNo")#;
</cfoutput>
trackNo++;
$("#" + trackNo).click();
}
</script>
<div style="margin: 0 auto; width: 500px;">
<cfoutput query="getmusic" maxrows="1">
<cfmediaplayer name="musicPlayer" source="/artists/music/#music_location#" autoplay="yes" height="500" width="500" title="#artist_name# - #music_name#" onComplete="playNext"></cfmediaplayer>
</cfoutput>
</div>
This is my code, however i just noticed (using the Web Developer toolbar) that it is saying playNext is undefined, yet clearly i DO have it defined there as displayed. I'm wondering what I may have done wrong, as far as i'm aware my JavaScript looks OK but i'm a novice when it comes to JS so i've probably made a simple mistake.
use onComplete="playNext" not "playNext()"
Try calling "playNext()" in the onComplete attribute as playNext with no quotations or brackets. If that does not work use playNext(). Let me know if that helps.
I could be wrong but I think it has to do with a CFIDE mapping.
The CFIDE/Scripts folder is needed for a lot of the client side controls ColdFusion creates.
Some CFForm elements like the date picker, multiple file upload, cfajaxproxy, cfmediaplayer, etc require these scripts to be mapped or copied to the site.
Here is a SO question that may help.
Workaround for CFIDE Not Web Accessible for AJAX and Flash Built-Ins
Here is a general google search on the subject.
Try a simple script to mute the player you get any 'Coldfusion is undefined' errors. something like
<script language ="javascript">
ColdFusion.Mediaplayer.setMute('musicPlayer', true);
</script>

Plone 3 : Overriding the default Javascript files

I am using Plone 3 and currently trying to override one of the default javascript files i.e. table_sorter.js.
Under the browser directory of my product, I created a directory "javascripts" (just to keep things organized), then registered the directory as a ressource, in configure.zcml:
<browser:resourceDirectory
name="myproduct.javascripts"
directory="javascripts"
layer=".interfaces.IThemeSpecific" />
Where "myproduct" is self explanatory.
Then in jssregistry.xml, I registered and ordered the javascript files:
<javascript id="++resource++myproduct.javascripts/table_sorter.js"
enabled="True"
cookable="False"
inline="False"
insert-after="jquery.js" />
Where table_sorter.js is the name of the javascript file that I need to override.
The reason I need to override the file is because the default has no way of telling the user whether a table is sortable or not until it is clicked on. I need to include icons on the table header by default.
I have followed the above steps but it does not seem to work. I have no idea where I'm going wrong. Any help will be highly appreciated.
You are missing the generic setup import step. Add a file skins.xml to your gs profile with this code:
<?xml version="1.0"?>
<object name="portal_skins" allow_any="False" cookie_persistence="False">
<object name="plonetheme_mytheme_js"
meta_type="Filesystem Directory View"
directory="your.product:skins/plonetheme_mytheme_js"/>
<skin-path name="*">
<layer name="plonetheme_mytheme_js"
insert-after="custom"/>
</skin-path>
</object>
After that, rembember to reinstall your product in order to apply your new gs step
Note: I'm giving another answer simply because code in comments isn't readable. Look at the #Martijn Pierters 's answer (and comments) for the initial part.
You are not overriding the original JavaScript file, only adding a new one.
You can do two different things here:
Remove the original table_sorter.js from portal_javascript:
<javascript id="table_sorter.js" remove="true" />
Because the original table_sorter.js file is server through a skin layer, you can put a new file with the same name in your own skin layer to override the original.
Considering that you have already placed your customised javascript file into your static directory, do as follows.
In file "your/app/profiles/default/jsregistry.xml"
<?xml version="1.0"?>
<object name="portal_javascripts">
<javascript id="table_sorter.js" remove="True" enabled="False" />
<javascript cacheable="True" compression="none" cookable="True"
enabled="True" expression=""
id="++resource++your.app/path/to/customised/script/table_sorter.js" inline="False"/>
</object>
Modify the attributes as you wish. :)

Categories

Resources