时间戳

首页 > 解决方案 > HTML/AngularJS - 如何使这个名字、姓氏和电子邮件可编辑？

html - HTML/AngularJS - 如何使这个名字、姓氏和电子邮件可编辑？

问题描述

这是我们使用的电子商务网站的代码片段，我无法访问 JS，只有 HTML 和 CSS。大多数字段需要只读，因此只能从通讯录中更新。但是所有字段都在几行中，下面的第 4 行包含除国家和州之外的所有内容。有什么办法可以只使该行中的某些字段准备好？特别是除了名字和姓氏以及电子邮件之外的所有内容。

先感谢您。

编辑：我还应该补充一点，AngularJS 让我头疼并提高了我的血压，所以如果答案涉及指令或一些疯狂的角度的东西，请很好。

<div class="row-fluid" ng-repeat="field in delivery.RecipientsFields" 
     ng-hide="delivery.HideForDeliveryMethod() == 'true'">
    <div ng-class="{true : 'span8', false : 'span4'}[['AddressLine1', 'AddressLine2', 'AddressLine3','Email','PhoneNumber1'].indexOf(field._ServerTag) != -1]" 
         ng-show="field._Visible == 'true' || (field._ServerTag == 'RoomNumber' && delivery.showRoomNumberFieldForDeliveryMethod())">
        <label for="" ng-class="getRequiredClass(field._Required)" 
               ng-if="field._ServerTag != 'VATNumber' && field._ServerTag != 'RoomNumber'">{{field._DisplayName}}:</label>
        <!-- <label ng-show="field._Required">*</label> -->
        <input id="txt{{field._ServerTag + delivery.OrderAddressId}}"
               ng-if="field._ServerTag != 'VATNumber' && field._ServerTag != 'State_Province_Region' && field._ServerTag != 'Country' && field._ServerTag != 'RoomNumber'" 
               ng-model="field._FieldValue" type="text" name="" id="" placeholder="" class="span12" 
               value="{{field._FieldValue}}"
               ng-validate="{{field.Validate}}"
               ng-disabled="(delivery.DisableDeliveryAddressEdit_current && !IsRecipientFromAddressBook) || (delivery.DisableDeliveryAddressEdit_current && IsRecipientFromAddressBook && (!delivery.EnableChangingPersonNameOfaLockedAddress || (field._ServerTag != 'Email' && field._ServerTag != 'FirstName' && field._ServerTag != 'LastName' && field._ServerTag != 'MiddleName'))) || (delivery.useDedicatedAddressBook() && field._ServerTag != 'Email' && field._ServerTag != 'FirstName' && field._ServerTag != 'LastName' && field._ServerTag != 'MiddleName' && field._ServerTag != 'PhoneNumber1')" 
               maxlength="{{field._MaxCharacterLength}}" 
               readonly />

        <input id="txt{{field._ServerTag + delivery.OrderAddressId}}" 
               ng-if="field._ServerTag == 'State_Province_Region'"
               ng-hide="delivery.RecipientCountry.length && (field._DataSource | filter : {_OtherDataSourceKeys : delivery.RecipientCountry}).length" 
               ng-model="delivery.RecipientState_Province_Region" type="text" name="" id="" placeholder="" class="span12" 
               value="{{field._FieldValue}}" 
               ng-validate="{{field.Validate}}" 
               ng-disabled="delivery.DisableDeliveryAddressEdit_current || delivery.useDedicatedAddressBook()" 
               maxlength="{{field._MaxCharacterLength}}" 
               readonly />
        <select id="ddl{{field._ServerTag + delivery.OrderAddressId}}" 
                ng-if="field._ServerTag == 'Country'" 
                ng-model="delivery.RecipientCountry" 
                ng-options="option._Key as option._DisplayValue for option in field._DataSource" class="span12" 
                ng-change="CountryChanged(delivery)" 
                ng-disabled="delivery.DisableDeliveryAddressEdit_current || delivery.useDedicatedAddressBook()" 
                readonly >
        </select>
        <select id="ddl{{field._ServerTag + delivery.OrderAddressId}}" 
                ng-if="field._ServerTag == 'State_Province_Region'" 
                ng-show="delivery.RecipientCountry.length && (field._DataSource | filter : {_OtherDataSourceKeys : delivery.RecipientCountry}).length" 
                ng-model="delivery.RecipientState_Province_Region" 
                ng-options="option._Key as option._DisplayValue for option in field._DataSource | filter : {_OtherDataSourceKeys : delivery.RecipientCountry}" 
                class="span12" 
                ng-disabled="delivery.DisableDeliveryAddressEdit_current || delivery.useDedicatedAddressBook()" 
                ng-validate="{{field.Validate}}" 
                readonly >
         </select>
                    
        <label for="" ng-class="getRequiredClass(true)" ng-if="field._ServerTag == 'RoomNumber' && (field._Visible == 'true' || delivery.showRoomNumberFieldForDeliveryMethod())">{{field._DisplayName}}:</label>
        <input id="txt{{field._ServerTag + delivery.OrderAddressId}}" 
               ng-if="field._ServerTag == 'RoomNumber' && (field._Visible == 'true' || delivery.showRoomNumberFieldForDeliveryMethod())" 
               ng-model="field._FieldValue" type="text" 
               name="" placeholder="" class="span12" 
               value="{{field._FieldValue}}" 
               ng-validate="{{field.Validate}}"
               maxlength="{{field._MaxCharacterLength}}" />
    </div>
</div>

有问题的字段

标签： htmlcssangularjs

解决方案

该<select>元素不支持该readonly属性。相反，请使用元素的disabled属性。<select>

有关详细信息，请参阅

推荐阅读