Thursday, December 15, 2011

Hide/show Div using Jquery/Json

Earlier i explained Jquery validate dropdown list,Auto complete texbox in jquery,Date format, Cascading dropdownlist in Here i will show a simple way to hide/ show Div or Jquery Toggle.For this i have drop down list with two items which are "General" and "Credit".Then add the on change event to Dropdown list which is call the jquery function when make a selection on drop down list

<asp:dropdownlist id="ddlptype" onchange="PopulatePatient();" runat="server">
 <div id="Organisation">
<tr><td><asp:label id="lblorgname" runat="server" text="Org name"></asp:label></td>     <td><asp:textbox id="txtorgname" runat="server"></asp:textbox></td></tr>
<tr><td><asp:label id="lblEmpCode" runat="server" text="EmpCode"></asp:label></td>     <td><asp:textbox id="txtempcode" runat="server"></asp:textbox></td>   </tr>
A small comparison is perform between Dropdown list selected value with patient type (General and Credit) to make this .if the drop down selected item value is equal to general , I show the organization details div and if no is selected, I hide the div.
function PopulatePatient() {
        var value = $('#<%=ddlptype.ClientID%>').val();
        if (value == "General") {
            var t = document.getElementById("Organisation");

No comments: