CODEWITHSUNDEEP
phpmysqlajaxjson
Al Hennessey
Al Hennessey

Reputation: 2445

Running onchange ajax when window is first loaded

i have this ajax setup that performs some php calculations when a user changes the selection of a dropdown, it then sends back the results and outputs them. This all works fine except, when the user first loads the screen they are greeted, with just empty result boxes, and only when they change a selection in one of the dropdown boxes, do the results appear. My question is, is there anyway to run the ajax when the window is loaded, so the default dropdown selection can be ouputed.

Here is the ajax code, let me know if you need anything else:

  <script>
$("document").ready(function (){ 

    $(".add_detail_dropdown").change(function(){


        var m = document.getElementById('meter_square');
        var meter_square = m.options[m.selectedIndex].value;

        var s = document.getElementById('story_height');
        var story_height = s.options[s.selectedIndex].value;

        var r = document.getElementById('roof_type');
        var roof_type = r.options[r.selectedIndex].value;

        var q = document.getElementById('material_quality');
        var material_quality = q.options[q.selectedIndex].value;

        var w = document.getElementById('wall_type');
        var wall_type = w.options[w.selectedIndex].value;

        var f = document.getElementById('flooring');
        var flooring = f.options[f.selectedIndex].value;

     $.ajax({
            type: "GET",
            url: "add_extension_calc.php",
            data: { meter_square: meter_square, story_height: story_height, roof_type: roof_type, material_quality: material_quality, wall_type: wall_type, flooring: flooring, estimated_wealth: <?php print "$estimated_wealth";?>, gain_percent: <?php print "$addon_gain_percent";?>  },
            dataType: "json",
            statusCode: {
                200: function (response) {
                                            $("#res_expected_gain").html(response.total_gain);
                                            $("#res_expected_house_price").html(response.house_price);
                                            $("#res_total_supply_cost").html(response.store_price);
                                            $("#res_total_supply_time").html(response.store_time);
                                            $("#res_expected_profit").html(response.expected_profit);
                                         }

            }
        });
})
});
</script>

Upvotes: 0

Views: 263

Answers (1)

Mihai Iorga
Mihai Iorga

Reputation: 39704

simply use change(), it will trigger your change ..

<script>
    $("document").ready(function (){ 

        $(".add_detail_dropdown").change(function(){
            // ............
        });

        $(".add_detail_dropdown").change();
    });
</script>

Upvotes: 2

Related Questions