Watin。如何顯示invinsible類

Question

HTML代碼：

<div class="col-sm-9"> 
<input name="NewCardOrAccountNumber" class="form-control ui-autocomplete-input" id="NewCardOrAccountNumber" type="text" value="" autocomplete="off"> 
<span class="ui-helper-hidden-accessible" role="status" aria-live="polite"></span> 
</div> 
<div class="unvisible" id="clientInfoNew"> 

         <div class="form-group"> 
          <label class="col-sm-3 control-label">FIRST NAME</label> 
          <div class="col-sm-9" id="FnameNew"></div> 
         </div> 

         <div class="form-group"> 
          <label class="col-sm-3 control-label">LAST NAME</label> 
          <div class="col-sm-9" id="LnameNew"></div> 
         </div> 

         <div class="form-group"> 
          <label class="col-sm-3 control-label">BIRTH DATE</label> 
          <div class="col-sm-9" id="BirthDateNew"></div> 
         </div> 

華廷代碼：

[TestMethod] 
    [TestCategory("Rimi Change card page")] 

    public void Rimi_4444_Change_Card_and_Assert() 
    { 

     //Web Address 
     using (IE ie = new IE(this.Rimi)) 
     { 
      //IE ie = new IE(RimiChangeCard); 
      ie.BringToFront(); 
      ie.ShowWindow(WatiN.Core.Native.Windows.NativeMethods.WindowShowStyle.Maximize); 
      ie.TextField(Find.ById("NewCardOrAccountNumber")).TypeText("9440385200600000020"); 

如果我寫從鍵盤卡號，隱形類出現，你可以看到名字，姓氏和等等。但是，如果我使用watin進行此操作，它不會出現，並且您只能看到您輸入的卡號。它就像隱藏的信息領域。我不知道如何讓我在輸入卡號時能看到這個字段。

Answer 1

將會有一個JavaScript函數，當您在文本字段中手動輸入數據時，該函數會被執行。通過使用ID NewCardOrAccountNumber引用該元素的同一頁面上的Java Script函數。

請參考this鏈接進行示例應用。其中msg_to是元素，並且具有關聯的KeyUp事件。當該字段值爲,時，有一個div部分，其中顯示「Subject」字段。

同樣，在執行TypeText之後，嘗試使用Java腳本執行來觸發Java腳本事件中提到的相關事件。

編輯：我看到JavaScript函數在觸發bulr事件後執行。這意味着文本框字段應該放棄焦點。嘗試下面的選項。

// 1. Try focusing out of control. 
ie.TextField(Find.ById("NewCardOrAccountNumber")).TypeText("9440385200600000020"); 
ie.TextField(Find.ById("OldCardOrAccountNumber")).Click(); 
ie.WaitForComplete(); 

// 2. Try Using Send Keys method to tab out. 
ie.TextField(Find.ById("NewCardOrAccountNumber")).TypeText("9440385200600000020"); 
System.Windows.Forms.SendKeys.SnedWait("{TAB}"); // Need to add System.Windows.Forms reference to the project. 

Answer 2

我把圖像在互聯網上，所以點擊這個鏈接Image上，你會看到第一個圖像上怎麼看頁，第二張照片 - 有什麼事會發生，當你輸入卡號（從鍵盤），第三 - 當watin輸入卡片namuber時會發生什麼（不會出現關於卡片的信息）。

HTML代碼：

<div class="ibox-content"> 
     <br> 
     <div class="form-horizontal"> 
      <div class="row"> 
       <div class="col-md-5"> 

        <div class="form-group"> 
         <label class="col-sm-3 control-label">NEW CARD</label> 
         <input name="NewCardId" id="NewCardId" type="hidden" value="0" data-val-required="The NewCardId field is required." data-val-number="The field NewCardId must be a number." data-val="true"> 
         <div class="col-sm-9"><span class="ui-helper-hidden-accessible" role="status" aria-live="polite"></span><input name="NewCardOrAccountNumber" class="form-control ui-autocomplete-input" id="NewCardOrAccountNumber" type="text" value="" autocomplete="off"></div> 
        </div> 

        <div class="unvisible" id="clientInfoNew"> 

         <div class="form-group"> 
          <label class="col-sm-3 control-label">FIRST NAME</label> 

我也許找到你要找的假，但我不知道如何使用它：

<script type="text/javascript"> 

    $(document).ready(function() { 

     var NewCardId = "#NewCardId"; 
     var OldCardId = "#OldCardId"; 
     var NewCardNumber = "#NewCardOrAccountNumber"; 
     var OldCardNumber = "#OldCardOrAccountNumber"; 



     $(NewCardNumber).autocomplete(
     { 
      source: function(request, response) { 

       $.ajax({ 
        url: '/LoyaltyWebApplication/Suggestion/GetCardSuggestions', 
        dataType: "json", 
        data: { 
         str: $(NewCardNumber).val() 
        }, 
        success: function(data) { 
         response($.map(data, function(item) { 
          var label = ""; 
          if (item.Fname != null) label += item.Fname; 
          if (item.Lname != null) label += " " + item.Lname; 
          if (label.trim() != '') label = " (" + label.trim() + ")"; 
          return { 
           value: item.CardNumber, 
           label: item.CardNumber + label 
          } 
         })); 
        }, 
        error: function(xhr, ajaxOptions, thrownError) { 
         alert(xhr.status); 
         alert(thrownError); 
        } 
       }); 
      }, 
      select: function(event, ui) { 
       getCardDetails($(NewCardNumber), $(NewCardId), 'newCardSegments', true); 
       $("#newCardSegments").hide(); 
       $("#clientInfoNew").show(); 
      }, 
      minLength: 2 
     }).blur(function() { 
      getCardDetails($(NewCardNumber), $(NewCardId), 'newCardSegments', true); 
     }); 

     $(OldCardNumber).autocomplete(
     { 
      source: function(request, response) { 
       $.ajax({ 
        url: '/LoyaltyWebApplication/Suggestion/GetCardSuggestions', 
        dataType: "json", 
        data: { 
         str: $(OldCardNumber).val() 
        }, 
        success: function(data) { 
         response($.map(data, function(item) { 
          var label = ""; 
          if (item.Fname != null) label += item.Fname; 
          if (item.Lname != null) label += " " + item.Lname; 
          if (label.trim() != '') label = " (" + label.trim() + ")"; 
          return { 
           value: item.CardNumber, 
           label: item.CardNumber + label 
          } 
         })); 
        }, 
        error: function(xhr, ajaxOptions, thrownError) { 
         alert(xhr.status); 
         alert(thrownError); 
        } 
       }); 
      }, 
      select: function(event, ui) { 
       getCardDetails($(OldCardNumber), $(OldCardId), 'oldCardSegments', false); 
       $("#oldCardSegments").hide(); 
      }, 
      minLength: 2 
     }).blur(function() { 
      getCardDetails($(OldCardNumber), $(OldCardId), 'oldCardSegments', false); 
     }); 

     function getCardDetails(cardNumHolder, cardIdHolder, segmentTablePlace, isNew) { 
      $.getJSON('/LoyaltyWebApplication/LOV/SetId?lovType=ReplacementLOV&lovValue=' + cardNumHolder.val(), null, 
       function(data) { 
        $("#clientInfo" + ((isNew) ? "New" : "Old")).show(); 
        if (cardNumHolder.val() == '') { 
         return; 
        } 
        var i; 
        for (i = 0; i < data.otherNames.length; i++) { 
         $("#" + data.otherValues[i] + (isNew ? "New" : "Old")).text(data.otherNames[i]); 
        } 
        cardIdHolder.val(data.Id); 
        $.getJSON('/LoyaltyWebApplication/Replacement/ClientSegmentsList?clientId=' + data.Id + "&no_cache=" + Math.random, function(data) { 
         $("#" + segmentTablePlace).find('tbody').empty(); 
         if (data.length > 0) { 
          $.each(data, function(index) { 
           $("#" + segmentTablePlace).find('tbody').append("<tr><td>" + data[index].SegmentCode + "</td><td>" + data[index].SegmentName + "</td></tr>"); 
          }); 
          $("#" + segmentTablePlace).show(); 
         } 
        }); 
       }); 
     } 

     $("#resetVal").click(function() { 

      $("#NewCardOrAccountNumber").attr("value", ""); 
      $("#NewCardOrAccountNumber").val(""); 

      $("#NewCardId").attr("value", ""); 
      $("#NewCardId").val(""); 

      $("#clientInfoNew").hide(); 

      $("#OldCardOrAccountNumber").attr("value", ""); 
      $("#OldCardOrAccountNumber").val(""); 

      $("#OldCardId").attr("value", ""); 
      $("#OldCardId").val(""); 

      $("#clientInfoOld").hide(); 

      return false; 

     }); 

    }); 
</script>