2013-11-22 3 views
0

Я использую jquery в ASP.NET MVC 4. У меня есть текстовое поле с id = 'ContactID', которое имеет событие изменения. Когда «ContactID» изменяется, значение в текстовом поле используется в вызове ajax, который ведет переговоры с базой данных и возвращает результат JSON, который затем я использую для заполнения других текстовых полей на странице. С этого момента есть определенные поля, которые, как мне кажется, должны быть либо в режиме «только для чтения», либо нет, если JsonResult заполняет текстовое поле; это значит, что пользователь может вводить значения в эти текстовые поля, если они пусты. Если текстовое поле было заполнено, сделайте текстовое поле только для чтения, иначе сделайте текстовое поле неточным. Это отлично работает, но когда пользователь отправляет форму, все значения на странице становятся снова редактируемыми. Это поведение, которое я не хочу.JQuery: вызов функции изменения при загрузке документа

Мой вопрос: есть ли способ вызвать функцию 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

Есть синтаксические ошибки, код за пределами готовой функции DOM, которая должна, вероятно, внутри него, недостающие кавычки и т.д. Закрепить очевидно первый, и вы будете лучше изменить работу, просто откройте консоль в своем браузере, и вы увидите все ошибки. – adeneo

+0

Мне любопытно открыть консоль разработчика в браузере. Я видел, как люди использовали его, но я никогда не знал, как его открыть. Вы знаете, как я могу это сделать на IE10? –

+0

Конечно, в IE10 вы переходите на страницы загрузки Chrome и загружаете браузер Chrome. – adeneo

ответ

2

Вы можете просто позвонить .change(), который инициирует зарегистрированные обработчики событий изменения. Но убедитесь, что событие срабатывает после того, как желательные обработчики регистрируются

$('#ContactID').change() 
+0

Это решило. Я буду отмечать это как ответ, когда истечет срок ответа. Большое спасибо! –

Смежные вопросы