Radyo Düğmesi qTip2 - My test case

by Akram kamal

HTML

<script src="http://craigsworks.com/projects/qtip2/packages/nightly/jquery.qtip.js"></script>
<link rel="stylesheet" href="http://craigsworks.com/projects/qtip2/packages/nightly/jquery.qtip.css">
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
<form id="application" action="#" method="post">
    <ul>
                            <li>
                                <label class="left">Do you have a completely fenced yard suitable for a dog?</label>
                                <fieldset class="right">
                                    <label>yes<input type="radio" name="fenced_yard" value="Y"  class="required" /></label>
                                    <label>no<input type="radio" name="fenced_yard" value="N" /></label>
                                </fieldset>
                            </li>
                            <li>
                                <div id="Fence" style="display:none;">
                                    <label class="left">If &ldquo;yes&rdquo;, describe fence, type, height, and approx. yard size:</label>
                                    <input type="text" class="autoclear blur right" name="fence_description" size="24" />
                                </div>
                            </li>
                            <li>
                                <div id="noFence" style="display:none;">
                                    <label class="left">If &ldquo;no&rdquo;, what is your exercise plan?</label>
                                    <input type="text" class="autoclear blur right" name="exercise_plan" size="24" />
                                </div>
                            </li>
                            <li>
                                <label class="left">Do you have a kennel run?</label>
                                <fieldset class="right">
                                    <label>yes<input type="radio" name="kennel_run" value="Y" ...

CSS

body{
    padding: 50px;
}

JavaScript

// Create the tooltips only when document ready
$(document).ready(function() {

/* dynamically make new fields required
    ______________________________________*/
    function required(t) {
        t.find('input').addClass('required');
    };
    
    function unrequired(t) {
        t.find('input').removeClass('required error').qtip('destroy');
        t.find('input[type=text], textarea').val('').addClass('blur').removeClass('focus');
    };
   
/* If fence?
    ______________________________________*/
$('input[name="fenced_yard"]').click(function() {
    if ($(this).val() === "N") {
        $('#Fence').slideUp(function() {
            $('#noFence').slideDown(function() {
                required($(this));
            });
            unrequired($(this));
        });
    } else {
        $('#noFence').slideUp(function() {
            $('#Fence').slideDown(function() {
                required($(this));
            });
            unrequired($(this));
        });
    }
});

/* If kennel, then usage?
    ______________________________________*/
$('input[name="kennel_run"]').click(function() {
    if ($(this).val() === "Y") {
        $('#kennel').slideDown(function() {
            required($(this));
        });
    } else {
        $('#kennel').slideUp(function() {
            unrequired($(this));
        });
    }
});

/* If dog door, then full access?
    ______________________________________*/
$('input[name="doggy_door"]').click(function() {
    if ($(this).val() === "Y") {
        $('#dogDoor').slideDown(function() {
            required($(this));
        });
    } else {
        $('#dogDoor').slideUp(function() {
            unrequired($(this));
            $(this).find(':radio').removeProp('checked');
        });
    }
});

/* If no kennel or fence, then exercise?
    ______________________________________*/
$('input[name="fenced_yard"], input[name="kennel_run"]').click(function() {
    if (($('input[name="fenced_yard"]:checked').val() == "N") &&...