CODEWITHSUNDEEP
javascriptjquery
user5443928
user5443928

Reputation:

Add placeholder dynamically using Javascript/Jquery

I need one help.I need to add placeholder dynamically into the input field in a loop using Javascript.Let me to explain the code below.

<input class="form-control oditek-td-blank1"   placeholder="e.g:9 AM-10AM" >

Now here my placeholder value e.g:9 AM-10AM i need to add this in a loop means in first itretion it will be e.g:9 AM-10AM in second itretion it will be e.g:10 AM-11AM and so on upto 6 times.Here 6 input field will create and 6 placeholder with different value as given will create dynamically.Please help me.

Upvotes: 0

Views: 1680

Answers (2)

Jai
Jai

Reputation: 74738

You can use something like this, which can enable you to control the creation of elements and start time as well: 

function setInputPlaceholders(num, sTime, duration) {
  var arr = [],
    endTime,
    startTime = sTime;
  for (var i = 0; i < num; i++) {
    endTime = startTime + duration;
    var inp = document.createElement("input");
    inp.type = "text";
    var ampm = startTime <= 12 && endTime <= 12 ? " AM " : " PM "
    inp.setAttribute("placeholder", startTime + ampm + endTime + ampm);
    document.body.appendChild(inp);
    startTime = endTime;
  }
}

setInputPlaceholders(6, 9, 1);

Upvotes: 0

madalinivascu
madalinivascu

Reputation: 32354

try: attr()

 var j = 0;
 var k = 1;
 var type2 ="AM",type= 'AM';
  $('.oditek-td-blank1').each(function(i,v){
      j++; k++;
    if(j>12) {
     type= (type=="AM")?"PM":"AM";
     time = '1 '+type;
     j = 1;
    } else {
     time = j+' '+type;
    }
       if(k>12) {
     type2= (type2=="AM")?"PM":"AM";
     time2 = '1 '+type2;
     k = 1;
    } else {
     time2 = k+' '+type2;
    }
      $(v).attr('placeholder','e.g:'+time+' '+time2 );
});

https://jsfiddle.net/h6w5j6x8/1/

Upvotes: 3

Related Questions