Jquery:在文档加载时调用更改函数

时间:2013-11-22 15:31:05

标签: jquery ajax asp.net-mvc-4

我在ASP.NET MVC 4中使用jquery。我有一个id ='ContactID'的文本框,它有一个change事件。当'ContactID'发生更改时,文本框中的值将用于与数据库对话并返回JSON结果的ajax调用,然后我将使用该结果填充页面上的其他文本框。从那时起,如果JsonResult填充了文本框,我需要某些字段是readonly还是不依赖;这样,如果这些文本框为空,则用户可以将值输入到这些文本框中。如果填充了文本框,请使文本框只读,否则使文本框不是只读。这很好用,但是当用户提交表单时,页面上的所有值都会再次变为可编辑状态。这是我不想要的行为。

我的问题是:有没有办法在页面加载时调用我的ContactID.change函数,但只有当ContactID不为空时?

    $(document).ready(function () {
    $("form :input:enabled:visible:first").focus();
    $("form :input:enabled:visible:first").select();
    $(".input-validation-error").first().focus();
    $(".input-validation-error").first().select();

    //I want to check to see if the ContactID textbox is populated when the document is ready
      //If ContactID is populated, I want the ContactID.change function to run
});

$('#ContactID).change(function () {
    var contactIDValue = $('#ContactID).val();

    if (contactIDValue.length != 0) { 
        //ContactID is populated; attempt to get Contact information

        //these fields should never be modified if using a ContactID
        $('#ContactStreet2').attr('readonly', true);
        $('#Contact2Name').attr('readonly', true);
        $('#Contact1Phone').attr('readonly', true);
        $('#Contact2Phone').attr('readonly', true);
        $('#Contact1Fax').attr('readonly', true);
        $('#Contact2Fax').attr('readonly', true);
        $('#Contact1Email').attr('readonly', true);
        $('#Contact2Email').attr('readonly', true);

        $.ajax({
            url: '@Url.Action("GetContactInformationFromContactID", "RelevantController")',
            type: 'POST',
            data: { ContactIDValue : contactIDValue },
            success: function (contact) {

                //set all text boxes to the contact's information
                $('#ContactStreet1').val(contact.STREET1);
                $('#ContactStreet2').val(contact.STREET2);
                $('#ContactCity').val(contact.CITY);
                $('#ContactState').val(contact.STATE);
                $('#ContactZip').val(contact.ZIP);
                $('#ContactCountry').val(contact.POINTID);
                $('#Contact1Name').val(contact.CONTACT1NAME);
                $('#Contact2Name').val(contact.CONTACT2NAME);
                $('#Contact1Phone').val(contact.CONTACT1PHONE);
                $('#Contact2Phone').val(contact.CONTACT2PHONE);
                $('#Contact1Fax').val(contact.CONTACT1FAX);
                $('#Contact2Fax').val(contact.CONTACT2FAX);
                $('#Contact1Email').val(contact.CONTACT1EMAIL);
                $('#Contact2Email').val(contact.CONTACT2EMAIL);

                //disable or enable based on whether the field is populated
                if (contact.STREET1 != null && contact.STREET1.length > 0) {
                    $('#ContactStreet1').attr('readonly', true);
                }
                else {
                    $('#ContactStreet1').attr('readonly', false);
                }

                if (contact.CITY != null && contact.CITY.length > 0) {
                    $('#ContactCity').attr('readonly', true);
                }
                else {
                    $('#ContactCity').attr('readonly', false);
                }

                if (contact.STATE != null && contact.STATE.length > 0) {
                    $('#ContactState').attr('readonly', true);
                }
                else {
                    $('#ContactState').attr('readonly', false);
                }

                if (contact.ZIP != null && contact.ZIP.length > 0) {
                    $('#ContactZip').attr('readonly', true);
                }
                else {
                    $('#ContactZip').attr('readonly', false);
                }

                if (contact.POINTID != null && contact.POINTID.length > 0) {
                    $('#ContactCountry').attr('readonly', true);
                }
                else {
                    $('#ContactCountry').attr('readonly', false);
                }

                if (contact.CONTACT1NAME != null && contact.CONTACT1NAME.length > 0) {
                    $('#Contact1Name').attr('readonly', true);
                }
                else {
                    $('#Contact1Name').attr('readonly', false);
                }
            }
        });
    }
    else {
        //ContactID is not populated; enable all Text boxes
        $('#ContactStreet1').val(''); $('#ContactStreet1').attr('readonly', false);
        $('#ContactStreet2').val(''); $('#ContactStreet2').attr('readonly', false);
        $('#ContactCity').val(''); $('#ContactCity').attr('readonly', false);
        $('#ContactState').val(''); $('#ContactState').attr('readonly', false);
        $('#ContactZip').val(''); $('#ContactZip').attr('readonly', false);
        $('#ContactCountry').val(''); $('#ContactCountry').attr('readonly', false);
        $('#Contact1Name').val(''); $('#Contact1Name').attr('readonly', false);
        $('#Contact2Name').val(''); $('#Contact2Name').attr('readonly', false);
        $('#Contact1Phone').val(''); $('#Contact1Phone').attr('readonly', false);
        $('#Contact2Phone').val(''); $('#Contact2Phone').attr('readonly', false);
        $('#Contact1Fax').val(''); $('#Contact1Fax').attr('readonly', false);
        $('#Contact2Fax').val(''); $('#Contact2Fax').attr('readonly', false);
        $('#Contact1Email').val(''); $('#Contact1Email').attr('readonly', false);
        $('#Contact2Email').val(''); $('#Contact2Email').attr('readonly', false);
    }
});

我认为我能做到这一点的一种方法是做这样的事情:

    $(document).ready(function () {
        $("form :input:enabled:visible:first").focus();
        $("form :input:enabled:visible:first").select();
        $(".input-validation-error").first().focus();
        $(".input-validation-error").first().select();

        var contactIDValue = $('#ContactID).val();

        if (contactIDValue.length != 0) {
             //a lot of failure on my part going on here -_-
        }
    });

但我无法找到任何说明如何调用我想要的更改功能的地方。谁知道我怎么做到这一点?无论多小,都会非常感谢所有帮助!

1 个答案:

答案 0 :(得分:2)

您只需调用.change()即可触发注册的更改事件处理程序。但请确保在注册所需的处理程序后触发事件

$('#ContactID').change()