Question

I am new to javascript. I just want to take input in the created textfield.

So that I created a ul tag with id cstList.

and called a function listData() on the onclick event

Inside that I am trying to create a input tag inside a div tag.

After creation I am not able to type in the textfield.

Can anybody tell me, why is it so?

Here is my listData() code

function listData()
    {       
        //var a = sessionStorage.getItem('id');
        if(sessionStorage == null)
        {
            alert("Session storage not supported here");
        }
        else
        {
            var ss = sessionStorage.getItem('id');
            alert("storage value is: "+ss);
        }
    var rows = prompt('Please type in the number of required rows');
    var listCode = '';

    for (var i = 0; i < rows; i++) {
        var listID = 'list_' + i.toString();
        var divID = 'div_' + i.toString();
        var inputIdp = 'inputp_'+ i.toString();
        var inputIdq = 'inputq_'+ i.toString();
          //  listCode += '<li id="' + listID + '><div id = "'+ divID + '"> <input type= "text" id= "boltQTY" name= "boltQTY" value = "abc"/> <input type= "text" id= "a" name= "boltQTY" value = "abc" size="5"/></div></li>';

          listCode += "<li id='" + listID + "'><div id = '"+ divID + "'> <input type='text' id='" + inputIdp + "' name='" + inputIdp + "' value='' size='15'/> <input type='text' id='" + inputIdq + "' name='" + inputIdq + "' value='' size='15'/> </div></li>";

            //variable = "string" + var1 + "string=' " + var2 +"' ";
    }
    document.getElementById('cstList').innerHTML = listCode;
    }

Answer 1

I got an answer. That was the issue with the iscroll, discussed on the group.google.com.

Resolved the problem of entering the value in text field by the below code.

Create this code in new js file.

iScroll.prototype.handleEvent = function(e) {
    var that = this,
        hasTouch = 'ontouchstart' in window && !isTouchPad,
        vendor = (/webkit/i).test(navigator.appVersion) ? 'webkit' :
                 (/firefox/i).test(navigator.userAgent) ? 'Moz' :
                 'opera' in window ? 'O' : '',
        RESIZE_EV = 'onorientationchange' in window ? 'orientationchange' : 'resize',
        START_EV = hasTouch ? 'touchstart' : 'mousedown',
        MOVE_EV = hasTouch ? 'touchmove' : 'mousemove',
        END_EV = hasTouch ? 'touchend' : 'mouseup',
        CANCEL_EV = hasTouch ? 'touchcancel' : 'mouseup',
        WHEEL_EV = vendor == 'Moz' ? 'DOMMouseScroll' : 'mousewheel';

    switch(e.type) {
        case START_EV:
            if (that.checkInputs(e.target.tagName)) {
                return;
            }

            if (!hasTouch && e.button !== 0) return;

            that._start(e);
            break;
        case MOVE_EV: 
            that._move(e); 
            break;
        case END_EV:
            if (that.checkInputs(e.target.tagName)) {
                return;
            }
        case CANCEL_EV: 
            that._end(e);
            break;
        case RESIZE_EV: 
            that._resize();
            break;
        case WHEEL_EV: 
            that._wheel(e); 
            break;
        case 'mouseout': 
            that._mouseout(e); 
            break;
        case 'webkitTransitionEnd': 
            that._transitionEnd(e); 
            break;
    }
}

iScroll.prototype.checkInputs = function(tagName) {
    if (tagName === 'INPUT' || tagName === 'TEXTFIELD' || tagName === 'SELECT') {
        return true;
    } else {
        return false;
    }
}