2016-11-08 18 views
0

我有以下ASP.Net WebForm Address字段是必填字段。 Address字段通過jQuery填充Location字段的值。ASP.NET Web窗體 - 當通過jquery填充字段時客戶端驗證不工作?

當我點擊提交而沒有填寫任何字段時,客戶端驗證會觸發,我們會在Address控件的下方顯示錯誤消息。

如果我現在在Location字段中輸入一個值,那麼jQuery會觸發並且Address字段會填充一個值,但以前的錯誤消息不會清除 - 僅在手動輸入值時纔會清除它?

<div> 
    <label>Location</label> 
    <asp:TextBox ID="Location" runat="server" CssClass="form-control" ClientIDMode="Static" placeholder="Enter location"></asp:TextBox> 
</div> 
<div> 
    <label >Address</label> 
    <asp:TextBox ID="Address" runat="server" CssClass="form-control" ClientIDMode="Static" placeholder="Enter the address"></asp:TextBox> 
    <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ErrorMessage="Address is Required" Display="Dynamic" ControlToValidate="Address" CssClass="field-validation-error" EnableClientScript="True"></asp:RequiredFieldValidator> 
</div> 
<asp:Button ID="Submit" runat="server" Text="Save" OnClick="btnSubmit_Click" CssClass="btn btn-primary" /> 

<script> 
    $("#Location").on('change', function (e) { 
     var location = $("#Location").val(); 
     $("#Address").val(location); 
    }); 
</script> 

如何可以解決這個問題,這樣,如果被顯示的控制之下的客戶端錯誤,即它清除錯誤消息,如果驗證邏輯通過jQuery fullfilled如在上面的例子?

+0

經過assigne地址刪除這樣的錯誤標籤應該爲你工作。 '$(「#Address」)。next('label')。remove();' –

+0

@Shree爲什麼我會刪除標籤? asp.net webforms生成的標記是: Address is Required'。另外,如果我有十幾個以這種方式預先填充的字段,那麼這不是一個乾淨的解決方法。 – adam78

回答

0

當您手動在Address輸入輸入值,當輸入失去焦點或按下進入change事件被觸發。這在使用jQuery val()方法時不會發生。

得到它的工作,你有兩個選擇,要麼手動觸發change事件:

選項1:jQuery的解決方案觸發更改事件

$("#Location").on('change', function (e) { 
    var location = $("#Location").val(); 
    $("#Address").val(location).trigger("change"); 
}); 

或者你也可以手動調用Web表單直接驗證方法。這有點危險,因爲不能保證這些方法將來不會改變,但是我已經將它包括在內以便完整,因爲它在某些情況下可能有用。

選項2:調用Web表單驗證方法觸發重新確認

$("#Location").on('change', function (e) { 
    var location = $("#Location").val(); 
    $("#Address").val(location); 
    if (typeof (Page_ClientValidate) == 'function') { 
     Page_ClientValidate(); 
    } 
}); 

我選擇了Page_ClientValidate方法在這裏將重新驗證這裏不提供針對給定的驗證組的驗證組的所有驗證程序(因爲它是不適用)。這是更簡單和更安全的方法之一,在更復雜的情況下,您可能需要ValidatorValidate()或WebUIValidation.js中的其他方法之一。很高興在這方面進行擴展,但我認爲這超出了問題的範圍。

我更喜歡選項1,因爲它更簡單,並且對未來Webforms更改打開的影響更小。希望有所幫助。

0
$("#Location").on('change', function (e) { 
     var location = $("#Location").val(); 
     $("#Address").val(location); 
$("#Form id").data('validator').resetForm(); 
    }); 

試試這個,它會工作