Vahid Alvandi
Vahid Alvandi

Reputation: 612

how i can set value to input text box programmatically in jquery

i set address image file to a text box with click a button this work okay.

i need a listener to get value from text box and show alert. i don't need use change event i don't use keyboard value insert by a function

$("#add").click(function(){
   $("input").val('http://localhost/afa/uploads/source/error-img.png'); 
});

after insert address file i show a alert with content value input

var val = $("#fieldID4").val();
files2.push({src:val});
updateList2(files2.length-1);


  function updateList2(n) {
    var e = thumb.clone();
    e.find('img').attr('src',files2[n].src);
    e.find('button').click(removeFromList).data('n',n);
    gallery.append(e);

    function removeFromList() {
        files2[$(this).data('n')] = null;
        $(this).parent().remove();
    }    
}

Upvotes: 2

Views: 5971

Answers (2)

gaetanoM
gaetanoM

Reputation: 42054

As well described in fire event on programmatic change you may do something like:

window.onload = function (e) {
  var myInput = document.getElementById('myInput');
  Object.defineProperty(myInput, 'value', {
    enumerable: true,
    configurable: true,
    get: function(){
      return this.getAttribute('value');
    },
    set: function(val){
      this.setAttribute('value', val);
      var event = new Event('InputChanged');
      this.dispatchEvent(event);
    }
  });
}

$(function () {
  $('#myInput').on('InputChanged', function(e) {
    alert('InputChanged Event: ' + this.value);
  });

  $('#myInput').on('change', function(e) {
    alert('Standard input change event: ' + this.value);
  });

  $('#btn').on('click', function(e) {
    e.preventDefault();
    var newValue = $('#newInput').val() || 'NewText';
    $('#myInput').val(newValue);
  })
});
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

<form>
    Original Input: <input id="myInput"><br>
    Write here....: <input id="newInput"><br>
    <button id="btn">Change Input Text</button>
</form>

Upvotes: 1

Vahid Alvandi
Vahid Alvandi

Reputation: 612

i solve this problem with use onchange event

[http://www.w3schools.com/jsref/event_onchange.asp][1]

   <input  id="fieldID4" type="text" onchange="myFunction()" value="" >

function myFunction() {
    var val = document.getElementById("fieldID4").value;

files2.push({src:val});
updateList2(files2.length-1);


}

Upvotes: 3

Related Questions