複製文本框的值到另一個 - ASP.NET MVC剃刀

我有一個ASP.NET MVC 5應用程序複製文本框的值到另一個 - ASP.NET MVC剃刀

@model ProjectOasis.Models.RegisterViewModel 
@{ 
    ViewBag.Title = "Register"; 
} 

<h2>@ViewBag.Title.</h2> 

@using (Html.BeginForm("Admin", "Account", FormMethod.Post, new { @class = "form-horizontal", role = "form" })) 
{ 
    @Html.AntiForgeryToken() 
    <h4>Create a new account.</h4> 
    <hr /> 
    @Html.ValidationSummary("", new { @class = "text-danger" }) 
    <div class="form-group"> 
     @Html.LabelFor(m => m.Email, new { @class = "col-md-2 control-label"}) 
     <div class="col-md-10"> 
      @Html.TextBoxFor(m => m.Email, new { @class = "form-control" }) 
     </div> 
    </div> 
    <div class="form-group"> 
     @Html.LabelFor(m => m.UserName, new { @class = "col-md-2 control-label"}) 
     <div class="col-md-10"> 
      @Html.TextBoxFor(m => m.UserName, new { @class = "form-control" }) 
     </div> 
    </div> 
    //more form stuff 
    <div class="form-group"> 
     <div class="col-md-offset-2 col-md-10"> 
      <input type="submit" class="btn btn-default" value="Create" /> 
     </div> 
    </div> 
} 

@section Scripts { 
    @Scripts.Render("~/bundles/jqueryval") 
}

如何讓這個無論何時進入m的範圍內以下表格。電子郵件的文本框，該值立即複製到m.UserName文本框？（我將這個工作後，使UserName文本框不可編輯）。

謝謝。

來源

2014-09-28 mansonitefirefox

你將不得不通過JavaScript來做到這一點。 – 2014-09-28 06:43:57

由於貝爾巴托夫提到你需要使用Javascript/jQuery來做到這一點，但什麼點 - 只複製值服務器端，當你發佈形式 – 2014-09-28 06:50:43

因爲我特別希望用戶看到他們的登錄名=電子郵件地址。 – mansonitefirefox 2014-09-28 06:56:27

所以，如果你想只顯示用戶名，這裏有一個例子（香草JS），是這樣的：

document.getElementById("txt2").onkeyup = function() { 
 
    document.getElementById("txt1").value = this.value; 
 
};

<input type="text" id="txt1" disabled /> 
 
<input type="text" id="txt2" />

或這裏是jQuery的版本：

$("#txt2").on("keyup", function() { 
 
    $("#txt1").val($(this).val()); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" id="txt1" disabled /> 
 
<input type="text" id="txt2" />

我希望這有助於。

來源

2014-09-28 06:55:02

我如何將它放入上面顯示的Razor視圖引擎示例中？ – mansonitefirefox 2014-09-28 07:02:32

@mansonitefirefox那麼你會將它包含在你的腳本包（也許在一個單獨的'.js'文件中）。如果你不知道如何在你的視圖中包含javascript，恐怕這可能會有點寬泛。我可以寫一些關於它的知識（當我有空閒的時候）。 – 2014-09-28 07:03:55

使用JavaScript。可能你已經在你的站點腳本中包含了jQuery。所以，你所要做的就是添加下面的腳本：

$(function(){ 
    $("#Email").change(function(){ 
     $("#UserName").val($(this).val()); 
    }); 
})

請確保有關函套，因爲我不知道，如果剃刀camelifies名稱或不 - 在您的瀏覽器只是預覽HTML源代碼，並檢查字段名拼寫。

這裏是some working sample你

來源

2014-09-28 07:08:57 cyberhubert

選項1

$("#Email").change(function(){ 
     $("#UserName").val($(this).val()); 
});

選項2

$("#Email").focusout(function(){ 
     $("#UserName").val($(this).val()); 
});

，並執行到使用電子郵件作爲用戶名，這個在您的用戶名文本框：

@Html.TextBoxFor(m => m.UserName, new { @class = "form-control", @disabled = "disabled" }

來源

2014-10-09 04:52:09

複製文本框的值到另一個 - ASP.NET MVC剃刀

回答

相關問題