I have created dynamic table using javascript,But the problem is I want to mannually trigger click event of dynamically added text boxes on change event of dynamically added dropdown
-
1show your relevant codeJYoThI– JYoThI2017-07-27 11:33:41 +00:00Commented Jul 27, 2017 at 11:33
-
Do you have javascript functions associated to the click handlers? Then why don't you call the click handler function, instead of triggering click event through the browser?Nisarg Shah– Nisarg Shah2017-07-28 05:16:25 +00:00Commented Jul 28, 2017 at 5:16
Add a comment
|
2 Answers
if you're using jQuery you can use .trigger('click') on the element that has the click listener, if you aren't using jQuery you can do more or less the same with .dispatchEvent():
function simulateClick() {
var event = new MouseEvent('click', {
'view': window,
'bubbles': true,
'cancelable': true
});
var cb = document.getElementById('checkbox');
var cancelled = !cb.dispatchEvent(event);
if (cancelled) {
// A handler called preventDefault.
alert("cancelled");
} else {
// None of the handlers called preventDefault.
alert("not cancelled");
}
}
Comments
If you are using pure javascript
Try this
var table = document.createElement("table");
table.border=1
table.cellPadding=10
table.cellSpacing=0
for(var i=0;i<5;i++){
var tr = document.createElement("tr");
var td1 = document.createElement("td");
var td2 = document.createElement("td");
var td3 = document.createElement("td");
td1.innerHTML=i+1;
var tb = document.createElement("input");
tb.type="text";
//Binding Event to textbox
tb.addEventListener('click',function(){
alert("Clicked")
})
var ddl = document.createElement("select");
for(var j=0;j<3;j++){
var ddlOption=document.createElement("option");
ddlOption.value=j+1;
ddlOption.innerHTML=j+1;
ddl.appendChild(ddlOption);
}
//Binding Event to dropdownlist
ddl.addEventListener('change',function(){
alert(this.value);
})
td2.appendChild(tb);
td3.appendChild(ddl);
tr.appendChild(td1);
tr.appendChild(td2);
tr.appendChild(td3);
table.appendChild(tr);
}
document.getElementById("MyDiv").appendChild(table)
<Div id="MyDiv">
</Div>