Trying to figure this one out. There’s a very simple script function to check the state of a checkbox on a custom ASPX form, and show or hide a table row accordingly. It works just fine in 2010. In 2013, we get the error that the function being called is undefined, and the showing/hiding don’t work. Any ideas why that would be the case? Thanks for looking!
The function definition (located as the very last element of the ASPX page, after the final </asp:Panel>
<script type=”text/javascript” language=”javascript”>
$(function ChkClosedClicked(sender) {
if ($(“input[name$=ChkClosed]”).is(‘:checked’))
$(‘#<%=trFinalEmail.ClientID %>’).show();
else
$(‘#<%=trFinalEmail.ClientID %>’).hide();
}
);
</script>
The relevant part of the table and field definitions:
<tr>
<td class=”formlabel”>
Closed?
</td>
<td class=”formfield”>
<div class=”clearfloat”>
<asp:CheckBox ID=”ChkClosed” runat=”server” AutoPostBack=”false” Checked=”false”
Text=” “ onClick=”ChkClosedClicked(this)” />
</div>
<div class=”clearfloat”>
</div>
</td>
</tr>
<tr id=”trFinalEmail” runat=”server” style=”display: none”>
<td class=”formlabel”>
Final Email
</td>
<td class=”formfield”>
<div class=”clearfloat”>
<asp:TextBox ID=”TxtFinalEmail” CssClass=”txt” runat=”server” TextMode=”MultiLine”
Rows=”6″ Columns=”20″ Width=”400px”></asp:TextBox>
</div>
<div class=”clearfloat”>
</div>
</td>
</tr>
Additionally, in SP2013 the AssetPicker.js file uses a global named $ which will conflict with your code (overwriting jQuery or vice versa).
To fully protect your code you should init your $ jQuery references within a closure:
(function($, document, window) {
window.ChkClosedClicked = function (sender) { };
})(jQuery, document, window); // jQuery resolved to $, document & window passed for performance.
Would also be better practice to use Prashanth Padebettu’s suggestion which removes the requirement on a ChkClosedClicked global method however as you said this requires additional changes.
Thanks so much for the reply, Prashanth. If I were coding from scratch I would almost certainly do it that way as well. In this case I was trying to figure out why something I inherited that did work in 2010 no longer did when moved to 2013, and apparently some extra characters around the function definition were the culprit. I appreciate the time you took to look at this!
Thanks, Paul – this did indeed solve the issue. Much appreciated!
Hi Stephanie,
I replicated this on my system using an application page. I made following changes and it worked.
1. Added a jquery reference <script src=”https://code.jquery.com/jquery-2.1.4.min.js”></script>
2. Instead of onclick in the control, I added in JQuery
$(document).ready(function () {
$(‘#ChkClosed’).click(ChkClosedClicked);
function ChkClosedClicked() {
if ($(“input[name$=ChkClosed]”).is(‘:checked’))
$(‘#<%=trFinalEmail.ClientID %>’).show();
else
$(‘#<%=trFinalEmail.ClientID %>’).hide();
}
}
3. Changed the tag to use client id
<asp:CheckBox ID=”ChkClosed” ClientIDMode=”Static” runat=”server” Checked=”false”
Text=” ” />
Please visit my blog: http://www.thesharepointguide.com/
Remove the $() that wraps the chkClosedClick function, and it should work properly.
