Asp.net MVC jquery - how do I run a script automatically on page load

Question

I have looked at various strategies for this and the one I did try fails (.load) below..

I am hiding a couple of textboxes and their labels when my page loads by default.

however if the viewmodel represents a company - company="true" then I want those textboxes to show and some of the labels to change for the fact this is a company record rather than a private client record.

I used this for essentially the same page when I am creating a client:

    $(document).ready(function () {
    if ($('#Company').length)         // Check for ID
    {
        $(window).load(function () {
            $("#Company").click(function () {
                if ($(this).is(':checked')) {
                    $("#FirstNameLabel").html('Contact First Name:');
                    $("#LastNameLabel").html('Contact Last Name:');
                    $("#phoneLabel").html('Company Phone:');
                    $("#details").html('<strong>Company Details</strong>');
                    $("#bankDetails").html('<strong>Company Bank Details</strong>');
                    $("#hideOption").removeAttr("hidden");
                } else {
                    $("#FirstNameLabel").html('First Name:');
                    $("#LastNameLabel").html('Last Name:');
                    $("#phoneLabel").html('Home Phone:');
                    $("#details").html('<strong>Client Personal Details</strong>');
                    $("#bankDetails").html('<strong>Client Bank Details</strong>');
                    $("#hideOption").attr("hidden", "hidden");
                }
            });
        });
    };
});

So, click the Company checkbox and a number of labels change and those two textboxes show. Click it again and they revert. That's fine when you starting with a blank page but this is the edit page and I am preloading the data. In the case of a company I need the textboxes to show and the labels to be changed..

As you might have noticed I have tried to use $(window).load however its not working.

Further, this code is in the site.js file under wwwroot and not on the page so I have used $('#Company').length) to check if the id exists first...

How do I run this script on the page when it loads?

It should run and if the company checkbox is checked show the textboxes and change the labels.

Answer 1

You can put a class name in your check-box control, and you can use the following change function, also you can apply your code-set inside that checking(if-else).

<input type="checkbox" class="className" name="Country" value="Country"> Country<br>

    $(".className").change(function () {
            if (this.checked) {
    //Put your code here
    }
    else{
    //Put your code here
    }

    });

Hope your issue will solve by this code :-)