JQuery का उपयोग करके इनपुट टेक्स्ट का मान कैसे सेट करें

Question

मेरे पास एक इनपुट टेक्स्ट है जो यह है:

<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>

जो html का उत्पादन करता है

<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>

मैं jquery का उपयोग करके इस इनपुट पाठ का मान सेट करना चाहता हूं इसलिए मैंने ऐसा किया:

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

हालाँकि, यह काम नहीं कर रहा है ... मेरे सिंटैक्स में क्या त्रुटि है?

Comments

मैं एक फार्म के अंदर इनपुट पाठ का इस्तेमाल किया ....

— raberana

Answer 1

आपका चयनकर्ता पाठ बॉक्स <div class='textBoxEmployeeNumber'>को उसके अंदर इनपुट के बजाय आसपास से निकाल रहा है।

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

आउटपुट HTML देखने के बाद अपडेट करें

यदि ASP.NET कोड मज़बूती से HTML <input>को एक आईडी विशेषता के साथ आउटपुट करता है id='EmployeeId', तो आप और अधिक बस उपयोग कर सकते हैं:

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

इसे विफल करते हुए, आपको अपने ब्राउज़र के त्रुटि कंसोल में यह सत्यापित करना होगा कि आपके पास अन्य स्क्रिप्ट त्रुटियां नहीं हैं, जिसके कारण यह विफल हो सकता है। ऊपर का पहला उदाहरण इस प्रदर्शन में सही ढंग से काम करता है।

Comments

कोशिश की है कि, काम नहीं कर रहा है .... भी .textBoxEmployeeNumber इनपुट की कोशिश की = [प्रकार = "पाठ"] ... काम भी नहीं

— raberana

@use (Html.BeginForm ()) {@ Html.ValidationSummary (true) <fieldet> <किंवदंती> आरक्षण </ किंवदंती> ......... <div class = "editor-label" @Html। लेबलफ़ॉर (मॉडल => मॉडल। ईम्प्लॉई आई, "कर्मचारी संख्या") </ div> <div class = "editor-field textBoxEmployeeNumber"> @ Html.EditorFor (मॉडल => model.EmployeeId) @ Html.ValidationMessageFor (मॉडल = मॉडल) .EmployeeId) </ div> ..........

— रबराना

<div class = "editor-label"> <लेबल for = "EmployeeId"> कर्मचारी संख्या </ लेबल> </ div> <div class = "editor-field textBoxEmployeeNumber"> <input class = "text-box सिंगल-लाइन" "data-val =" true "data-val-number =" फ़ील्ड EmployeeId एक नंबर होना चाहिए। " data-val-आवश्यक = "कर्मचारी क्षेत्र आवश्यक है।" id = "EmployeeId" नाम = "EmployeeId" प्रकार = "text" value = "/> <span class =" field-validation-valid "data-valmsg-for =" EmployeeId "" data-valmsg-replace = "true" > </ span> </ div>

— raberana

@ RojBeraña क्या ब्राउज़र आपके $ (दस्तावेज़) के अंदर कोड पढ़ता है। वहां अलर्ट रखें: <स्क्रिप्ट प्रकार = "टेक्स्ट / जावास्क्रिप्ट" भाषा = "जावास्क्रिप्ट"> अलर्ट ('दर्ज'); $ (फ़ंक्शन () {$ ('# कर्मचारी')। वैल ("fgg");}); </ script>

— karaxuna

इसी तरह की समस्या है, मूल्य ब्राउज़र में दिखाई देता है, लेकिन जब मैं F12 के साथ कोड की जांच करता हूं, तो value=""बचत के बाद DB में दायर और खाली है।

— सेबस्टियन ज़ेवरी वाईनोनीकी

Answer 2

JQuery का उपयोग करते हुए, हम निम्नलिखित कोड का उपयोग कर सकते हैं:

इनपुट नाम से चयन करें:

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

इनपुट वर्ग द्वारा चयन करें:

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

इनपुट आईडी द्वारा चुनें:

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

Answer 3

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

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

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

Answer 4

आईडी के साथ तत्व के लिए

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

आप मान को सेट कर सकते हैं

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

यहाँ प्रलेखन ।

Answer 5

यह कक्षाओं के लिए है

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

आईडी के लिए

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

अब अगर यू के पास एक फॉर्म में एक आईपूट है तो आप यू का उपयोग कर सकते हैं

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

Answer 6

यहाँ फ़ाइल अपलोड के लिए एक और भिन्नता है जिसमें डिफ़ॉल्ट फ़ाइल अपलोड ब्राउज़ बटन की तुलना में एक अच्छा दिखने वाला बूटस्ट्रैप बटन है। यह 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>

यहाँ स्क्रिप्ट है:

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

Answer 7

शुद्ध js में यह सरल होगा

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>