$(document).ready(function() {
    var resultwindow = "#tax-benefit-for-employees";
    // initialize sliders
    $("#salarySlider").after('<div id="salary-amount" class="amount"></div>');
    $("#paymentSlider").after('<div id="payment-amount" class="amount"></div>');

    // slider specific             
    $("#salarySlider").slider({
        min: 1000, max: 10000, step: 50,
        animate: false,
        slide: function(event, ui) {
            $("#monthlySalary").val(ui.value);
            $(this).parent().find(".amount").text(ui.value + ' TL');
        }
    });
    $("#paymentSlider").slider({
        min: 10, max: 1000, step: 10,
        slide: function(event, ui) {
            $("#monthlyPayment").val(ui.value);
            $(this).parent().find(".amount").text(ui.value + ' TL');
        }
    });

    // set default values
    $("#salary-amount").text($("#salarySlider").slider('option', 'min') + ' TL');
    $("#payment-amount").text($("#paymentSlider").slider('option', 'min')+ ' TL');

    $("#getTaxBenefits").click(function() {
        // clear results
        $(resultwindow).hide().empty();
        $("input.calculate-button").attr("disabled", "true");
        $(".loading").show();

        //prepare data
        var theinput = $("#theform").serialize();

        $.ajax({
            url: "/calculators/taxbenefits.aspx",
            type: "POST",
            data: theinput,
            dataType: "json",
            success: function(data) {

                var output = "<p>Maaşınıza göre elde edeceğiniz avantajlar aşağıdaki gibidir.</p>";
                //$(output).find("table").empty();
                $(resultwindow).show();
                output += "<table>";
                //$(output).append('<table>');
                $.each(data.results, function() {
                    output += '<tr><th scope="row">' + this.result[0] + '</th><td>' + this.result[1] + '</td></tr>';
                    //$(".result").slideDown().find("p").fadeIn();
                });
                output += "</table>";
                $(resultwindow).append(output);
                //$(output).append('</table>');
                $(".loading").fadeOut();
            }
        });
    });
});