Cara mengatur nilai input teks menggunakan jQuery

Saya memiliki teks input yang ini:

<div class="editor-label">
    @Html.LabelFor(model => model.EmployeeId, "Employee Number")
</div>

<div class="editor-field textBoxEmployeeNumber">
    @Html.EditorFor(model => model.EmployeeId) 
    @Html.ValidationMessageFor(model => model.EmployeeId)
</div>

Yang menghasilkan html berikut

<div class="editor-label">
  <label for="EmployeeId">Employee Number</label>
</div>

<div class="editor-field textBoxEmployeeNumber">
  <input class="text-box single-line" data-val="true" data-val-number="The field EmployeeId must be a number." data-val-required="The EmployeeId field is required." id="EmployeeId" name="EmployeeId" type="text" value="" />

  <span class="field-validation-valid" data-valmsg-for="EmployeeId" data-valmsg-replace="true"></span>
</div>

Saya ingin mengatur nilai input teks ini menggunakan jquery jadi saya melakukan ini:

<script type="text/javascript" language="javascript">
    $(function() {
        $('.textBoxEmployeeNumber').val("fgg");
    });
</script> 

namun, itu tidak berfungsi ... apa kesalahan di sintaksis saya?

Pemilih Anda sedang mengambil kotak teks di sekitarnya <div class='textBoxEmployeeNumber'>daripada input di dalamnya.

// Access the input inside the div with this selector:
$(function () {
  $('.textBoxEmployeeNumber input').val("fgg");
});

Perbarui setelah melihat HTML keluaran

Jika kode ASP.NET secara andal menampilkan HTML <input>dengan atribut id id='EmployeeId', Anda dapat lebih mudah menggunakan:

$(function () {
  $('#EmployeeId').val("fgg");
});

Gagal ini, Anda harus memverifikasi di konsol kesalahan browser Anda bahwa Anda tidak memiliki kesalahan skrip lain yang menyebabkan ini gagal. Contoh pertama di atas berfungsi dengan benar dalam demonstrasi ini.

Menggunakan jQuery, kita dapat menggunakan kode berikut:

Pilih dengan nama input:

$('input[name="textboxname"]').val('some value')

Pilih dengan kelas input:

$('input[type=text].textboxclass').val('some value')

Pilih dengan id masukan:

$('#textboxid').val('some value')

$(document).ready(function () {
    $('#EmployeeId').val("fgg");

    //Or
    $('.textBoxEmployeeNumber > input').val("fgg");

    //Or
    $('.textBoxEmployeeNumber').find('input').val("fgg");
});

Untuk elemen dengan id

<input id="id_input_text16" type="text" placeholder="Ender Data"></input>

Anda dapat menetapkan nilai sebagai

$("#id_input_text16").val("testValue");

Dokumentasi di sini .

ini untuk kelas

$('.nameofdiv').val('we are developers');

untuk id

$('#nameofdiv').val('we are developers');

sekarang jika Anda memiliki iput dalam bentuk yang dapat Anda gunakan

$("#form li.name input.name_val").val('we are awsome developers');

Berikut adalah variasi lain untuk unggahan file yang memiliki tombol bootstrap yang lebih bagus daripada tombol telusuri unggah file default. Ini adalah html:

<div class="form-group">
        @Html.LabelFor(model => model.FileName, htmlAttributes: new { @class = "col-md-2  control-label" })
        <div class="col-md-1 btn btn-sn btn-primary" id="browseButton" onclick="$(this).parent().find('input[type=file]').click();">browse</div>
        <div class="col-md-7">
            <input id="fileSpace" name="uploaded_file"  type="file" style="display: none;">   @*style="display: none;"*@
            @Html.EditorFor(model => model.FileName, new { htmlAttributes = new { @class = "form-control", @id = "modelField"} })
            @Html.ValidationMessageFor(model => model.FileName, "", new { @class = "text-danger" })
        </div>
    </div>

Ini skripnya:

        $('#fileSpace').on("change", function () {
        $("#modelField").val($('input[name="uploaded_file"]').val());

Dalam js murni itu akan lebih sederhana

EmployeeId.value = 'fgg';

EmployeeId.value = 'fgg';

<div class="editor-label">
  <label for="EmployeeId">Employee Number</label>
</div>

<div class="editor-field textBoxEmployeeNumber">
  <input class="text-box single-line" data-val="true" data-val-number="The field EmployeeId must be a number." data-val-required="The EmployeeId field is required." id="EmployeeId" name="EmployeeId" type="text" value="" />
  
  <span class="field-validation-valid" data-valmsg-for="EmployeeId" data-valmsg-replace="true"></span>
</div>