I am using the jQuery show and hide functions to present additional form information. I am also using MultiView to switch between multiple pages of the form. I have been reviewing a little about jQuery Cookie but not real sure how to implement the code.
I have the show and hide function working properly, I just need to figure out how to implement Cookies. -Thanks
jQuery Script:
<script type="text/javascript">
$(function () {
$('.thirdPartyForm').hide();
$('#thirdPartyService').click(function () {
if ($(this).is(':checked')) {
$(".thirdPartyForm").show();
} else {
$(".thirdPartyForm").hide();
}
});
$('.emsSection').hide();
$('#emsYES').click(function () {
$('.emsSection').show();
$.cookie('.emsSection');
});
$('#emsNO').click(function () {
$('.emsSection').hide();
});
});
</script>
HTML (CheckBoxes)
<!-- CUSTOMER OPTIONS TABLE -->
<table id="customerOptionsTable">
<tr>
<td colspan="4"><p>Customer Options</p></td>
</tr>
<tr>
<td class="cotTd">HVAC Service</td>
<td class="chkbx"><asp:CheckBox ID="hvacService" runat="server" /></td>
<td class="cotTd">Third Party Site</td>
<td class="chkbx"><asp:CheckBox ID="thirdPartyService" runat="server" /></td>
</tr>
<tr>
<td colspan="4"><!-- SPACER --></td>
</tr>
</table>
HTML (Portion of form that will will show or hide depending on the check)
<tr>
<td class="thirdPartyForm">
Third Party Name (Website Name):
<asp:TextBox ID="thirdPartyName" CssClass="txtbx" runat="server"></asp:TextBox>
Phone Number:
<asp:TextBox ID="thirdPartyNumber" CssClass="txtbx phoneMask" runat="server"></asp:TextBox>
IVR Phone Number:
<asp:TextBox ID="thirdPartyIVR" CssClass="txtbx" runat="server"></asp:TextBox>
User Name:
<asp:TextBox ID="thirdPartyUserName" CssClass="txtbx" runat="server"></asp:TextBox>
</td>
<td class="thirdPartyForm">
Third Party Site Address:
<asp:TextBox ID="thirdPartyAddy" CssClass="txtbx" runat="server"></asp:TextBox>
Secondary Phone Number (if applicable):
<asp:TextBox ID="thirdPartySecondPhone" CssClass="txtbx phoneMask" runat="server"></asp:TextBox>
PIN Number:
<asp:TextBox ID="thirdPartyPIN" CssClass="txtbx" runat="server"></asp:TextBox>
Password:
<asp:TextBox ID="thridPartyPassword" CssClass="txtbx" runat="server"></asp:TextBox>
</td>
</tr>
well, after reviewing a few other postings, I created the following:
$(document).ready(function () {
$('.thirdPartyForm').hide();
if ($.cookie('showhide') == 'showtp') {
$('.thirdPartyForm').show();
}
$('#thirdPartyService').click(function () {
if ($(this).is(':checked')) {
$(".thirdPartyForm").show();
$.cookie('showhide', 'showtp');
}
else {
$(".thirdPartyForm").hide();
$.cookie('showhide', null);
};
});
});