Динамическое создание нескольких текстовых полей в зависимости от минимального количества символов в предыдущем текстовом поле / javascript / asp

Привет, у меня есть веб-форма, в которой мне нужно динамически добавлять несколько текстовых полей в зависимости от записи в предыдущем текстовом поле. Даже если один символ введен в предыдущее текстовое поле, он должен сгенерировать новое текстовое поле рядом с ним, не теряя фокуса из предыдущего текстового поля, и он должен позвольте мне ввести столько символов без ограничений .. Вот мой код:

    getId = function ()
     {
        var id = 1;
        return function () 
        {
            id++;
        }
    }

    function CreateTextbox()
     {
        var box = document.getElementById("divCreateTextbox");
        var curr = 'txt' + getId();
        var inp = document.createElement('input');

        inp.type = 'text';
        inp.name = 'textfield';
        inp.setAttribute("id", curr);
        inp.setAttribute("minlength",'1');
        box.appendChild(inp);
        inp.setAttribute('onkeyup', 'moveOnMin(this)');
        inp.focus();

    }

    function moveOnMin(s)
     {
      if(s.value.length >= parseInt(s.getAttribute("minlength")))
      {

         CreateTextbox();
      }

The problem with the above code is, it is just allowing me to enter 1 character in one textbox and shifts the focus on new textbox. Everytime I try to enter more than one character in the textbox it creates new textboxes for each character. Any solutions ??


person Rithu    schedule 09.05.2013    source источник
comment
Я вызываю функцию как ‹Body› ‹div id = divCreateTextbox› ‹/div› ‹тип скрипта = текст / javascript› window.onload = function () {CreateTextbox ()} ‹/script› ‹/Body›   -  person Rithu    schedule 09.05.2013


Ответы (1)


Попробуй это.

function CreateTextbox()
{
    var box = document.getElementById("divCreateTextbox");
    var curr = 'txt' + getId();
    var inp = document.createElement('input');

    inp.type = 'text';
    inp.name = 'textfield';
    inp.setAttribute("id", curr);
    inp.setAttribute("minlength",'1');
    box.appendChild(inp);
    inp.setAttribute('onkeyup', 'moveOnMin(this)');
    inp.setAttribute("textBoxAdded", "0");
    //inp.focus();

}

function moveOnMin(s)
{
    if (s.value.length == parseInt(s.getAttribute("minlength")) && s.getAttribute("textBoxAdded") == "0") 
{
        CreateTextbox();
        s.setAttribute("textBoxAdded", "1");
        s.focus();
    }
}

Я изменил ваш код на: 1. Фокус на существующем TextBox; и 2. пусть TextBox добавляется только один раз из каждого TextBox

person Khadim Ali    schedule 09.05.2013
comment
Я тестировал его в IE 8.0. в каком браузере вы тестируете? - person Khadim Ali; 09.05.2013
comment
Плюс, как вы сказали выше ... Каждый раз, когда я пытаюсь ввести более одного символа в текстовое поле, он создает новые текстовые поля для каждого символа., Означает, что код раньше работал на вашей стороне. Я только что внес несколько изменений. - person Khadim Ali; 09.05.2013
comment
да, али его создание текстового поля изначально, но не создание нового текстового поля, когда я ввожу в него текст .. вы видели код m, используемый для вызова функции? ‹Asp: Label ID = Label13 runat = server Text = Scan› ‹/ asp: Label› ‹div id = divCreateTextbox› ‹/div› ‹тип скрипта = text / javascript› window.onload = function () {CreateTextbox ()} ‹/Script› - person Rithu; 09.05.2013
comment
Извините, я не изменил кое-что в новом коде ... теперь он работает правильно :) - person Rithu; 09.05.2013
comment
Спасибо ! Могу ли я динамически добавлять столбцы в Gridview в соответствии с количеством сгенерированных текстовых полей? - person Rithu; 09.05.2013
comment
Да, обратитесь к этому для примера кода stackoverflow.com/questions/4696165/ - person Khadim Ali; 10.05.2013